feat: integrated login page and tailwind

2026-08-26 18:42:49 +00:00 · 2026-05-13 14:43:32 +03:00
parent 199a3eba11
commit 7340d00827
8 changed files with 185 additions and 12 deletions
--- a/apps/edr-freight-web/backoffice/vite.config.ts
+++ b/apps/edr-freight-web/backoffice/vite.config.ts
@@ -6,5 +6,5 @@ export default defineConfig({
  server: {
    port: 5183,
    host: "0.0.0.0",
-  }
+  },
 });
--- a/apps/edr-freight-web/portal/index.css
+++ b/apps/edr-freight-web/portal/index.css
@@ -0,0 +1 @@
+@import "tailwindcss";
--- a/apps/edr-freight-web/portal/index.html
+++ b/apps/edr-freight-web/portal/index.html
@@ -8,5 +8,6 @@
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
+    <link rel="stylesheet" href="/index.css" />
  </body>
 </html>
--- a/apps/edr-freight-web/portal/package.json
+++ b/apps/edr-freight-web/portal/package.json
@@ -12,10 +12,10 @@
    "type-check": "tsc --noEmit"
  },
  "dependencies": {
-    "@tria-plc/iamui-common": "1.0.3",
    "@edr/types": "workspace:*",
    "@edr/ui-common": "workspace:*",
    "@tanstack/react-query": "^5.59.0",
+    "@tria-plc/iamui-common": "1.1.1",
    "axios": "^1.7.7",
    "clsx": "^2.1.1",
    "react": "^18.3.1",
@@ -26,13 +26,14 @@
  "devDependencies": {
    "@edr/eslint-config": "workspace:*",
    "@edr/tsconfig": "workspace:*",
+    "@tailwindcss/vite": "^4.3.0",
    "@types/react": "^18.3.11",
    "@types/react-dom": "^18.3.0",
    "@vitejs/plugin-react": "^4.3.2",
    "autoprefixer": "^10.4.20",
    "jsdom": "^25.0.1",
    "postcss": "^8.4.47",
-    "tailwindcss": "^3.4.13",
+    "tailwindcss": "^4.3.0",
    "typescript": "^5.5.4",
    "vite": "^5.4.8",
    "vitest": "^2.1.2"
--- a/apps/edr-freight-web/portal/src/App.tsx
+++ b/apps/edr-freight-web/portal/src/App.tsx
@@ -16,6 +16,7 @@ import TrackingPage from "./pages/tracking/TrackingPage";
 import BillingPage from "./pages/billing/BillingPage";
 import TrainsPage from "./pages/trains/TrainsPage";
 import DashboardPage from "./pages/dashboard/DashboardPage";
+import { IamLoginPage } from "@tria-plc/iamui-common";

 const sidebarItems: SidebarItem[] = [
  { label: "Dashboard", href: "/" },
@@ -38,6 +39,7 @@ const App = () => {
      onNavigate={navigate}
    >
      <Routes>
+        <Route path="/auth" element={<IamLoginPage />} />
        <Route path="/" element={<DashboardPage />} />
        <Route path="/bookings" element={<BookingsPage />} />
        <Route path="/bookings/new" element={<CreateBookingPage />} />
--- a/apps/edr-freight-web/portal/src/main.tsx
+++ b/apps/edr-freight-web/portal/src/main.tsx
@@ -4,15 +4,45 @@ import { BrowserRouter } from "react-router-dom";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";

 import App from "./App";
+import {
+  AuthProvider,
+  BrandingProvider,
+  configureIam,
+} from "@tria-plc/iamui-common";

 const queryClient = new QueryClient();
+window.__IAM_CONFIG__ = {
+  apiUrl: `${import.meta.env.VITE_BASE_API_URL}/api`,
+  postLoginPath: "/user-management",
+};
+window.__USER_MANAGEMENT_BRANDING__ = {
+  organizationName: "EDR Platform",
+  appName: "EDR Portal",
+  moduleBasePath: "/user-management",
+  backToAppPath: "/dashboard",
+  backToAppLabel: "Back to dashboard",
+};
+
+configureIam({
+  apiUrl: `${import.meta.env.VITE_BASE_API_URL}/api`,
+});
+
+const rootElement = document.getElementById("root");
+
+if (!rootElement) {
+  throw new Error("Root element not found");
+}

 createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <QueryClientProvider client={queryClient}>
-      <BrowserRouter>
-        <App />
-      </BrowserRouter>
+      <BrandingProvider>
+        <AuthProvider>
+          <BrowserRouter>
+            <App />
+          </BrowserRouter>
+        </AuthProvider>
+      </BrandingProvider>
    </QueryClientProvider>
  </StrictMode>,
 );
--- a/apps/edr-freight-web/portal/vite.config.ts
+++ b/apps/edr-freight-web/portal/vite.config.ts
@@ -1,10 +1,11 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
+import tailwindcss from "@tailwindcss/vite";

 export default defineConfig({
-  plugins: [react()],
+  plugins: [react(), tailwindcss()],
  server: {
    port: 5173,
    host: "0.0.0.0",
-  }
+  },
 });
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -221,8 +221,8 @@ importers:
        specifier: ^5.59.0
        version: 5.100.10(react@18.3.1)
      '@tria-plc/iamui-common':
-        specifier: 1.0.3
-        version: 1.0.3(iv2eyyfavqphryq7oznx6tfwre)
+        specifier: 1.1.1
+        version: 1.1.1(l3yrqwo7ljy42bdsd6ijtc3cbe)
      axios:
        specifier: ^1.7.7
        version: 1.16.0
@@ -248,6 +248,9 @@ importers:
      '@edr/tsconfig':
        specifier: workspace:*
        version: link:../../../packages/config/tsconfig
+      '@tailwindcss/vite':
+        specifier: ^4.3.0
+        version: 4.3.0(vite@5.4.21(@types/node@24.12.4)(lightningcss@1.32.0)(terser@5.47.1))
      '@types/react':
        specifier: ^18.3.11
        version: 18.3.28
@@ -267,8 +270,8 @@ importers:
        specifier: ^8.4.47
        version: 8.5.14
      tailwindcss:
-        specifier: ^3.4.13
-        version: 3.4.19(yaml@2.9.0)
+        specifier: ^4.3.0
+        version: 4.3.0
      typescript:
        specifier: ^5.5.4
        version: 5.9.3
@@ -3193,6 +3196,13 @@ packages:
  '@tria-plc/iamui-common@1.0.3':
    resolution: {integrity: sha512-RebVPhbHpV4VtaUlBi/sqJlGf0vXrDO6iVq/VvSFgxd10YlEVR7lGvkXC1ManVOK+Aq3d+mBKdDUAVgI5ATZJA==, tarball: https://npm.pkg.github.com/download/@tria-plc/iamui-common/1.0.3/61c1cb36a5737a5c1f2d8595dec8aeca055a3a62}

+  '@tria-plc/iamui-common@1.1.1':
+    resolution: {integrity: sha512-aj9fMxmB/3kwSnN1vl8NvmCrI/1quNjfg9Bb7fJR4HhWEE26foIZC2xeg1ERzQxBll6rMj/R0Zl0+Riv6OONTQ==, tarball: https://npm.pkg.github.com/download/@tria-plc/iamui-common/1.1.1/98fa2e350b807e9d123cab7d75038a027005ef41}
+    peerDependencies:
+      react: 18.3.1
+      react-dom: 18.3.1
+      react-router-dom: ^7.0.0
+
  '@tsconfig/node10@1.0.12':
    resolution: {integrity: sha512-UCYBaeFvM11aU2y3YPZ//O5Rhj+xKyzy7mvcIoAjASbigy8mHMryP5cK7dgjlz2hWxh1g5pLw084E0a/wlUSFQ==}

@@ -13672,6 +13682,133 @@ snapshots:
      - webpack-cli
      - webpack-command

+  '@tria-plc/iamui-common@1.1.1(l3yrqwo7ljy42bdsd6ijtc3cbe)':
+    dependencies:
+      '@chakra-ui/react': 3.35.0(@emotion/react@11.14.0(@types/react@18.3.28)(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@emotion/react': 11.14.0(@types/react@18.3.28)(react@18.3.1)
+      '@emotion/styled': 11.14.1(@emotion/react@11.14.0(@types/react@18.3.28)(react@18.3.1))(@types/react@18.3.28)(react@18.3.1)
+      '@hookform/resolvers': 5.2.2(react-hook-form@7.75.0(react@18.3.1))
+      '@lottiefiles/react-lottie-player': 3.6.0(react@18.3.1)
+      '@mantine/core': 8.3.18(@mantine/hooks@8.3.18(react@18.3.1))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@mantine/dates': 8.3.18(@mantine/core@8.3.18(@mantine/hooks@8.3.18(react@18.3.1))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@mantine/hooks@8.3.18(react@18.3.1))(dayjs@1.11.20)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@mantine/hooks': 8.3.18(react@18.3.1)
+      '@onlyoffice/document-editor-react': 2.1.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-accordion': 1.2.12(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-alert-dialog': 1.1.15(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-avatar': 1.1.11(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-checkbox': 1.3.3(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-collapsible': 1.1.12(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-context-menu': 2.2.16(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-dialog': 1.1.15(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-dropdown-menu': 2.1.16(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-hover-card': 1.1.15(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-label': 2.1.8(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-navigation-menu': 1.2.14(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-popover': 1.1.15(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-progress': 1.1.8(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-radio-group': 1.3.8(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-scroll-area': 1.2.10(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-select': 2.2.6(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-separator': 1.1.8(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-slider': 1.3.6(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-slot': 1.2.4(@types/react@18.3.28)(react@18.3.1)
+      '@radix-ui/react-switch': 1.2.6(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-tabs': 1.1.13(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-toast': 1.2.15(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-toggle-group': 1.1.11(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-tooltip': 1.2.8(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@react-pdf-viewer/core': 3.12.0(pdfjs-dist@3.11.174)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@react-pdf-viewer/default-layout': 3.12.0(pdfjs-dist@3.11.174)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@react-pdf/renderer': 4.5.1(react@18.3.1)
+      '@reduxjs/toolkit': 2.11.2(react-redux@9.2.0(@types/react@18.3.28)(react@18.3.1)(redux@5.0.1))(react@18.3.1)
+      '@tabler/icons-react': 3.44.0(react@18.3.1)
+      '@tanstack/react-query': 5.100.10(react@18.3.1)
+      '@tanstack/react-query-devtools': 5.100.10(@tanstack/react-query@5.100.10(react@18.3.1))(react@18.3.1)
+      '@tanstack/react-table': 8.21.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@tinymce/tinymce-react': 6.3.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tinymce@7.9.2)
+      '@tiptap/extension-color': 3.23.1(@tiptap/extension-text-style@3.23.1(@tiptap/core@3.23.1(@tiptap/pm@3.23.1)))
+      '@tiptap/extension-highlight': 3.23.1(@tiptap/core@3.23.1(@tiptap/pm@3.23.1))
+      '@tiptap/extension-image': 3.23.1(@tiptap/core@3.23.1(@tiptap/pm@3.23.1))
+      '@tiptap/extension-link': 3.23.1(@tiptap/core@3.23.1(@tiptap/pm@3.23.1))(@tiptap/pm@3.23.1)
+      '@tiptap/extension-text-align': 3.23.1(@tiptap/core@3.23.1(@tiptap/pm@3.23.1))
+      '@tiptap/extension-text-style': 3.23.1(@tiptap/core@3.23.1(@tiptap/pm@3.23.1))
+      '@tiptap/extension-underline': 3.23.1(@tiptap/core@3.23.1(@tiptap/pm@3.23.1))
+      '@tiptap/react': 3.23.1(@floating-ui/dom@1.7.6)(@tiptap/core@3.23.1(@tiptap/pm@3.23.1))(@tiptap/pm@3.23.1)(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@tiptap/starter-kit': 3.23.1
+      axios: 1.16.0
+      class-variance-authority: 0.7.1
+      clsx: 2.1.1
+      cmdk: 1.1.1(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      date-fns: 3.6.0
+      dayjs: 1.11.20
+      ethiopian-calendar-date-converter: 2.1.6
+      ethiopian-calendar-new: 1.1.0
+      file-type: 18.7.0
+      framer-motion: 12.38.0(@emotion/is-prop-valid@1.4.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      html2canvas: 1.4.1
+      i18next: 25.10.10(typescript@5.9.3)
+      i18next-browser-languagedetector: 8.2.1
+      jquery: 3.7.1
+      js-cookie: 3.0.5
+      jspdf: 3.0.4
+      lodash: 4.18.1
+      lucide-react: 0.513.0(react@18.3.1)
+      mui-ethiopian-datepicker: 0.3.2(hjxdxgubdlhng5uhyvidfkiyo4)
+      next-themes: 0.4.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      qs: 6.15.1
+      react: 18.3.1
+      react-cookie: 8.1.2(@types/react@18.3.28)(react@18.3.1)
+      react-datepicker: 8.10.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react-day-picker: 9.14.0(react@18.3.1)
+      react-dom: 18.3.1(react@18.3.1)
+      react-dropzone: 14.4.1(react@18.3.1)
+      react-hook-form: 7.75.0(react@18.3.1)
+      react-i18next: 15.7.4(i18next@25.10.10(typescript@5.9.3))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.3)
+      react-icons: 5.6.0(react@18.3.1)
+      react-image-crop: 11.0.10(react@18.3.1)
+      react-intersection-observer: 9.16.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react-is: 19.2.6
+      react-joyride: 2.9.3(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react-pdf: 10.4.1(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react-pdf-html: 2.1.5(@react-pdf/renderer@4.5.1(react@18.3.1))(react@18.3.1)
+      react-redux: 9.2.0(@types/react@18.3.28)(react@18.3.1)(redux@5.0.1)
+      react-resizable-panels: 3.0.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react-router-dom: 6.30.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react-signature-canvas: 1.1.0-alpha.2(@types/prop-types@15.7.15)(@types/react@18.3.28)(prop-types@15.8.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      recharts: 3.8.1(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react-is@19.2.6)(react@18.3.1)(redux@5.0.1)
+      socket.io-client: 4.8.3
+      sonner: 2.0.7(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      tailwind-merge: 3.6.0
+      tailwind-scrollbar-hide: 4.0.0(tailwindcss@4.3.0)
+      tailwindcss: 4.3.0
+      tailwindcss-animate: 1.0.7(tailwindcss@4.3.0)
+      tesseract.js: 7.0.0
+      tinymce: 7.9.2
+      vaul: 1.1.2(@types/react-dom@18.3.7(@types/react@18.3.28))(@types/react@18.3.28)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      xlsx: 0.18.5
+      zod: 3.25.76
+    transitivePeerDependencies:
+      - '@emotion/is-prop-valid'
+      - '@floating-ui/dom'
+      - '@mui/icons-material'
+      - '@mui/material'
+      - '@mui/x-date-pickers'
+      - '@tiptap/core'
+      - '@tiptap/pm'
+      - '@types/prop-types'
+      - '@types/react'
+      - '@types/react-dom'
+      - bufferutil
+      - debug
+      - encoding
+      - pdfjs-dist
+      - prop-types
+      - react-native
+      - redux
+      - supports-color
+      - typescript
+      - utf-8-validate
+
  '@tsconfig/node10@1.0.12': {}

  '@tsconfig/node12@1.0.11': {}