@inventreedb/ui 0.0.1 → 0.0.2

package/src/router.tsx

@@ -1,213 +0,0 @@
-import { lazy } from 'react';
-import { Navigate, Route, Routes } from 'react-router-dom';
-
-import { Loadable } from './functions/loading';
-
-// Lazy loaded pages
-export const LayoutComponent = Loadable(
-  lazy(() => import('./components/nav/Layout'))
-);
-export const LoginLayoutComponent = Loadable(
-  lazy(() => import('./pages/Auth/Layout'))
-);
-
-export const Home = Loadable(lazy(() => import('./pages/Index/Home')));
-
-export const CompanyDetail = Loadable(
-  lazy(() => import('./pages/company/CompanyDetail'))
-);
-
-export const CustomerDetail = Loadable(
-  lazy(() => import('./pages/company/CustomerDetail'))
-);
-
-export const SupplierDetail = Loadable(
-  lazy(() => import('./pages/company/SupplierDetail'))
-);
-
-export const ManufacturerDetail = Loadable(
-  lazy(() => import('./pages/company/ManufacturerDetail'))
-);
-
-export const SupplierPartDetail = Loadable(
-  lazy(() => import('./pages/company/SupplierPartDetail'))
-);
-
-export const ManufacturerPartDetail = Loadable(
-  lazy(() => import('./pages/company/ManufacturerPartDetail'))
-);
-
-export const CategoryDetail = Loadable(
-  lazy(() => import('./pages/part/CategoryDetail'))
-);
-export const PartDetail = Loadable(
-  lazy(() => import('./pages/part/PartDetail'))
-);
-
-export const LocationDetail = Loadable(
-  lazy(() => import('./pages/stock/LocationDetail'))
-);
-
-export const StockDetail = Loadable(
-  lazy(() => import('./pages/stock/StockDetail'))
-);
-
-export const BuildIndex = Loadable(
-  lazy(() => import('./pages/build/BuildIndex'))
-);
-
-export const BuildDetail = Loadable(
-  lazy(() => import('./pages/build/BuildDetail'))
-);
-
-export const PurchasingIndex = Loadable(
-  lazy(() => import('./pages/purchasing/PurchasingIndex'))
-);
-
-export const PurchaseOrderDetail = Loadable(
-  lazy(() => import('./pages/purchasing/PurchaseOrderDetail'))
-);
-
-export const SalesIndex = Loadable(
-  lazy(() => import('./pages/sales/SalesIndex'))
-);
-
-export const SalesOrderDetail = Loadable(
-  lazy(() => import('./pages/sales/SalesOrderDetail'))
-);
-
-export const SalesOrderShipmentDetail = Loadable(
-  lazy(() => import('./pages/sales/SalesOrderShipmentDetail'))
-);
-
-export const ReturnOrderDetail = Loadable(
-  lazy(() => import('./pages/sales/ReturnOrderDetail'))
-);
-
-export const Scan = Loadable(lazy(() => import('./pages/Index/Scan')));
-
-export const ErrorPage = Loadable(lazy(() => import('./pages/ErrorPage')));
-
-export const Notifications = Loadable(
-  lazy(() => import('./pages/Notifications'))
-);
-
-export const UserSettings = Loadable(
-  lazy(() => import('./pages/Index/Settings/UserSettings'))
-);
-
-export const SystemSettings = Loadable(
-  lazy(() => import('./pages/Index/Settings/SystemSettings'))
-);
-
-export const AdminCenter = Loadable(
-  lazy(() => import('./pages/Index/Settings/AdminCenter/Index'))
-);
-
-// Core object
-export const CoreIndex = Loadable(lazy(() => import('./pages/core/CoreIndex')));
-export const UserDetail = Loadable(
-  lazy(() => import('./pages/core/UserDetail'))
-);
-export const GroupDetail = Loadable(
-  lazy(() => import('./pages/core/GroupDetail'))
-);
-
-export const NotFound = Loadable(
-  lazy(() => import('./components/errors/NotFound'))
-);
-
-// Auth
-export const Login = Loadable(lazy(() => import('./pages/Auth/Login')));
-export const LoggedIn = Loadable(lazy(() => import('./pages/Auth/LoggedIn')));
-export const Logout = Loadable(lazy(() => import('./pages/Auth/Logout')));
-export const Register = Loadable(lazy(() => import('./pages/Auth/Register')));
-export const Mfa = Loadable(lazy(() => import('./pages/Auth/MFA')));
-export const MfaSetup = Loadable(lazy(() => import('./pages/Auth/MFASetup')));
-export const ChangePassword = Loadable(
-  lazy(() => import('./pages/Auth/ChangePassword'))
-);
-export const Reset = Loadable(lazy(() => import('./pages/Auth/Reset')));
-export const ResetPassword = Loadable(
-  lazy(() => import('./pages/Auth/ResetPassword'))
-);
-export const VerifyEmail = Loadable(
-  lazy(() => import('./pages/Auth/VerifyEmail'))
-);
-
-// Routes
-export const routes = (
-  <Routes>
-    <Route path='*' element={<NotFound />} errorElement={<ErrorPage />} />
-    <Route path='/' element={<LayoutComponent />} errorElement={<ErrorPage />}>
-      <Route index element={<Home />} />,
-      <Route path='home/' element={<Home />} />,
-      <Route path='notifications/*' element={<Notifications />} />,
-      <Route path='scan/' element={<Scan />} />,
-      <Route path='settings/'>
-        <Route index element={<Navigate to='admin/' />} />
-        <Route path='admin/*' element={<AdminCenter />} />
-        <Route path='system/*' element={<SystemSettings />} />
-        <Route path='user/*' element={<UserSettings />} />
-      </Route>
-      <Route path='part/'>
-        <Route index element={<Navigate to='category/index/' />} />
-        <Route path='category/:id?/*' element={<CategoryDetail />} />
-        <Route path=':id/*' element={<PartDetail />} />
-      </Route>
-      <Route path='stock/'>
-        <Route index element={<Navigate to='location/index/' />} />
-        <Route path='location/:id?/*' element={<LocationDetail />} />
-        <Route path='item/:id/*' element={<StockDetail />} />
-      </Route>
-      <Route path='manufacturing/'>
-        <Route index element={<Navigate to='index/' />} />
-        <Route path='index/*' element={<BuildIndex />} />
-        <Route path='build-order/:id/*' element={<BuildDetail />} />
-      </Route>
-      <Route path='purchasing/'>
-        <Route index element={<Navigate to='index/' />} />
-        <Route path='index/*' element={<PurchasingIndex />} />
-        <Route path='purchase-order/:id/*' element={<PurchaseOrderDetail />} />
-        <Route path='supplier/:id/*' element={<SupplierDetail />} />
-        <Route path='supplier-part/:id/*' element={<SupplierPartDetail />} />
-        <Route path='manufacturer/:id/*' element={<ManufacturerDetail />} />
-        <Route
-          path='manufacturer-part/:id/*'
-          element={<ManufacturerPartDetail />}
-        />
-      </Route>
-      <Route path='company/:id/*' element={<CompanyDetail />} />
-      <Route path='sales/'>
-        <Route index element={<Navigate to='index/' />} />
-        <Route path='index/*' element={<SalesIndex />} />
-        <Route path='sales-order/:id/*' element={<SalesOrderDetail />} />
-        <Route path='shipment/:id/*' element={<SalesOrderShipmentDetail />} />
-        <Route path='return-order/:id/*' element={<ReturnOrderDetail />} />
-        <Route path='customer/:id/*' element={<CustomerDetail />} />
-      </Route>
-      <Route path='core/'>
-        <Route index element={<Navigate to='index/' />} />
-        <Route path='index/*' element={<CoreIndex />} />
-        <Route path='user/:id/*' element={<UserDetail />} />
-        <Route path='group/:id/*' element={<GroupDetail />} />
-      </Route>
-    </Route>
-    <Route
-      path='/'
-      element={<LoginLayoutComponent />}
-      errorElement={<ErrorPage />}
-    >
-      <Route path='/login' element={<Login />} />,
-      <Route path='/logged-in' element={<LoggedIn />} />
-      <Route path='/logout' element={<Logout />} />,
-      <Route path='/register' element={<Register />} />,
-      <Route path='/mfa' element={<Mfa />} />,
-      <Route path='/mfa-setup' element={<MfaSetup />} />,
-      <Route path='/change-password' element={<ChangePassword />} />
-      <Route path='/reset-password' element={<Reset />} />
-      <Route path='/set-password' element={<ResetPassword />} />
-      <Route path='/verify-email/:key' element={<VerifyEmail />} />
-    </Route>
-  </Routes>
-);

