pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[REF] web,*: dark mode uses service instead of legacy api

Browse Source 
This commit adapts the codebase to match its enterprise counterpart
where calls to legacy cookie api (cf. web.utils.cookies) are replaced by
cookie_service ones.

closes odoo/odoo#104080

X-original-commit: 724469e19ff83e91a41c6721e334df1ad8d1c02c
Related: odoo/enterprise#33189
Signed-off-by: Pierre Paridans (app) <app@odoo.com>
This commit is contained in:
Romain Estievenart
2022-10-25 19:39:51 +02:00
committed by Pierre Paridans
parent e574a13a6d
commit a172be756f
11 changed files with 94 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/crm/static/tests/forecast_view_tests.js
+2
View File
@@ -12,6 +12,7 @@ import { makeView, setupViewRegistries } from "@web/../tests/views/helpers";
import { registry } from "@web/core/registry";
import { mock } from "web.test_utils";
import { browser } from "@web/core/browser/browser";
import { fakeCookieService } from "@web/../tests/helpers/mock_services";
const patchDate = mock.patchDate;
@@ -61,6 +62,7 @@ QUnit.module("Views", (hooks) => {
};
setupViewRegistries();
serviceRegistry.add("menu", menuService);
serviceRegistry.add("cookie", fakeCookieService);
target = getFixture();
});
addons/project/static/tests/burndown_chart_tests.js
+2 -1
View File
@@ -6,7 +6,7 @@ import { setupControlPanelServiceRegistry, toggleGroupByMenu, toggleMenuItem, to
import { dialogService } from "@web/core/dialog/dialog_service";
import { makeView } from "@web/../tests/views/helpers";
import { registry } from "@web/core/registry";
import { makeFakeNotificationService } from "@web/../tests/helpers/mock_services";
import { makeFakeNotificationService, fakeCookieService } from "@web/../tests/helpers/mock_services";
import { getFirstElementForXpath } from './project_test_utils';
const serviceRegistry = registry.category("services");
@@ -75,6 +75,7 @@ QUnit.module("Project", {}, () => {
force: true,
});
serviceRegistry.add("dialog", dialogService);
serviceRegistry.add("cookie", fakeCookieService);
});
QUnit.module("BurndownChart");
addons/web/static/src/views/fields/ace/ace_field.js
+3 -3
View File
@@ -4,17 +4,17 @@
import { loadJS } from "@web/core/assets";
import { _lt } from "@web/core/l10n/translation";
import { registry } from "@web/core/registry";
import { useService } from '@web/core/utils/hooks';
import { formatText } from "../formatters";
import { standardFieldProps } from "../standard_field_props";
import { getCookie } from "web.utils.cookies";
const { Component, onWillStart, onWillUpdateProps, useEffect, useRef } = owl;
const colorSchemeCookie = getCookie("color_scheme");
export class AceField extends Component {
setup() {
this.aceEditor = null;
this.editorRef = useRef("editor");
this.cookies = useService('cookie');
onWillStart(async () => {
await loadJS("/web/static/lib/ace/ace.js");
@@ -48,7 +48,7 @@ export class AceField extends Component {
this.aceEditor.setOptions({
maxLines: Infinity,
showPrintMargin: false,
theme: (colorSchemeCookie && colorSchemeCookie === "dark" ? 'ace/theme/monokai' : ''),
theme: (this.cookies.current.color_scheme === "dark" ? 'ace/theme/monokai' : ''),
});
this.aceEditor.$blockScrolling = true;
addons/web/static/src/views/fields/journal_dashboard_graph/journal_dashboard_graph_field.js
+17 -6
View File
@@ -4,12 +4,14 @@ import { loadJS } from "@web/core/assets";
import { registry } from "@web/core/registry";
import { getColor, hexToRGBA } from "@web/views/graph/colors";
import { standardFieldProps } from "../standard_field_props";
import { useService } from "@web/core/utils/hooks";
const { Component, onWillStart, useEffect, useRef } = owl;
export class JournalDashboardGraphField extends Component {
setup() {
this.chart = null;
this.cookies = useService("cookie");
this.canvasRef = useRef("canvas");
this.data = JSON.parse(this.props.value);
@@ -50,8 +52,11 @@ export class JournalDashboardGraphField extends Component {
const labels = this.data[0].values.map(function (pt) {
return pt.x;
});
const borderColor = this.data[0].is_sample_data ? hexToRGBA(getColor(10), 0.1) : getColor(10);
const backgroundColor = this.data[0].is_sample_data ? hexToRGBA(getColor(10), 0.05) : hexToRGBA(getColor(10), 0.2);
const color10 = getColor(10, this.cookies.current.color_scheme);
const borderColor = this.data[0].is_sample_data ? hexToRGBA(color10, 0.1) : color10;
const backgroundColor = this.data[0].is_sample_data
? hexToRGBA(color10, 0.05)
: hexToRGBA(color10, 0.2);
return {
type: "line",
data: {
@@ -93,12 +98,18 @@ export class JournalDashboardGraphField extends Component {
const labels = [];
const backgroundColor = [];
this.data[0].values.forEach(function (pt) {
const color13 = getColor(13, this.cookies.current.color_scheme);
const color19 = getColor(19, this.cookies.current.color_scheme);
this.data[0].values.forEach((pt) => {
data.push(pt.value);
labels.push(pt.label);
const color =
pt.type === "past" ? getColor(13) : pt.type === "future" ? getColor(19) : "#ebebeb";
backgroundColor.push(color);
if (pt.type === "past") {
backgroundColor.push(color13);
} else if (pt.type === "future") {
backgroundColor.push(color19);
} else {
backgroundColor.push("#ebebeb");
}
});
return {
type: "bar",
addons/web/static/src/views/graph/colors.js
+10 -7
View File
@@ -1,7 +1,5 @@
/** @odoo-module **/
import { getCookie } from "web.utils.cookies";
const COLORS_BRIGHT = [
"#1f77b4",
"#ff7f0e",
@@ -48,20 +46,25 @@ const COLORS_DARK = [
"#10efed", // Dashboards Secondary
];
export const COLORS = getCookie("color_scheme") === "dark" ? COLORS_DARK : COLORS_BRIGHT;
export function getColors(colorScheme) {
return colorScheme === "dark" ? COLORS_DARK : COLORS_BRIGHT;
}
/**
* @param {number} index
* @param {string} colorScheme
* @returns {string}
*/
export function getColor(index) {
return COLORS[index % COLORS.length];
export function getColor(index, colorScheme) {
const colors = getColors(colorScheme);
return colors[index % colors.length];
}
export const DEFAULT_BG = "#d3d3d3";
export const BORDER_WHITE =
getCookie("color_scheme") === "dark" ? "rgba(0, 0, 0, 0.6)" : "rgba(255,255,255,0.6)";
export function getBorderWhite(colorScheme) {
return colorScheme === "dark" ? "rgba(0, 0, 0, 0.6)" : "rgba(255,255,255,0.6)";
}
const RGB_REGEX = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i;
addons/web/static/src/views/graph/graph_renderer.js
+22 -12
View File
@@ -1,12 +1,13 @@
/** @odoo-module **/
import { _lt } from "@web/core/l10n/translation";
import { BORDER_WHITE, DEFAULT_BG, getColor, hexToRGBA } from "./colors";
import { getBorderWhite, DEFAULT_BG, getColor, hexToRGBA } from "./colors";
import { formatFloat } from "@web/views/fields/formatters";
import { SEP } from "./graph_model";
import { sortBy } from "@web/core/utils/arrays";
import { loadJS } from "@web/core/assets";
import { renderToString } from "@web/core/utils/render";
import { useService } from "@web/core/utils/hooks";
const { Component, onWillUnmount, useEffect, useRef, onWillStart } = owl;
@@ -47,6 +48,7 @@ export class GraphRenderer extends Component {
this.rootRef = useRef("root");
this.canvasRef = useRef("canvas");
this.containerRef = useRef("container");
this.cookies = useService("cookie");
this.chart = null;
this.tooltip = null;
@@ -211,7 +213,7 @@ export class GraphRenderer extends Component {
dataset.stack = domains[dataset.originIndex].description || "";
}
// set dataset color
dataset.backgroundColor = getColor(index);
dataset.backgroundColor = getColor(index, this.cookies.current.color_scheme);
}
return data;
@@ -281,7 +283,10 @@ export class GraphRenderer extends Component {
const hidden = metaData.some((data) => data[index] && data[index].hidden);
const fullText = label;
const text = shortenLabel(fullText);
const fillStyle = label === NO_DATA ? DEFAULT_BG : getColor(index);
const fillStyle =
label === NO_DATA
? DEFAULT_BG
: getColor(index, this.cookies.current.color_scheme);
return { text, fullText, fillStyle, hidden, index };
});
return labels;
@@ -322,20 +327,22 @@ export class GraphRenderer extends Component {
getLineChartData() {
const { groupBy, domains, stacked, cumulated } = this.model.metaData;
const data = this.model.data;
const color0 = getColor(0, this.cookies.current.color_scheme);
const color1 = getColor(1, this.cookies.current.color_scheme);
for (let index = 0; index < data.datasets.length; ++index) {
const dataset = data.datasets[index];
if (groupBy.length <= 1 && domains.length > 1) {
if (dataset.originIndex === 0) {
dataset.fill = "origin";
dataset.backgroundColor = hexToRGBA(getColor(0), LINE_FILL_TRANSPARENCY);
dataset.borderColor = getColor(0);
dataset.backgroundColor = hexToRGBA(color0, LINE_FILL_TRANSPARENCY);
dataset.borderColor = color0;
} else if (dataset.originIndex === 1) {
dataset.borderColor = getColor(1);
dataset.borderColor = color1;
} else {
dataset.borderColor = getColor(index);
dataset.borderColor = getColor(index, this.cookies.current.color_scheme);
}
} else {
dataset.borderColor = getColor(index);
dataset.borderColor = getColor(index, this.cookies.current.color_scheme);
}
if (data.labels.length === 1) {
// shift of the real value to right. This is done to
@@ -361,7 +368,7 @@ export class GraphRenderer extends Component {
if (data.datasets.length === 1 && data.datasets[0].originIndex === 0) {
const dataset = data.datasets[0];
dataset.fill = "origin";
dataset.backgroundColor = hexToRGBA(getColor(0), LINE_FILL_TRANSPARENCY);
dataset.backgroundColor = hexToRGBA(color0, LINE_FILL_TRANSPARENCY);
}
// center the points in the chart (without that code they are put
// on the left and the graph seems empty)
@@ -379,10 +386,13 @@ export class GraphRenderer extends Component {
const data = this.model.data;
// style/complete data
// give same color to same groups from different origins
const colors = data.labels.map((_, index) => getColor(index));
const colors = data.labels.map((_, index) =>
getColor(index, this.cookies.current.color_scheme)
);
const borderColor = getBorderWhite(this.cookies.current.color_scheme);
for (const dataset of data.datasets) {
dataset.backgroundColor = colors;
dataset.borderColor = BORDER_WHITE;
dataset.borderColor = borderColor;
}
// make sure there is a zone associated with every origin
const representedOriginIndexes = new Set(
@@ -400,7 +410,7 @@ export class GraphRenderer extends Component {
data: fakeData,
trueLabels: fakeTrueLabels,
backgroundColor: [...colors, DEFAULT_BG],
borderColor: BORDER_WHITE,
borderColor,
});
addNoDataToLegend = true;
}
addons/web/static/tests/helpers/mock_services.js
+9
View File
@@ -233,6 +233,14 @@ export const fakeTitleService = {
},
};
export const fakeColorSchemeService = {
start() {
return {
switchToColorScheme() {},
};
},
};
export function makeFakeNotificationService(mock) {
return {
start() {
@@ -306,6 +314,7 @@ export function makeFakeHTTPService(getResponse, postResponse) {
}
export const mocks = {
color_scheme: () => fakeColorSchemeService,
company: () => fakeCompanyService,
command: () => fakeCommandService,
cookie: () => fakeCookieService,
addons/web/static/tests/views/fields/ace_editor_field_tests.js
+3
View File
@@ -1,8 +1,10 @@
/** @odoo-module **/
import { registry } from "@web/core/registry";
import { getFixture, triggerEvents } from "@web/../tests/helpers/utils";
import { pagerNext } from "@web/../tests/search/helpers";
import { makeView, setupViewRegistries } from "@web/../tests/views/helpers";
import { fakeCookieService } from "@web/../tests/helpers/mock_services";
let serverData;
let target;
@@ -31,6 +33,7 @@ QUnit.module("Fields", (hooks) => {
};
setupViewRegistries();
registry.category("services").add("cookie", fakeCookieService);
});
QUnit.module("AceEditorField");
addons/web/static/tests/views/fields/journal_dashboard_graph_field_tests.js
+3
View File
@@ -1,5 +1,7 @@
/** @odoo-module **/
import { registry } from "@web/core/registry";
import { fakeCookieService } from "@web/../tests/helpers/mock_services";
import { click, getFixture, nextTick, triggerEvent } from "@web/../tests/helpers/utils";
import { makeView, setupViewRegistries } from "@web/../tests/views/helpers";
@@ -83,6 +85,7 @@ QUnit.module("Fields", (hooks) => {
};
setupViewRegistries();
registry.category("services").add("cookie", fakeCookieService);
});
async function reloadKanbanView(target) {
addons/web/static/tests/views/graph_view_tests.js
+20 -18
View File
@@ -26,9 +26,10 @@ import { makeView, setupViewRegistries } from "@web/../tests/views/helpers";
import { createWebClient, doAction } from "@web/../tests/webclient/helpers";
import { browser } from "@web/core/browser/browser";
import { registry } from "@web/core/registry";
import { BORDER_WHITE, DEFAULT_BG, COLORS, hexToRGBA } from "@web/views/graph/colors";
import { getBorderWhite, DEFAULT_BG, getColors, hexToRGBA } from "@web/views/graph/colors";
import { GraphArchParser } from "@web/views/graph/graph_arch_parser";
import { patchWithCleanup } from "../helpers/utils";
import { fakeCookieService } from "@web/../tests/helpers/mock_services";
const serviceRegistry = registry.category("services");
@@ -312,6 +313,7 @@ QUnit.module("Views", (hooks) => {
patchWithCleanup(browser, { setTimeout: (fn) => fn() });
target = getFixture();
registry.category("services").add("cookie", fakeCookieService);
});
QUnit.module("GraphView");
@@ -1148,9 +1150,9 @@ QUnit.module("Views", (hooks) => {
"pointBackgroundColor",
];
const datasets = getChart(graph).data.datasets;
const colors = getColors();
for (let i = 0; i < datasets.length; i++) {
const expectedColor = COLORS[i];
const expectedColor = colors[i];
expectedDatasets.push({
backgroundColor: hexToRGBA(expectedColor, 0.4),
borderColor: expectedColor,
@@ -1610,7 +1612,7 @@ QUnit.module("Views", (hooks) => {
checkLabels(assert, graph, ["Total"]);
checkDatasets(assert, graph, ["backgroundColor", "borderColor", "data", "label", "stack"], {
backgroundColor: ["#1f77b4"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [8],
label: "",
stack: undefined,
@@ -1635,7 +1637,7 @@ QUnit.module("Views", (hooks) => {
checkLabels(assert, graph, ["false", "true"]);
checkDatasets(assert, graph, ["backgroundColor", "borderColor", "data"], {
backgroundColor: ["#1f77b4", "#ff7f0e"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [5, 3],
});
checkLegend(assert, graph, ["false", "true"]);
@@ -1660,7 +1662,7 @@ QUnit.module("Views", (hooks) => {
checkLabels(assert, graph, ["Undefined", "black", "red"]);
checkDatasets(assert, graph, ["backgroundColor", "borderColor", "data"], {
backgroundColor: ["#1f77b4", "#ff7f0e", "#aec7e8"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [8, 10, 13],
});
checkLegend(assert, graph, ["Undefined", "black", "red"]);
@@ -1701,7 +1703,7 @@ QUnit.module("Views", (hooks) => {
checkLabels(assert, graph, ["false / xphone", "false / xpad", "true / xphone"]);
checkDatasets(assert, graph, ["backgroundColor", "borderColor", "data", "label"], {
backgroundColor: ["#1f77b4", "#ff7f0e", "#aec7e8"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [1, 4, 3],
label: "",
});
@@ -1747,13 +1749,13 @@ QUnit.module("Views", (hooks) => {
[
{
backgroundColor: ["#1f77b4"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [6],
label: "True group",
},
{
backgroundColor: ["#1f77b4"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [17],
label: "False group",
},
@@ -1817,13 +1819,13 @@ QUnit.module("Views", (hooks) => {
[
{
backgroundColor: ["#1f77b4", "#ff7f0e", "#aec7e8"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [14, 0, 0],
label: "True group",
},
{
backgroundColor: ["#1f77b4", "#ff7f0e", "#aec7e8"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [12, 5, 2],
label: "False group",
},
@@ -1927,13 +1929,13 @@ QUnit.module("Views", (hooks) => {
[
{
backgroundColor: ["#1f77b4", "#ff7f0e", "#aec7e8", "#ffbb78"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [1, 1, 0, 0],
label: "February 2021",
},
{
backgroundColor: ["#1f77b4", "#ff7f0e", "#aec7e8", "#ffbb78"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [1, 1, 1, 1],
label: "January 2021",
},
@@ -2052,13 +2054,13 @@ QUnit.module("Views", (hooks) => {
[
{
backgroundColor: ["#1f77b4", "#ff7f0e", "#aec7e8"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [14, 0, 0],
label: "February 2021",
},
{
backgroundColor: ["#1f77b4", "#ff7f0e", "#aec7e8"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [0, 12, 5],
label: "January 2021",
},
@@ -2115,7 +2117,7 @@ QUnit.module("Views", (hooks) => {
[
{
backgroundColor: [DEFAULT_BG],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [1],
label: null,
},
@@ -2152,13 +2154,13 @@ QUnit.module("Views", (hooks) => {
[
{
backgroundColor: ["#1f77b4"],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [1],
label: "True group",
},
{
backgroundColor: ["#1f77b4", DEFAULT_BG],
borderColor: BORDER_WHITE,
borderColor: getBorderWhite(),
data: [undefined, 1],
label: "False group",
},
addons/web/static/tests/webclient/actions/window_action_tests.js
+3 -1
View File
@@ -24,7 +24,7 @@ import { errorService } from "../../../src/core/errors/error_service";
import { RPCError } from "@web/core/network/rpc_service";
import { registerCleanup } from "../../helpers/cleanup";
import { WarningDialog } from "@web/core/errors/error_dialogs";
import { makeFakeUserService } from "@web/../tests/helpers/mock_services";
import { makeFakeUserService, fakeCookieService } from "@web/../tests/helpers/mock_services";
import * as cpHelpers from "@web/../tests/search/helpers";
const { onMounted } = owl;
@@ -1171,6 +1171,7 @@ QUnit.module("ActionManager", (hooks) => {
QUnit.test("restore previous view state when switching back", async function (assert) {
assert.expect(5);
registry.category("services").add("cookie", fakeCookieService);
serverData.actions[3].views.unshift([false, "graph"]);
serverData.views["partner,false,graph"] = "<graph/>";
const webClient = await createWebClient({ serverData });
@@ -1231,6 +1232,7 @@ QUnit.module("ActionManager", (hooks) => {
QUnit.test("view switcher is properly highlighted in graph view", async function (assert) {
assert.expect(4);
registry.category("services").add("cookie", fakeCookieService);
serverData.actions[3].views.splice(1, 1, [false, "graph"]);
serverData.views["partner,false,graph"] = "<graph/>";
const webClient = await createWebClient({ serverData });