matrix/matrix-react-sdk
1
0
Fork 0
mirror of https://github.com/matrix-org/matrix-react-sdk.git synced 2025-07-31 13:44:28 +03:00
Code Activity

New theme ui in user settings (#12576)

Browse Source 
* Add hook to get the theme

* Adapt subsection settings to new ui

* WIP new theme subsection

* Add theme selection

* Fix test types

* Disabled theme selector when system theme is used

* Update compound to `4.4.1`

* Add custom theme support

* Remove old ThemChoicePanel

* Fix QuickThemeSwitcher-test.tsx

* Fix AppearanceUserSettingsTab-test.tsx

* Update i18n

* Fix ThemeChoicePanel-test.tsx

* Update `@vector-im/compound-web`

* Small tweaks

* Fix CSS comments and use compound variable

* Remove custom theme title

* i18n: update

* test: add tests to theme selection

* test: update AppearanceUserSettingsTab-test snapshot

* test: rework custom theme

* playwright: fix audio-player.spec.ts

* playwright: appearance tab

* test: update snapshot

* playright: add custom theme

* i18n: use correct char for ellipsis

* a11y: add missing aria-label to delete button

* dialog: update close button tooltip

* theme: remove local state and handle custom delete

* theme: don't add twice the same custom theme

* test: update snapshot

* playwright: update snapshot

* custom theme: add background to custom theme list

* update compound web

* Use new destructive property on `IconButton` of theme panel

* test: update snapshots

* rename new ui into legacy

* remove wrong constructor doc

* fix theme selector padding

* theme selector: fix key

* test: fix e2e
This commit is contained in:
Florian Duros
2024-06-26 17:47:01 +02:00
committed by GitHub
parent 8ede89101a
commit 33a017b528
30 changed files with 1749 additions and 477 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
test/components/views/spaces/QuickThemeSwitcher-test.tsx
View File

@ -21,17 +21,17 @@ import { mocked } from "jest-mock";
import QuickThemeSwitcher from "../../../../src/components/views/spaces/QuickThemeSwitcher";
import { getOrderedThemes } from "../../../../src/theme";
import ThemeChoicePanel from "../../../../src/components/views/settings/ThemeChoicePanel";
import SettingsStore from "../../../../src/settings/SettingsStore";
import { SettingLevel } from "../../../../src/settings/SettingLevel";
import dis from "../../../../src/dispatcher/dispatcher";
import { Action } from "../../../../src/dispatcher/actions";
import { mockPlatformPeg } from "../../../test-utils/platform";
import { useTheme } from "../../../../src/hooks/useTheme";
jest.mock("../../../../src/theme");
jest.mock("../../../../src/components/views/settings/ThemeChoicePanel", () => ({
calculateThemeState: jest.fn(),
jest.mock("../../../../src/hooks/useTheme", () => ({
useTheme: jest.fn(),
}));
jest.mock("../../../../src/theme");
jest.mock("../../../../src/settings/SettingsStore", () => ({
setValue: jest.fn(),
getValue: jest.fn(),
@ -59,9 +59,10 @@ describe("<QuickThemeSwitcher />", () => {
{ id: "light", name: "Light" },
{ id: "dark", name: "Dark" },
]);
mocked(ThemeChoicePanel).calculateThemeState.mockClear().mockReturnValue({
mocked(useTheme).mockClear().mockReturnValue({
theme: "light",
useSystemTheme: false,
systemThemeActivated: false,
});
mocked(SettingsStore).setValue.mockClear().mockResolvedValue();
mocked(dis).dispatch.mockClear();
@ -85,9 +86,9 @@ describe("<QuickThemeSwitcher />", () => {
});
it("renders dropdown correctly when use system theme is truthy", () => {
mocked(ThemeChoicePanel).calculateThemeState.mockClear().mockReturnValue({
mocked(useTheme).mockClear().mockReturnValue({
theme: "light",
useSystemTheme: true,
systemThemeActivated: true,
});
renderComponent();
expect(screen.getByText("Match system")).toBeInTheDocument();