Radiquum/AniX
1
0
Fork 0
mirror of https://github.com/Radiquum/AniX.git synced 2025-05-03 03:19:41 +05:00
Code Issues Projects Releases Packages Wiki Activity Actions

frontend:

Browse source 
Fix undefined api call
Simplify some parts
Better theme management
Add color picker (dynamic themes wohoo)
Add missing lists keys
This commit is contained in:
Kentai Radiquum 2024-04-21 05:35:44 +05:00
parent 17b5693f34
commit 79782b4228
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
8 changed files with 157 additions and 137 deletions
Download patch file Download diff file Expand all files Collapse all files

42
frontend/app/App.jsx
View file

@ -1,21 +1,47 @@
"use client";
import "beercss";
import "material-dynamic-colors";
import { NavigationRail } from "@/app/components/NavigationRail/NavigationRail";
import { useThemeStore } from "./store/theme-store";
import { useEffect } from "react";
// import { useStore } from "./store/app-store";
import { setTheme, getTheme, setMode, getMode } from "./store/theme-store";
import { useEffect, useState } from "react";
import { ColorPicker } from "@/app/components/ColorPicker/ColorPicker";
export const App = (props) => {
const themeStore = useThemeStore();
const [colorPicker, setColorPicker] = useState(false);
const theme = async (from) => {
setTheme(from);
await ui("theme", from);
};
const mode = () => {
let newMode = ui("mode") == "dark" ? "light" : "dark";
setMode(newMode);
ui("mode", getMode());
};
useEffect(() => {
themeStore.checkTheme();
const mode = getMode();
const theme = getTheme();
if (mode != ui("mode")) {
ui("mode", getMode());
}
if (theme != ui("theme")) {
ui("theme", theme);
}
}, []);
return (
<body className={themeStore.theme}>
<NavigationRail />
<main className="responsive">{props.children}</main>
<body>
<NavigationRail
colorPicker={colorPicker}
setColorPicker={setColorPicker}
/>
<main className="responsive">
{colorPicker && <ColorPicker mode={mode} theme={theme} />}
{props.children}
</main>
</body>
);
};