package/src/states/ApiState.tsx

@@ -1,85 +0,0 @@
-import { create } from 'zustand';
-import { createJSONStorage, persist } from 'zustand/middleware';
-
-import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
-import { apiUrl } from '@lib/functions/Api';
-import type { AuthConfig, AuthContext } from '@lib/types/Auth';
-import { api } from '../App';
-import { emptyServerAPI } from '../defaults/defaults';
-import type { ServerAPIProps } from './states';
-
-interface ServerApiStateProps {
-  server: ServerAPIProps;
-  setServer: (newServer: ServerAPIProps) => void;
-  fetchServerApiState: () => void;
-  auth_config?: AuthConfig;
-  auth_context?: AuthContext;
-  setAuthContext: (auth_context: AuthContext) => void;
-  sso_enabled: () => boolean;
-  registration_enabled: () => boolean;
-  sso_registration_enabled: () => boolean;
-  password_forgotten_enabled: () => boolean;
-}
-
-function get_server_setting(val: any) {
-  if (val === null || val === undefined) {
-    return false;
-  }
-  return val;
-}
-
-export const useServerApiState = create<ServerApiStateProps>()(
-  persist(
-    (set, get) => ({
-      server: emptyServerAPI,
-      setServer: (newServer: ServerAPIProps) => set({ server: newServer }),
-      fetchServerApiState: async () => {
-        // Fetch server data
-        await api
-          .get(apiUrl(ApiEndpoints.api_server_info))
-          .then((response) => {
-            set({ server: response.data });
-          })
-          .catch(() => {
-            console.error('ERR: Error fetching server info');
-          });
-
-        // Fetch login/SSO behaviour
-        await api
-          .get(apiUrl(ApiEndpoints.auth_config), {
-            headers: { Authorization: '' }
-          })
-          .then((response) => {
-            set({ auth_config: response.data.data });
-          })
-          .catch(() => {
-            console.error('ERR: Error fetching SSO information');
-          });
-      },
-      auth_config: undefined,
-      auth_context: undefined,
-      setAuthContext(auth_context) {
-        set({ auth_context });
-      },
-      sso_enabled: () => {
-        const data = get().auth_config?.socialaccount.providers;
-        return !(data === undefined || data.length == 0);
-      },
-      registration_enabled: () => {
-        return get_server_setting(get().server?.settings?.registration_enabled);
-      },
-      sso_registration_enabled: () => {
-        return get_server_setting(get().server?.settings?.sso_registration);
-      },
-      password_forgotten_enabled: () => {
-        return get_server_setting(
-          get().server?.settings?.password_forgotten_enabled
-        );
-      }
-    }),
-    {
-      name: 'server-api-state',
-      storage: createJSONStorage(() => sessionStorage)
-    }
-  )
-);

