Login Background Updated

frontend/src/components/NavBarItem.tsx

@@ -30,6 +30,7 @@ export default function NavBarItem({ item }: Props) {
   const currentUser = useAppSelector((state) => state.auth.currentUser);
 
   const userName = `${currentUser?.firstName ? currentUser?.firstName : ""} ${currentUser?.lastName ? currentUser?.lastName : ""}`;
+  const userInitials = `${currentUser?.firstName ? currentUser?.firstName[0] : ""}${currentUser?.lastName ? currentUser?.lastName[0] : ""}`;
 
   const [isDropdownActive, setIsDropdownActive] = useState(false)
 
@@ -46,7 +47,7 @@ export default function NavBarItem({ item }: Props) {
     item.isDesktopNoLabel ? 'lg:w-16 lg:justify-center' : '',
   ].join(' ')
 
-  const itemLabel = item.isCurrentUser ? userName : item.label
+  const itemLabel = item.isCurrentUser ? userInitials : item.label
 
   const handleMenuClick = () => {
     if (item.menu) {

frontend/src/layouts/Authenticated.tsx

@@ -10,10 +10,10 @@ import {findMe, logoutUser} from "../stores/authSlice";
 import axios from 'axios';
 import { mdiAlertCircle } from '@mdi/js';
 import BaseIcon from '../components/BaseIcon';
+import NavBarItemPlain from '../components/NavBarItemPlain';
 import moment from 'moment';
 
 import {hasPermission} from "../helpers/userPermissions";
-import NavBarItemPlain from '../components/NavBarItemPlain';
 
 
 type Props = {
@@ -72,12 +72,6 @@ export default function LayoutAuthenticated({
         const settings = response.data;
         if (settings.lockoutEnabled && settings.lockoutUntil && moment(settings.lockoutUntil).isAfter(moment())) {
           const allowed = settings.allowedUserIds?.includes(currentUser?.id);
-          // Only show banner if user is NOT allowed (or maybe show warning even if allowed?)
-          // User asked: "when the login it states their is currently a lockout".
-          // It implies everyone should see it. Allowed users might need to know they are in lockout mode.
-          // I'll show it to everyone, but maybe change color or text for allowed users?
-          // "Lockout Active (You are allowed to edit)" vs "Lockout Active (Read Only)".
-          // For simplicity, I'll show the standard message.
            setLockoutBanner({
              message: settings.lockoutMessage || `System is currently locked for reconciliation until ${moment(settings.lockoutUntil).format('LLL')}.`,
              until: settings.lockoutUntil

frontend/src/menuAside.ts

@@ -1,110 +1,5 @@
-import * as icon from '@mdi/js';
 import { MenuAsideItem } from './interfaces'
 
-const menuAside: MenuAsideItem[] = [
+const menuAside: MenuAsideItem[] = []
-  {
-    href: '/dashboard',
-    icon: icon.mdiViewDashboardOutline,
-    label: 'Dashboard',
-  },
-  
-  {
-    href: '/users/users-list',
-    label: 'Users',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: icon.mdiAccountGroup ?? icon.mdiTable,
-    permissions: 'READ_USERS'
-  },
-  {
-    href: '/roles/roles-list',
-    label: 'Roles',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: icon.mdiShieldAccountVariantOutline ?? icon.mdiTable,
-    permissions: 'READ_ROLES'
-  },
-  {
-    href: '/permissions/permissions-list',
-    label: 'Permissions',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: icon.mdiShieldAccountOutline ?? icon.mdiTable,
-    permissions: 'READ_PERMISSIONS'
-  },
-  {
-    href: '/holidays/holidays-list',
-    label: 'Holidays',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: 'mdiCalendarHoliday' in icon ? icon['mdiCalendarHoliday' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
-    permissions: 'READ_HOLIDAYS'
-  },
-  {
-    href: '/time_off_requests/time_off_requests-list',
-    label: 'Time off requests',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: 'mdiClipboardTextClock' in icon ? icon['mdiClipboardTextClock' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
-    permissions: 'READ_TIME_OFF_REQUESTS'
-  },
-  {
-    href: '/pto_journal_entries/pto_journal_entries-list',
-    label: 'Pto journal entries',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: 'mdiBookOpenPageVariant' in icon ? icon['mdiBookOpenPageVariant' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
-    permissions: 'READ_PTO_JOURNAL_ENTRIES'
-  },
-  {
-    href: '/pto_journal_entries/balance-adjustment',
-    label: 'Balance Adjustment',
-    icon: icon.mdiScaleBalance,
-    permissions: 'READ_PTO_JOURNAL_ENTRIES'
-  },
-  {
-    href: '/yearly_leave_summaries/yearly_leave_summaries-list',
-    label: 'Yearly leave summaries',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: 'mdiChartBox' in icon ? icon['mdiChartBox' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
-    permissions: 'READ_YEARLY_LEAVE_SUMMARIES'
-  },
-  {
-    href: '/office_calendar_events/office_calendar_events-list',
-    label: 'Office calendar events',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: 'mdiCalendarMonth' in icon ? icon['mdiCalendarMonth' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
-    permissions: 'READ_OFFICE_CALENDAR_EVENTS'
-  },
-  {
-    href: '/approval_tasks/approval_tasks-list',
-    label: 'Approval tasks',
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    icon: 'mdiCheckDecagram' in icon ? icon['mdiCheckDecagram' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
-    permissions: 'READ_APPROVAL_TASKS'
-  },
-  {
-    href: '/profile',
-    label: 'Profile',
-    icon: icon.mdiAccountCircle,
-  },
-  {
-    href: '/settings',
-    label: 'Settings',
-    icon: icon.mdiCog,
-    permissions: 'READ_USERS'
-  },
- 
-  {
-    href: '/api-docs',
-    target: '_blank',
-    label: 'Swagger API',
-    icon: icon.mdiFileCode,
-    permissions: 'READ_API_DOCS'
-  },
-]
 
 export default menuAside

frontend/src/menuNavBar.ts

@@ -3,19 +3,20 @@ import {
   mdiLogout,
   mdiThemeLightDark,
   mdiViewDashboardOutline,
+  mdiCalendarClock,
+  mdiScaleBalance,
   mdiAccountGroup,
-  mdiShieldAccountVariantOutline,
+  mdiCalendarMonth,
-  mdiShieldAccountOutline,
-  mdiCalendarStar,
-  mdiCalendarRange,
   mdiClipboardTextClock,
   mdiBookOpenPageVariant,
   mdiChartBox,
-  mdiCalendarMonth,
+  mdiCog,
   mdiCheckDecagram,
+  mdiCalendarStar,
+  mdiImageArea,
+  mdiShieldAccountOutline,
+  mdiShieldAccountVariantOutline,
   mdiFileCode,
-  mdiAccountCircle,
-  mdiTable
 } from '@mdi/js'
 import { MenuNavBarItem } from './interfaces'
 
@@ -26,46 +27,30 @@ const menuNavBar: MenuNavBarItem[] = [
     label: 'Home',
   },
   {
-    label: 'Management',
+    label: 'PTO',
+    icon: mdiCalendarClock,
     menu: [
       {
-        href: '/users/users-list',
+        href: '/pto_journal_entries/balance-adjustment',
-        label: 'Users',
+        label: 'Adjustment',
-        icon: mdiAccountGroup,
+        icon: mdiScaleBalance,
         permissions: 'READ_USERS'
       },
-      {
-        href: '/roles/roles-list',
-        label: 'Roles',
-        icon: mdiShieldAccountVariantOutline,
-        permissions: 'READ_ROLES'
-      },
-      {
-        href: '/permissions/permissions-list',
-        label: 'Permissions',
-        icon: mdiShieldAccountOutline,
-        permissions: 'READ_PERMISSIONS'
-      },
-      {
-        href: '/api-docs',
-        label: 'Swagger API',
-        icon: mdiFileCode,
-        permissions: 'READ_API_DOCS'
-      },
-    ]
-  },
-  {
-    label: 'PTO & Leaves',
-    menu: [
       {
         href: '/employee-summary',
-        label: 'Employee Summary',
+        label: 'Employee Summaries',
         icon: mdiAccountGroup,
         permissions: 'READ_YEARLY_LEAVE_SUMMARIES'
       },
+      {
+        href: '/office_calendar_events/office_calendar_events-list',
+        label: 'Office Calendar',
+        icon: mdiCalendarMonth,
+        permissions: 'READ_OFFICE_CALENDAR_EVENTS'
+      },
       {
         href: '/time_off_requests/time_off_requests-list',
-        label: 'Time off requests',
+        label: 'Time Off Requests',
         icon: mdiClipboardTextClock,
         permissions: 'READ_TIME_OFF_REQUESTS'
       },
@@ -84,32 +69,46 @@ const menuNavBar: MenuNavBarItem[] = [
     ]
   },
   {
-    label: 'Calendar & Tasks',
+    label: 'Settings',
+    icon: mdiCog,
     menu: [
-      {
-        href: '/office_calendar_events/office_calendar_events-list',
-        label: 'Office Calendar',
-        icon: mdiCalendarMonth,
-        permissions: 'READ_OFFICE_CALENDAR_EVENTS'
-      },
-      {
-        href: '/holidays/holidays-list',
-        label: 'Holidays',
-        icon: mdiCalendarRange,
-        permissions: 'READ_HOLIDAYS'
-      },
-      {
-        href: '/holiday_calendars/holiday_calendars-list',
-        label: 'Holiday Calendars',
-        icon: mdiCalendarStar,
-        permissions: 'READ_HOLIDAY_CALENDARS'
-      },
       {
         href: '/approval_tasks/approval_tasks-list',
         label: 'Approval Tasks',
         icon: mdiCheckDecagram,
         permissions: 'READ_APPROVAL_TASKS'
       },
+      {
+        href: '/holidays/holidays-list',
+        label: 'Holidays',
+        icon: mdiCalendarStar,
+        permissions: 'READ_HOLIDAYS'
+      },
+      {
+        href: '/settings/login-backgrounds',
+        label: 'Login Background',
+        icon: mdiImageArea,
+        permissions: 'READ_USERS'
+      },
+      {
+        href: '/permissions/permissions-list',
+        label: 'Permissions',
+        icon: mdiShieldAccountOutline,
+        permissions: 'READ_PERMISSIONS'
+      },
+      {
+        href: '/roles/roles-list',
+        label: 'Roles',
+        icon: mdiShieldAccountVariantOutline,
+        permissions: 'READ_ROLES'
+      },
+      {
+        href: '/api-docs',
+        target: '_blank',
+        label: 'Swagger API',
+        icon: mdiFileCode,
+        permissions: 'READ_API_DOCS'
+      }
     ]
   },
   {
@@ -135,17 +134,11 @@ const menuNavBar: MenuNavBarItem[] = [
     label: 'Light/Dark',
     isDesktopNoLabel: true,
     isToggleLightDark: true,
-  },
+  }
-  {
-    icon: mdiLogout,
-    label: 'Log out',
-    isDesktopNoLabel: true,
-    isLogout: true,
-  },
 ]
 
 export const webPagesNavBar = [
     
 ];
 
-export default menuNavBar
+export default menuNavBar

frontend/src/pages/settings/login-backgrounds.tsx

@@ -49,7 +49,7 @@ const LoginBackgroundsPage = () => {
     setLoading(true);
     try {
       // 1. Upload file
-      const uploadedFile = await FileUploader.upload('login_backgrounds', file, { image: true });
+      const uploadedFile = await FileUploader.upload('login_backgrounds/image', file, { image: true });
       
       // 2. Save record
       const existing = backgrounds.find(b => b.month === month);
@@ -146,4 +146,4 @@ LoginBackgroundsPage.getLayout = function getLayout(page: ReactElement) {
   return <LayoutAuthenticated>{page}</LayoutAuthenticated>;
 };
 
-export default LoginBackgroundsPage;
+export default LoginBackgroundsPage;