feat: role system

src/widgets/Layout/index.tsx

@@ -8,7 +8,7 @@ import { AppBar } from "./ui/AppBar";
 import { Drawer } from "./ui/Drawer";
 import { DrawerHeader } from "./ui/DrawerHeader";
 import { NavigationList } from "@features";
-import { authStore, userStore, menuStore, isMediaIdEmpty } from "@shared";
+import { authStore, menuStore, isMediaIdEmpty } from "@shared";
 import { observer } from "mobx-react-lite";
 import { useEffect } from "react";
 import { Typography } from "@mui/material";
@@ -27,13 +27,10 @@ export const Layout: React.FC<LayoutProps> = observer(({ children }) => {
     setIsMenuOpen(open);
   }, [open]);
 
-  const { getUsers, users } = userStore;
+  const { getMeAction, me } = authStore;
 
   useEffect(() => {
-    const fetchUsers = async () => {
-      await getUsers();
-    };
-    fetchUsers();
+    getMeAction();
   }, []);
 
   const handleDrawerOpen = () => {
@@ -68,17 +65,13 @@ export const Layout: React.FC<LayoutProps> = observer(({ children }) => {
 
           <div className="flex gap-2 items-center">
             {(() => {
-              const currentUser = users?.data?.find(
-                (user) => user.id === (authStore.payload as { user_id?: number })?.user_id,
-              );
-              const hasAvatar =
-                currentUser?.icon && !isMediaIdEmpty(currentUser.icon);
+              const hasAvatar = me?.icon && !isMediaIdEmpty(me.icon);
               const token = localStorage.getItem("token");
 
               return (
                 <>
                   <div className="flex flex-col gap-1">
-                    <p className="text-white">{currentUser?.name}</p>
+                    <p className="text-white">{me?.name}</p>
                     <div
                       className="text-center text-xs"
                       style={{
@@ -88,7 +81,7 @@ export const Layout: React.FC<LayoutProps> = observer(({ children }) => {
                         padding: "2px 10px",
                       }}
                     >
-                      {(authStore.payload as { is_admin?: boolean })?.is_admin
+                      {me?.roles?.includes("admin")
                         ? "Администратор"
                         : "Режим пользователя"}
                     </div>
@@ -98,7 +91,7 @@ export const Layout: React.FC<LayoutProps> = observer(({ children }) => {
                       <img
                         src={`${
                           import.meta.env.VITE_KRBL_MEDIA
-                        }${currentUser!.icon}/download?token=${token}`}
+                        }${me?.icon}/download?token=${token}`}
                         alt="Аватар"
                         className="w-full h-full object-cover"
                       />