package/src/states/IconState.tsx

@@ -1,94 +0,0 @@
-import { create } from 'zustand';
-
-import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
-import { apiUrl } from '@lib/functions/Api';
-import { t } from '@lingui/core/macro';
-import { hideNotification, showNotification } from '@mantine/notifications';
-import { api } from '../App';
-import { generateUrl } from '../functions/urls';
-
-type IconPackage = {
-  name: string;
-  prefix: string;
-  fonts: Record<string, string>;
-  icons: Record<
-    string,
-    {
-      name: string;
-      category: string;
-      tags: string[];
-      variants: Record<string, string>;
-    }
-  >;
-};
-
-type IconState = {
-  hasLoaded: boolean;
-  packages: IconPackage[];
-  packagesMap: Record<string, IconPackage>;
-  fetchIcons: () => Promise<void>;
-};
-
-export const useIconState = create<IconState>()((set, get) => ({
-  hasLoaded: false,
-  packages: [],
-  packagesMap: {},
-  fetchIcons: async () => {
-    if (get().hasLoaded) return;
-
-    const packs = await api.get(apiUrl(ApiEndpoints.icons)).catch((_error) => {
-      console.error('ERR: Could not fetch icon packages');
-
-      hideNotification('icon-fetch-error');
-
-      showNotification({
-        id: 'icon-fetch-error',
-        title: t`Error`,
-        message: t`Error loading icon package from server`,
-        color: 'red'
-      });
-    });
-
-    if (!packs) {
-      return;
-    }
-
-    await Promise.all(
-      packs.data.map(async (pack: any) => {
-        if (pack.prefix && pack.fonts) {
-          const fontName = `inventree-icon-font-${pack.prefix}`;
-          const src = Object.entries(pack.fonts as Record<string, string>)
-            .map(
-              ([format, url]) => `url(${generateUrl(url)}) format("${format}")`
-            )
-            .join(',\n');
-          const font = new FontFace(fontName, `${src};`);
-          await font.load();
-          document.fonts.add(font);
-          return font;
-        } else {
-          console.error(
-            "ERR: Icon package is missing 'prefix' or 'fonts' field"
-          );
-          hideNotification('icon-fetch-error');
-          showNotification({
-            id: 'icon-fetch-error',
-            title: t`Error`,
-            message: t`Error loading icon package from server`,
-            color: 'red'
-          });
-
-          return null;
-        }
-      })
-    );
-
-    set({
-      hasLoaded: true,
-      packages: packs.data,
-      packagesMap: Object.fromEntries(
-        packs.data?.map((pack: any) => [pack.prefix, pack])
-      )
-    });
-  }
-}));

