aykhans/slash-e
1
0
Fork 0
mirror of https://github.com/aykhans/slash-e.git synced 2025-04-20 22:07:15 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore: split setting pages

Browse Source
This commit is contained in:
Steven 2023-09-23 09:02:10 +08:00
parent f0ffe2e419
commit 528ecf72a3
4 changed files with 49 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/web/src/components/Header.tsx
View File

@ -10,6 +10,7 @@ import Dropdown from "./common/Dropdown";
const Header: React.FC = () => {
const currentUser = useUserStore().getCurrentUser();
const [showAboutDialog, setShowAboutDialog] = useState<boolean>(false);
const isAdmin = currentUser.role === "ADMIN";
const handleSignOutButtonClick = async () => {
await api.signout();
@ -39,11 +40,19 @@ const Header: React.FC = () => {
actions={
<>
<Link
to="/setting"
to="/setting/general"
className="w-full px-2 flex flex-row justify-start items-center text-left dark:text-gray-400 leading-8 cursor-pointer rounded hover:bg-gray-100 dark:hover:bg-zinc-800 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:opacity-60"
>
<Icon.Settings className="w-4 h-auto mr-2" /> Setting
<Icon.User className="w-4 h-auto mr-2" /> Profile
</Link>
{isAdmin && (
<Link
to="/setting/workspace"
className="w-full px-2 flex flex-row justify-start items-center text-left dark:text-gray-400 leading-8 cursor-pointer rounded hover:bg-gray-100 dark:hover:bg-zinc-800 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:opacity-60"
>
<Icon.Settings className="w-4 h-auto mr-2" /> Setting
</Link>
)}
<button
className="w-full px-2 flex flex-row justify-start items-center text-left dark:text-gray-400 leading-8 cursor-pointer rounded hover:bg-gray-100 dark:hover:bg-zinc-800 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:opacity-60"
onClick={() => setShowAboutDialog(true)}

34
frontend/web/src/pages/Setting.tsx
View File

@ -1,7 +1,5 @@
import { Alert, Divider } from "@mui/joy";
import PreferenceSection from "@/components/setting/PreferenceSection";
import AccessTokenSection from "../components/setting/AccessTokenSection";
import AccountSection from "../components/setting/AccountSection";
import { Alert } from "@mui/joy";
import { useEffect } from "react";
import MemberSection from "../components/setting/MemberSection";
import WorkspaceSection from "../components/setting/WorkspaceSection";
import useUserStore from "../stores/v1/user";
@ -10,21 +8,23 @@ const Setting: React.FC = () => {
const currentUser = useUserStore().getCurrentUser();
const isAdmin = currentUser.role === "ADMIN";
useEffect(() => {
if (!isAdmin) {
window.location.href = "/";
}
}, []);
if (!isAdmin) {
return null;
}
return (
<div className="mx-auto max-w-6xl w-full px-3 md:px-12 py-6 flex flex-col justify-start items-start gap-y-12">
<AccountSection />
<AccessTokenSection />
<PreferenceSection />
{isAdmin && (
<>
<Divider />
<Alert variant="soft" color="warning">
You can see the settings items below because you are an Admin.
</Alert>
<MemberSection />
<WorkspaceSection />
</>
)}
<Alert variant="soft" color="warning">
You can see the settings items below because you are an Admin.
</Alert>
<MemberSection />
<WorkspaceSection />
</div>
);
};

15
frontend/web/src/pages/UserSetting.tsx Normal file
View File

@ -0,0 +1,15 @@
import PreferenceSection from "@/components/setting/PreferenceSection";
import AccessTokenSection from "../components/setting/AccessTokenSection";
import AccountSection from "../components/setting/AccountSection";
const Setting: React.FC = () => {
return (
<div className="mx-auto max-w-6xl w-full px-3 md:px-12 py-6 flex flex-col justify-start items-start gap-y-12">
<AccountSection />
<AccessTokenSection />
<PreferenceSection />
</div>
);
};
export default Setting;

7
frontend/web/src/routers/index.tsx
View File

@ -6,6 +6,7 @@ import Setting from "../pages/Setting";
import ShortcutDetail from "../pages/ShortcutDetail";
import SignIn from "../pages/SignIn";
import SignUp from "../pages/SignUp";
import UserSetting from "../pages/UserSetting";
import { shortcutService } from "../services";
const router = createBrowserRouter([
@ -38,7 +39,11 @@ const router = createBrowserRouter([
},
},
{
path: "/setting",
path: "/setting/general",
element: <UserSetting />,
},
{
path: "/setting/workspace",
element: <Setting />,
},
],