package/src/states/LocalState.tsx

@@ -1,181 +0,0 @@
-import type { DataTableSortStatus } from 'mantine-datatable';
-import { create } from 'zustand';
-import { persist } from 'zustand/middleware';
-
-import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
-import { apiUrl } from '@lib/functions/Api';
-import type { UserTheme } from '@lib/types/Core';
-import type { HostList } from '@lib/types/Server';
-import { api } from '../App';
-import { useUserState } from './UserState';
-
-interface LocalStateProps {
-  autoupdate: boolean;
-  toggleAutoupdate: () => void;
-  host: string;
-  getHost: () => string;
-  setHost: (newHost: string, newHostKey: string) => void;
-  hostKey: string;
-  hostList: HostList;
-  setHostList: (newHostList: HostList) => void;
-  language: string;
-  setLanguage: (newLanguage: string, noPatch?: boolean) => void;
-  userTheme: UserTheme;
-  setTheme: (
-    newValues: {
-      key: keyof UserTheme;
-      value: string;
-    }[],
-    noPatch?: boolean
-  ) => void;
-  // panels
-  lastUsedPanels: Record<string, string>;
-  setLastUsedPanel: (panelKey: string) => (value: string) => void;
-  tableColumnNames: Record<string, Record<string, string>>;
-  getTableColumnNames: (tableKey: string) => Record<string, string>;
-  setTableColumnNames: (
-    tableKey: string
-  ) => (names: Record<string, string>) => void;
-  tableSorting: Record<string, any>;
-  getTableSorting: (tableKey: string) => DataTableSortStatus;
-  setTableSorting: (
-    tableKey: string
-  ) => (sorting: DataTableSortStatus<any>) => void;
-  clearTableColumnNames: () => void;
-  detailDrawerStack: number;
-  addDetailDrawer: (value: number | false) => void;
-  navigationOpen: boolean;
-  setNavigationOpen: (value: boolean) => void;
-  allowMobile: boolean;
-  setAllowMobile: (value: boolean) => void;
-}
-
-export const useLocalState = create<LocalStateProps>()(
-  persist(
-    (set, get) => ({
-      autoupdate: false,
-      toggleAutoupdate: () =>
-        set((state) => ({ autoupdate: !state.autoupdate })),
-      host: '',
-      getHost: () => {
-        // Retrieve and validate the API host
-        const state = get();
-
-        let host = state.host;
-
-        // If the server provides an override for the host, use that
-        if (window.INVENTREE_SETTINGS?.api_host) {
-          host = window.INVENTREE_SETTINGS.api_host;
-        }
-
-        // If no host is provided, use the first host in the list
-        if (!host && Object.keys(state.hostList).length) {
-          host = Object.values(state.hostList)[0].host;
-        }
-
-        // If no host is provided, fallback to using the current URL (default)
-        if (!host) {
-          host = window.location.origin;
-        }
-        return host;
-      },
-      setHost: (newHost, newHostKey) =>
-        set({ host: newHost, hostKey: newHostKey }),
-      hostKey: '',
-      hostList: {},
-      setHostList: (newHostList) => set({ hostList: newHostList }),
-      language: 'en',
-      setLanguage: (newLanguage, noPatch = false) => {
-        set({ language: newLanguage });
-        if (!noPatch) patchUser('language', newLanguage);
-      },
-      userTheme: {
-        primaryColor: 'indigo',
-        whiteColor: '#fff',
-        blackColor: '#000',
-        radius: 'xs',
-        loader: 'oval'
-      },
-      setTheme: (newValues, noPatch = false) => {
-        const newTheme = { ...get().userTheme };
-        newValues.forEach((val) => {
-          newTheme[val.key] = val.value;
-        });
-        set({ userTheme: newTheme });
-        if (!noPatch) patchUser('theme', newTheme);
-      },
-      // panels
-      lastUsedPanels: {},
-      setLastUsedPanel: (panelKey) => (value) => {
-        const currentValue = get().lastUsedPanels[panelKey];
-        if (currentValue !== value) {
-          set({
-            lastUsedPanels: { ...get().lastUsedPanels, [panelKey]: value }
-          });
-        }
-      },
-      // tables
-      tableColumnNames: {},
-      getTableColumnNames: (tableKey) => {
-        return get().tableColumnNames[tableKey] || null;
-      },
-      setTableColumnNames: (tableKey) => (names) => {
-        // Update the table column names for the given table
-        set({
-          tableColumnNames: {
-            ...get().tableColumnNames,
-            [tableKey]: names
-          }
-        });
-      },
-      clearTableColumnNames: () => {
-        set({ tableColumnNames: {} });
-      },
-      tableSorting: {},
-      getTableSorting: (tableKey) => {
-        return get().tableSorting[tableKey] || {};
-      },
-      setTableSorting: (tableKey) => (sorting) => {
-        // Update the table sorting for the given table
-        set({
-          tableSorting: {
-            ...get().tableSorting,
-            [tableKey]: sorting
-          }
-        });
-      },
-      // detail drawers
-      detailDrawerStack: 0,
-      addDetailDrawer: (value) => {
-        set({
-          detailDrawerStack:
-            value === false ? 0 : get().detailDrawerStack + value
-        });
-      },
-      // navigation
-      navigationOpen: false,
-      setNavigationOpen: (value) => {
-        set({ navigationOpen: value });
-      },
-      allowMobile: false,
-      setAllowMobile: (value) => {
-        set({ allowMobile: value });
-      }
-    }),
-    {
-      name: 'session-settings'
-    }
-  )
-);
-
-/*
-pushes changes in user profile to backend
-*/
-function patchUser(key: 'language' | 'theme', val: any) {
-  const uid = useUserState.getState().userId();
-  if (uid) {
-    api.patch(apiUrl(ApiEndpoints.user_profile), { [key]: val });
-  } else {
-    console.log('user not logged in, not patching');
-  }
-}