feat(document.json): convert mock data to json

- DocFullView aktualisiert, um Daten als Uint8Array oder Promise<Uint8Array> zu akzeptieren
- Asynchrones Handling in useEffect hinzugefügt, um Daten vor der Erstellung der Objekt-URL aufzulösen
- Verbesserte Bereinigungslogik, um die Objekt-URL richtig zu widerrufen
- Geänderte Format-Prop ist nun erforderlich

src/client/dd-hub-react/.gitignore

@@ -4,21 +4,35 @@ logs
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
 
+# dependencies
 node_modules
-dist
-dist-ssr
-*.local
+.pnp
+.pnp.js
 
-# Editor directories and files
-.vscode/*
-!.vscode/extensions.json
-.idea
+# testing
+coverage
+
+# production
+.next
+.swc
+_static
+out
+dist
+build
+
+# environment variables
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# misc
 .DS_Store
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
+.vercel
+.netlify
+.vscode
+tsconfig.tsbuildinfo
+.ncurc.js
+knip.jsonc

src/client/dd-hub-react/.prettierignore

@@ -0,0 +1,11 @@
+# Build directories
+build/*
+dist/*
+public/*
+**/out/*
+**/.next/*
+**/node_modules/*
+
+yarn.lock
+package-lock.json
+jsconfig.json

src/client/dd-hub-react/eslint.config.js

@@ -1,29 +0,0 @@
-import js from '@eslint/js'
-import globals from 'globals'
-import reactHooks from 'eslint-plugin-react-hooks'
-import reactRefresh from 'eslint-plugin-react-refresh'
-import { defineConfig, globalIgnores } from 'eslint/config'
-
-export default defineConfig([
-  globalIgnores(['dist']),
-  {
-    files: ['**/*.{js,jsx}'],
-    extends: [
-      js.configs.recommended,
-      reactHooks.configs['recommended-latest'],
-      reactRefresh.configs.vite,
-    ],
-    languageOptions: {
-      ecmaVersion: 2020,
-      globals: globals.browser,
-      parserOptions: {
-        ecmaVersion: 'latest',
-        ecmaFeatures: { jsx: true },
-        sourceType: 'module',
-      },
-    },
-    rules: {
-      'no-unused-vars': ['error', { varsIgnorePattern: '^[A-Z_]' }],
-    },
-  },
-])

src/client/dd-hub-react/eslint.config.mjs

@@ -0,0 +1,194 @@
+import globals from 'globals';
+import eslintJs from '@eslint/js';
+import eslintTs from 'typescript-eslint';
+import reactPlugin from 'eslint-plugin-react';
+import importPlugin from 'eslint-plugin-import';
+import reactHooksPlugin from 'eslint-plugin-react-hooks';
+import perfectionistPlugin from 'eslint-plugin-perfectionist';
+import unusedImportsPlugin from 'eslint-plugin-unused-imports';
+
+// ----------------------------------------------------------------------
+
+/**
+ * @rules common
+ * from 'react', 'eslint-plugin-react-hooks'...
+ */
+const commonRules = () => ({
+  ...reactHooksPlugin.configs.recommended.rules,
+  'func-names': 1,
+  'no-bitwise': 2,
+  'no-unused-vars': 0,
+  'object-shorthand': 1,
+  'no-useless-rename': 1,
+  'default-case-last': 2,
+  'consistent-return': 2,
+  'no-constant-condition': 1,
+  'default-case': [2, { commentPattern: '^no default$' }],
+  'lines-around-directive': [2, { before: 'always', after: 'always' }],
+  'arrow-body-style': [2, 'as-needed', { requireReturnForObjectLiteral: false }],
+  // react
+  'react/jsx-key': 0,
+  'react/prop-types': 0,
+  'react/display-name': 0,
+  'react/no-children-prop': 0,
+  'react/jsx-boolean-value': 2,
+  'react/self-closing-comp': 2,
+  'react/react-in-jsx-scope': 0,
+  'react/jsx-no-useless-fragment': [1, { allowExpressions: true }],
+  'react/jsx-curly-brace-presence': [2, { props: 'never', children: 'never' }],
+  // typescript
+  '@typescript-eslint/no-shadow': 2,
+  '@typescript-eslint/no-explicit-any': 0,
+  '@typescript-eslint/no-empty-object-type': 0,
+  '@typescript-eslint/consistent-type-imports': 1,
+  '@typescript-eslint/no-unused-vars': [1, { args: 'none' }],
+});
+
+/**
+ * @rules import
+ * from 'eslint-plugin-import'.
+ */
+const importRules = () => ({
+  ...importPlugin.configs.recommended.rules,
+  'import/named': 0,
+  'import/export': 0,
+  'import/default': 0,
+  'import/namespace': 0,
+  'import/no-named-as-default': 0,
+  'import/newline-after-import': 2,
+  'import/no-named-as-default-member': 0,
+  'import/no-cycle': [
+    0, // disabled if slow
+    { maxDepth: '∞', ignoreExternal: false, allowUnsafeDynamicCyclicDependency: false },
+  ],
+});
+
+/**
+ * @rules unused imports
+ * from 'eslint-plugin-unused-imports'.
+ */
+const unusedImportsRules = () => ({
+  'unused-imports/no-unused-imports': 1,
+  'unused-imports/no-unused-vars': [
+    0,
+    { vars: 'all', varsIgnorePattern: '^_', args: 'after-used', argsIgnorePattern: '^_' },
+  ],
+});
+
+/**
+ * @rules sort or imports/exports
+ * from 'eslint-plugin-perfectionist'.
+ */
+const sortImportsRules = () => {
+  const customGroups = {
+    mui: ['custom-mui'],
+    auth: ['custom-auth'],
+    hooks: ['custom-hooks'],
+    utils: ['custom-utils'],
+    types: ['custom-types'],
+    routes: ['custom-routes'],
+    sections: ['custom-sections'],
+    components: ['custom-components'],
+  };
+
+  return {
+    'perfectionist/sort-named-imports': [1, { type: 'line-length', order: 'asc' }],
+    'perfectionist/sort-named-exports': [1, { type: 'line-length', order: 'asc' }],
+    'perfectionist/sort-exports': [
+      1,
+      {
+        order: 'asc',
+        type: 'line-length',
+        groupKind: 'values-first',
+      },
+    ],
+    'perfectionist/sort-imports': [
+      2,
+      {
+        order: 'asc',
+        ignoreCase: true,
+        type: 'line-length',
+        environment: 'node',
+        maxLineLength: undefined,
+        newlinesBetween: 'always',
+        internalPattern: ['^src/.+'],
+        groups: [
+          'style',
+          'side-effect',
+          'type',
+          ['builtin', 'external'],
+          customGroups.mui,
+          customGroups.routes,
+          customGroups.hooks,
+          customGroups.utils,
+          'internal',
+          customGroups.components,
+          customGroups.sections,
+          customGroups.auth,
+          customGroups.types,
+          ['parent', 'sibling', 'index'],
+          ['parent-type', 'sibling-type', 'index-type'],
+          'object',
+          'unknown',
+        ],
+        customGroups: {
+          value: {
+            [customGroups.mui]: ['^@mui/.+'],
+            [customGroups.auth]: ['^src/auth/.+'],
+            [customGroups.hooks]: ['^src/hooks/.+'],
+            [customGroups.utils]: ['^src/utils/.+'],
+            [customGroups.types]: ['^src/types/.+'],
+            [customGroups.routes]: ['^src/routes/.+'],
+            [customGroups.sections]: ['^src/sections/.+'],
+            [customGroups.components]: ['^src/components/.+'],
+          },
+        },
+      },
+    ],
+  };
+};
+
+/**
+ * Custom ESLint configuration.
+ */
+export const customConfig = {
+  plugins: {
+    'react-hooks': reactHooksPlugin,
+    'unused-imports': unusedImportsPlugin,
+    perfectionist: perfectionistPlugin,
+    import: importPlugin,
+  },
+  settings: {
+    // https://www.npmjs.com/package/eslint-import-resolver-typescript
+    ...importPlugin.configs.typescript.settings,
+    'import/resolver': {
+      ...importPlugin.configs.typescript.settings['import/resolver'],
+      typescript: {
+        project: './tsconfig.json',
+      },
+    },
+  },
+  rules: {
+    ...commonRules(),
+    ...importRules(),
+    ...unusedImportsRules(),
+    ...sortImportsRules(),
+  },
+};
+
+// ----------------------------------------------------------------------
+
+export default [
+  { files: ['**/*.{js,mjs,cjs,ts,jsx,tsx}'] },
+  { ignores: ['*', '!src/', '!eslint.config.*'] },
+  {
+    languageOptions: {
+      globals: { ...globals.browser, ...globals.node },
+    },
+    settings: { react: { version: 'detect' } },
+  },
+  eslintJs.configs.recommended,
+  ...eslintTs.configs.recommended,
+  reactPlugin.configs.flat.recommended,
+  customConfig,
+];

src/client/dd-hub-react/index.html

@@ -2,12 +2,14 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="theme-color" content="#000000" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React</title>
+    <title>Hub</title>
   </head>
+
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.jsx"></script>
+    <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>

src/client/dd-hub-react/package.json

@@ -5,26 +5,68 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vite build",
-    "lint": "eslint .",
-    "preview": "vite preview"
+    "start": "vite preview",
+    "build": "tsc && vite build",
+    "lint": "eslint \"src/**/*.{js,jsx,ts,tsx}\"",
+    "lint:fix": "eslint --fix \"src/**/*.{js,jsx,ts,tsx}\"",
+    "lint:print": "npx eslint --print-config eslint.config.mjs > eslint-show-config.json",
+    "fm:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx}\"",
+    "fm:fix": "prettier --write \"src/**/*.{js,jsx,ts,tsx}\"",
+    "fix:all": "npm run lint:fix && npm run fm:fix",
+    "clean": "rm -rf node_modules .next out dist build",
+    "re:dev": "yarn clean && yarn install && yarn dev",
+    "re:build": "yarn clean && yarn install && yarn build",
+    "re:build-npm": "npm run clean && npm install && npm run build",
+    "tsc:dev": "yarn dev & yarn tsc:watch",
+    "tsc:watch": "tsc --noEmit --watch",
+    "tsc:print": "npx tsc --showConfig"
   },
+  "engines": {
+    "node": ">=20"
+  },
+  "packageManager": "yarn@1.22.22",
   "dependencies": {
+    "@emotion/cache": "^11.14.0",
     "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.1",
-    "@mui/material": "^7.2.0",
+    "@emotion/styled": "^11.14.0",
+    "@fontsource-variable/dm-sans": "^5.2.5",
+    "@fontsource/barlow": "^5.2.5",
+    "@iconify/react": "^5.2.1",
+    "@mui/icons-material": "^7.2.0",
+    "@mui/lab": "^7.0.0-beta.10",
+    "@mui/material": "^7.0.1",
+    "@mui/x-date-pickers": "^8.7.0",
+    "apexcharts": "^4.5.0",
+    "dayjs": "^1.11.13",
+    "es-toolkit": "^1.34.1",
+    "lodash.debounce": "^4.0.8",
+    "minimal-shared": "^1.0.7",
     "react": "^19.1.0",
-    "react-dom": "^19.1.0"
+    "react-apexcharts": "^1.7.0",
+    "react-dom": "^19.1.0",
+    "react-router-dom": "^7.4.1",
+    "simplebar-react": "^3.3.0"
   },
   "devDependencies": {
-    "@eslint/js": "^9.29.0",
-    "@types/react": "^19.1.8",
-    "@types/react-dom": "^19.1.6",
-    "@vitejs/plugin-react": "^4.5.2",
-    "eslint": "^9.29.0",
+    "@eslint/js": "^9.23.0",
+    "@types/lodash.debounce": "^4.0.9",
+    "@types/node": "^22.14.0",
+    "@types/react": "^19.1.0",
+    "@types/react-dom": "^19.1.1",
+    "@typescript-eslint/parser": "^8.29.0",
+    "@vitejs/plugin-react-swc": "^3.8.1",
+    "eslint": "^9.23.0",
+    "eslint-import-resolver-typescript": "^4.3.1",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-perfectionist": "^4.11.0",
+    "eslint-plugin-react": "^7.37.4",
     "eslint-plugin-react-hooks": "^5.2.0",
-    "eslint-plugin-react-refresh": "^0.4.20",
-    "globals": "^16.2.0",
-    "vite": "^7.0.0"
+    "eslint-plugin-unused-imports": "^4.1.4",
+    "globals": "^16.0.0",
+    "prettier": "^3.5.3",
+    "typescript": "^5.8.2",
+    "typescript-eslint": "^8.29.0",
+    "vite": "^6.2.5",
+    "vite-plugin-checker": "^0.9.1"
   }
 }

src/client/dd-hub-react/prettier.config.mjs

@@ -0,0 +1,15 @@
+/**
+ * @type {import("prettier").Config}
+ * Need to restart IDE when changing configuration
+ * Open the command palette (Ctrl + Shift + P) and execute the command > Reload Window.
+ */
+const config = {
+  semi: true,
+  tabWidth: 2,
+  endOfLine: 'lf',
+  printWidth: 100,
+  singleQuote: true,
+  trailingComma: 'es5',
+};
+
+export default config;

src/client/dd-hub-react/public/api/document.json

@@ -0,0 +1,230 @@
+[
+    {
+        "id": 1,
+        "name": "example1.pdf",
+        "addedWhen": "2024-01-12T10:00:00.000Z",
+        "addedWho": "TekH",
+        "attributes": [
+            {
+                "name": "invoiceNumber",
+                "serilizedValue": "INV-20250714-001"
+            },
+            {
+                "name": "customerName",
+                "serilizedValue": "John Doe"
+            },
+            {
+                "name": "startDate",
+                "serilizedValue": "2025-07-01"
+            },
+            {
+                "name": "endDate",
+                "serilizedValue": "2025-07-14"
+            },
+            {
+                "name": "minAmount",
+                "serilizedValue": "100.50"
+            },
+            {
+                "name": "maxAmount",
+                "serilizedValue": "1000.00"
+            },
+            {
+                "name": "taxIncluded",
+                "serilizedValue": "true"
+            },
+            {
+                "name": "createdAt",
+                "serilizedValue": "2025-07-10"
+            },
+            {
+                "name": "deliveryTime",
+                "serilizedValue": "15:30:00"
+            },
+            {
+                "name": "lastUpdated",
+                "serilizedValue": "2025-07-14T10:45:00"
+            }
+        ]
+    },
+    {
+        "id": 2,
+        "name": "example2.pdf",
+        "addedWhen": "2024-02-03T09:30:00.000Z",
+        "addedWho": "bob",
+        "changedWhen": "2024-03-15T12:00:00.000Z",
+        "changedWho": "KammM",
+        "attributes": [
+            {
+                "name": "invoiceNumber",
+                "serilizedValue": "INV-20250701-007"
+            },
+            {
+                "name": "customerName",
+                "serilizedValue": "Jane Smith"
+            },
+            {
+                "name": "startDate",
+                "serilizedValue": "2025-06-01"
+            },
+            {
+                "name": "endDate",
+                "serilizedValue": "2025-06-30"
+            },
+            {
+                "name": "minAmount",
+                "serilizedValue": "250.00"
+            },
+            {
+                "name": "maxAmount",
+                "serilizedValue": "850.75"
+            },
+            {
+                "name": "taxIncluded",
+                "serilizedValue": "false"
+            },
+            {
+                "name": "createdAt",
+                "serilizedValue": "2025-06-15"
+            },
+            {
+                "name": "deliveryTime",
+                "serilizedValue": "09:00:00"
+            },
+            {
+                "name": "lastUpdated",
+                "serilizedValue": "2025-06-30T14:15:00"
+            }
+        ]
+    },
+    {
+        "id": 3,
+        "name": "document1.docx",
+        "addedWhen": "2023-12-20T14:45:00.000Z",
+        "addedWho": "SchreiberM",
+        "attributes": [
+            {
+                "name": "invoiceNumber",
+                "serilizedValue": "INV-20250620-043"
+            },
+            {
+                "name": "customerName",
+                "serilizedValue": "Max Mustermann"
+            },
+            {
+                "name": "startDate",
+                "serilizedValue": "2025-05-01"
+            },
+            {
+                "name": "endDate",
+                "serilizedValue": "2025-05-15"
+            },
+            {
+                "name": "maxAmount",
+                "serilizedValue": "600.00"
+            },
+            {
+                "name": "taxIncluded",
+                "serilizedValue": "true"
+            },
+            {
+                "name": "createdAt",
+                "serilizedValue": "2025-05-02"
+            },
+            {
+                "name": "lastUpdated",
+                "serilizedValue": "2025-05-15T11:00:00"
+            }
+        ]
+    },
+    {
+        "id": 4,
+        "name": "spreadsheet1.xlsx",
+        "addedWhen": "2024-05-01T08:15:00.000Z",
+        "addedWho": "KammM",
+        "changedWhen": "2024-06-10T16:20:00.000Z",
+        "changedWho": "OlgunR",
+        "attributes": [
+            {
+                "name": "invoiceNumber",
+                "serilizedValue": "INV-20250410-021"
+            },
+            {
+                "name": "startDate",
+                "serilizedValue": "2025-04-01"
+            },
+            {
+                "name": "endDate",
+                "serilizedValue": "2025-04-30"
+            },
+            {
+                "name": "minAmount",
+                "serilizedValue": "150.99"
+            },
+            {
+                "name": "maxAmount",
+                "serilizedValue": "999.99"
+            },
+            {
+                "name": "createdAt",
+                "serilizedValue": "2025-04-15"
+            },
+            {
+                "name": "deliveryTime",
+                "serilizedValue": "17:45:00"
+            },
+            {
+                "name": "lastUpdated",
+                "serilizedValue": "2025-04-30T18:30:00"
+            }
+        ]
+    },
+    {
+        "id": 5,
+        "name": "report.docx",
+        "addedWhen": "2024-04-17T11:25:00.000Z",
+        "addedWho": "SchreiberM",
+        "attributes": [
+            {
+                "name": "invoiceNumber",
+                "serilizedValue": "INV-20250305-099"
+            },
+            {
+                "name": "customerName",
+                "serilizedValue": "Ali Veli"
+            },
+            {
+                "name": "startDate",
+                "serilizedValue": "2025-03-01"
+            },
+            {
+                "name": "endDate",
+                "serilizedValue": "2025-03-20"
+            },
+            {
+                "name": "minAmount",
+                "serilizedValue": "75.00"
+            },
+            {
+                "name": "maxAmount",
+                "serilizedValue": "500.00"
+            },
+            {
+                "name": "taxIncluded",
+                "serilizedValue": "false"
+            },
+            {
+                "name": "createdAt",
+                "serilizedValue": "2025-03-02"
+            },
+            {
+                "name": "deliveryTime",
+                "serilizedValue": "08:20:00"
+            },
+            {
+                "name": "lastUpdated",
+                "serilizedValue": "2025-03-20T09:30:00"
+            }
+        ]
+    }
+]

src/client/dd-hub-react/public/assets/icons/file/docx.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="-10 -10 52 52" xmlns="http://www.w3.org/2000/svg"><title>file_type_word2</title><path d="M18.536,2.323V4.868c3.4.019,7.12-.035,10.521.019a.783.783,0,0,1,.912.861c.054,6.266-.013,12.89.032,19.157-.02.4.009,1.118-.053,1.517-.079.509-.306.607-.817.676-.286.039-.764.034-1.045.047-2.792-.014-5.582-.011-8.374-.01l-1.175,0v2.547L2,27.133Q2,16,2,4.873L18.536,2.322" style="fill:#283c82"/><path d="M18.536,5.822h10.5V26.18h-10.5V23.635h8.27V22.363h-8.27v-1.59h8.27V19.5h-8.27v-1.59h8.27V16.637h-8.27v-1.59h8.27V13.774h-8.27v-1.59h8.27V10.911h-8.27V9.321h8.27V8.048h-8.27V5.822" style="fill:#fff"/><path d="M8.573,11.443c.6-.035,1.209-.06,1.813-.092.423,2.147.856,4.291,1.314,6.429.359-2.208.757-4.409,1.142-6.613.636-.022,1.272-.057,1.905-.1-.719,3.082-1.349,6.19-2.134,9.254-.531.277-1.326-.013-1.956.032-.423-2.106-.916-4.2-1.295-6.314C8.99,16.1,8.506,18.133,8.08,20.175q-.916-.048-1.839-.111c-.528-2.8-1.148-5.579-1.641-8.385.544-.025,1.091-.048,1.635-.067.328,2.026.7,4.043.986,6.072.448-2.08.907-4.161,1.352-6.241" style="fill:#fff"/></svg>

src/client/dd-hub-react/public/assets/icons/file/pdf.svg

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg version="1.1" id="_x35_" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="-300 -300 1112 1112"  xml:space="preserve">
+<g>
+	<polygon style="fill:#B12A27;" points="475.435,117.825 475.435,512 47.791,512 47.791,0.002 357.613,0.002 412.491,54.881 	"/>
+	<rect x="36.565" y="34.295" style="fill:#F2F2F2;" width="205.097" height="91.768"/>
+	<g>
+		<g>
+			<path style="fill:#B12A27;" d="M110.132,64.379c-0.905-2.186-2.111-4.146-3.769-5.804c-1.658-1.658-3.694-3.015-6.031-3.92
+				c-2.412-0.98-5.126-1.432-8.141-1.432H69.651v58.195h11.383V89.481h11.157c3.015,0,5.729-0.452,8.141-1.432
+				c2.337-0.905,4.372-2.261,6.031-3.92c1.659-1.658,2.865-3.543,3.769-5.804c0.829-2.186,1.282-4.523,1.282-6.935
+				C111.413,68.902,110.961,66.565,110.132,64.379z M97.844,77.118c-1.508,1.432-3.618,2.186-6.181,2.186H81.034V63.323h10.629
+				c2.563,0,4.674,0.754,6.181,2.261c1.432,1.432,2.186,3.392,2.186,5.804C100.031,73.726,99.277,75.686,97.844,77.118z"/>
+			<path style="fill:#B12A27;" d="M164.558,75.761c-0.075-2.035-0.151-3.844-0.377-5.503c-0.226-1.659-0.603-3.166-1.131-4.598
+				c-0.528-1.357-1.206-2.714-2.111-3.92c-2.035-2.94-4.523-5.126-7.312-6.483c-2.865-1.357-6.257-2.035-10.252-2.035h-20.956
+				v58.195h20.956c3.995,0,7.387-0.678,10.252-2.035c2.789-1.357,5.277-3.543,7.312-6.483c0.905-1.206,1.583-2.563,2.111-3.92
+				c0.528-1.432,0.905-2.94,1.131-4.598c0.226-1.658,0.301-3.468,0.377-5.503c0.075-1.96,0.075-4.146,0.075-6.558
+				C164.633,79.908,164.633,77.721,164.558,75.761z M153.175,88.2c0,1.734-0.151,3.091-0.302,4.297
+				c-0.151,1.131-0.377,2.186-0.678,2.94c-0.301,0.829-0.754,1.583-1.281,2.261c-1.885,2.412-4.749,3.543-8.518,3.543h-8.669V63.323
+				h8.669c3.769,0,6.634,1.206,8.518,3.618c0.528,0.678,0.98,1.357,1.281,2.186s0.528,1.809,0.678,3.015
+				c0.151,1.131,0.302,2.563,0.302,4.221c0.075,1.659,0.075,3.694,0.075,5.955C153.251,84.581,153.251,86.541,153.175,88.2z"/>
+			<path style="fill:#B12A27;" d="M213.18,63.323V53.222h-38.37v58.195h11.383V87.823h22.992V77.646h-22.992V63.323H213.18z"/>
+		</g>
+		<g>
+			<path style="fill:#B12A27;" d="M110.132,64.379c-0.905-2.186-2.111-4.146-3.769-5.804c-1.658-1.658-3.694-3.015-6.031-3.92
+				c-2.412-0.98-5.126-1.432-8.141-1.432H69.651v58.195h11.383V89.481h11.157c3.015,0,5.729-0.452,8.141-1.432
+				c2.337-0.905,4.372-2.261,6.031-3.92c1.659-1.658,2.865-3.543,3.769-5.804c0.829-2.186,1.282-4.523,1.282-6.935
+				C111.413,68.902,110.961,66.565,110.132,64.379z M97.844,77.118c-1.508,1.432-3.618,2.186-6.181,2.186H81.034V63.323h10.629
+				c2.563,0,4.674,0.754,6.181,2.261c1.432,1.432,2.186,3.392,2.186,5.804C100.031,73.726,99.277,75.686,97.844,77.118z"/>
+		</g>
+	</g>
+	<polygon style="opacity:0.08;fill:#040000;" points="475.435,117.825 475.435,512 47.791,512 47.791,419.581 247.705,219.667 
+		259.54,207.832 266.098,201.273 277.029,190.343 289.995,177.377 412.491,54.881 	"/>
+	<polygon style="fill:#771B1B;" points="475.435,117.836 357.599,117.836 357.599,0 	"/>
+	<g>
+		<path style="fill:#F2F2F2;" d="M414.376,370.658c-2.488-4.372-5.88-8.518-10.101-12.287c-3.467-3.166-7.538-6.106-12.137-8.82
+			c-18.544-10.93-45.003-16.207-80.961-16.207h-3.618c-1.96-1.809-3.995-3.618-6.106-5.503
+			c-13.644-12.287-24.499-25.63-32.942-40.48c16.584-36.561,24.499-69.126,23.519-96.867c-0.151-4.674-0.829-9.046-2.035-13.117
+			c-1.809-6.558-4.824-12.363-9.046-17.112c-0.075-0.075-0.075-0.075-0.151-0.151c-6.709-7.538-16.056-11.835-25.555-11.835
+			c-9.574,0-18.393,4.146-24.801,11.76c-6.332,7.538-9.724,17.866-9.875,30.002c-0.226,18.544,1.281,36.108,4.448,52.315
+			c0.301,1.282,0.528,2.563,0.829,3.844c3.166,14.7,7.84,28.645,13.87,41.611c-7.086,14.398-14.247,26.836-19.223,35.279
+			c-3.769,6.408-7.915,13.117-12.212,19.826c-19.373,3.468-35.807,7.689-50.129,12.966c-19.373,7.011-34.902,16.056-46.059,26.836
+			c-7.237,6.935-12.137,14.323-14.549,22.012c-2.563,7.915-2.412,15.83,0.452,22.916c2.638,6.558,7.387,12.061,13.72,15.83
+			c1.508,0.905,3.091,1.658,4.749,2.337c4.825,1.96,10.101,3.015,15.604,3.015c12.74,0,25.856-5.503,36.937-15.378
+			c20.655-18.469,41.988-48.169,54.577-66.94c10.327-1.583,21.559-2.94,34.224-4.297c14.926-1.508,28.118-2.412,40.104-2.865
+			c3.694,3.317,7.237,6.483,10.629,9.498c18.846,16.81,33.168,28.947,46.134,37.465c0,0.075,0.075,0.075,0.151,0.075
+			c5.126,3.392,10.026,6.181,14.926,8.443c5.503,2.563,11.081,3.92,16.81,3.92c7.237,0,14.021-2.186,19.675-6.181
+			c5.729-4.146,9.875-10.101,11.76-16.81C420.18,387.694,418.899,378.724,414.376,370.658z M247.705,219.667
+			c-1.055-9.348-1.508-19.072-1.357-29.324c0.151-9.724,3.694-16.283,8.895-16.283c3.92,0,8.066,3.543,9.95,10.327
+			c0.528,2.035,0.905,4.372,0.98,7.01c0.151,3.166,0.075,6.483-0.075,9.875c-0.452,9.574-2.111,19.75-4.975,30.681
+			c-1.734,7.011-3.995,14.323-6.784,21.936C251.173,243.186,248.911,231.803,247.705,219.667z M121.967,418.073
+			c-1.282-3.166,0.151-9.272,7.991-16.81c11.986-11.458,30.756-20.504,56.914-27.364c-4.975,6.784-9.875,12.966-14.624,18.619
+			c-7.237,8.744-14.172,16.132-20.429,21.71c-5.352,4.824-11.232,7.84-16.81,8.594c-0.98,0.151-1.96,0.226-2.94,0.226
+			C127.168,423.049,123.173,421.089,121.967,418.073z M242.428,337.942l0.528-0.829l-0.829,0.151
+			c0.151-0.377,0.377-0.754,0.603-1.055c3.166-5.352,7.161-12.212,11.458-20.127l0.377,0.829l0.98-2.035
+			c3.166,4.523,6.634,8.971,10.252,13.267c1.734,2.035,3.543,3.995,5.352,5.955l-1.206,0.075l1.055,0.98
+			c-3.091,0.226-6.332,0.528-9.574,0.829c-2.035,0.226-4.146,0.377-6.257,0.603C250.796,337.037,246.499,337.49,242.428,337.942z
+			 M369.297,384.98c-8.971-5.729-18.996-13.795-31.359-24.575c17.564,1.809,31.359,5.654,41.159,11.383
+			c4.297,2.488,7.538,5.051,9.724,7.538c3.618,3.844,4.9,7.312,4.221,9.649c-0.603,2.337-3.241,3.92-6.483,3.92
+			c-1.885,0-3.844-0.452-5.88-1.432c-3.468-1.658-7.086-3.694-10.93-6.181C369.598,385.282,369.448,385.131,369.297,384.98z"/>
+	</g>
+</g>
+</svg>

src/client/dd-hub-react/public/assets/icons/file/unknown.svg

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="-6 -6 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13 3L13.7071 2.29289C13.5196 2.10536 13.2652 2 13 2V3ZM14 22C14.5523 22 15 21.5523 15 21C15 20.4477 14.5523 20 14 20V22ZM19 9H20C20 8.73478 19.8946 8.48043 19.7071 8.29289L19 9ZM18 10C18 10.5523 18.4477 11 19 11C19.5523 11 20 10.5523 20 10H18ZM5.21799 19.908L4.32698 20.362H4.32698L5.21799 19.908ZM6.09202 20.782L6.54601 19.891L6.54601 19.891L6.09202 20.782ZM6.09202 3.21799L5.63803 2.32698L5.63803 2.32698L6.09202 3.21799ZM5.21799 4.09202L4.32698 3.63803L4.32698 3.63803L5.21799 4.09202ZM13.109 8.45399L14 8V8L13.109 8.45399ZM13.546 8.89101L14 8L13.546 8.89101ZM17.2299 17.7929C16.8394 18.1834 16.8394 18.8166 17.2299 19.2071C17.6204 19.5976 18.2536 19.5976 18.6441 19.2071L17.2299 17.7929ZM15.0316 15.2507C14.8939 15.7856 15.2159 16.3308 15.7507 16.4684C16.2856 16.6061 16.8308 16.2841 16.9684 15.7493L15.0316 15.2507ZM17.9375 20C17.3852 20 16.9375 20.4477 16.9375 21C16.9375 21.5523 17.3852 22 17.9375 22V20ZM17.9475 22C18.4998 22 18.9475 21.5523 18.9475 21C18.9475 20.4477 18.4998 20 17.9475 20V22ZM13 2H8.2V4H13V2ZM4 6.2V17.8H6V6.2H4ZM8.2 22H14V20H8.2V22ZM19.7071 8.29289L13.7071 2.29289L12.2929 3.70711L18.2929 9.70711L19.7071 8.29289ZM20 10V9H18V10H20ZM4 17.8C4 18.3436 3.99922 18.8114 4.03057 19.195C4.06287 19.5904 4.13419 19.9836 4.32698 20.362L6.10899 19.454C6.0838 19.4045 6.04612 19.3038 6.02393 19.0322C6.00078 18.7488 6 18.3766 6 17.8H4ZM8.2 20C7.62345 20 7.25117 19.9992 6.96784 19.9761C6.69617 19.9539 6.59545 19.9162 6.54601 19.891L5.63803 21.673C6.01641 21.8658 6.40963 21.9371 6.80497 21.9694C7.18864 22.0008 7.65645 22 8.2 22V20ZM4.32698 20.362C4.6146 20.9265 5.07354 21.3854 5.63803 21.673L6.54601 19.891C6.35785 19.7951 6.20487 19.6422 6.10899 19.454L4.32698 20.362ZM8.2 2C7.65645 2 7.18864 1.99922 6.80497 2.03057C6.40963 2.06287 6.01641 2.13419 5.63803 2.32698L6.54601 4.10899C6.59545 4.0838 6.69617 4.04612 6.96784 4.02393C7.25117 4.00078 7.62345 4 8.2 4V2ZM6 6.2C6 5.62345 6.00078 5.25117 6.02393 4.96784C6.04612 4.69617 6.0838 4.59545 6.10899 4.54601L4.32698 3.63803C4.13419 4.01641 4.06287 4.40963 4.03057 4.80497C3.99922 5.18864 4 5.65645 4 6.2H6ZM5.63803 2.32698C5.07354 2.6146 4.6146 3.07354 4.32698 3.63803L6.10899 4.54601C6.20487 4.35785 6.35785 4.20487 6.54601 4.10899L5.63803 2.32698ZM12 3V7.4H14V3H12ZM14.6 10H19V8H14.6V10ZM12 7.4C12 7.66353 11.9992 7.92131 12.0169 8.13823C12.0356 8.36682 12.0797 8.63656 12.218 8.90798L14 8C14.0293 8.05751 14.0189 8.08028 14.0103 7.97537C14.0008 7.85878 14 7.69653 14 7.4H12ZM14.6 8C14.3035 8 14.1412 7.99922 14.0246 7.9897C13.9197 7.98113 13.9425 7.9707 14 8L13.092 9.78201C13.3634 9.92031 13.6332 9.96438 13.8618 9.98305C14.0787 10.0008 14.3365 10 14.6 10V8ZM12.218 8.90798C12.4097 9.2843 12.7157 9.59027 13.092 9.78201L14 8V8L12.218 8.90798ZM18.937 16C18.937 16.1732 18.8915 16.3053 18.6175 16.5697C18.4638 16.718 18.2828 16.8653 18.0319 17.074C17.7936 17.2723 17.5141 17.5087 17.2299 17.7929L18.6441 19.2071C18.86 18.9913 19.0805 18.8033 19.3109 18.6116C19.5287 18.4305 19.7852 18.2223 20.0065 18.0087C20.4825 17.5493 20.937 16.9314 20.937 16H18.937ZM17.937 15C18.4893 15 18.937 15.4477 18.937 16H20.937C20.937 14.3431 19.5938 13 17.937 13V15ZM16.9684 15.7493C17.0795 15.3177 17.4724 15 17.937 15V13C16.5377 13 15.3645 13.957 15.0316 15.2507L16.9684 15.7493ZM17.9375 22H17.9475V20H17.9375V22Z" fill="#000000"/>
+</svg>

src/client/dd-hub-react/public/assets/icons/file/xlsx.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="-8 -8 48 48" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><linearGradient id="a" x1="4.494" y1="-2092.086" x2="13.832" y2="-2075.914" gradientTransform="translate(0 2100)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#18884f"/><stop offset="0.5" stop-color="#117e43"/><stop offset="1" stop-color="#0b6631"/></linearGradient></defs><title>file_type_excel</title><path d="M19.581,15.35,8.512,13.4V27.809A1.192,1.192,0,0,0,9.705,29h19.1A1.192,1.192,0,0,0,30,27.809h0V22.5Z" style="fill:#185c37"/><path d="M19.581,3H9.705A1.192,1.192,0,0,0,8.512,4.191h0V9.5L19.581,16l5.861,1.95L30,16V9.5Z" style="fill:#21a366"/><path d="M8.512,9.5H19.581V16H8.512Z" style="fill:#107c41"/><path d="M16.434,8.2H8.512V24.45h7.922a1.2,1.2,0,0,0,1.194-1.191V9.391A1.2,1.2,0,0,0,16.434,8.2Z" style="opacity:0.10000000149011612;isolation:isolate"/><path d="M15.783,8.85H8.512V25.1h7.271a1.2,1.2,0,0,0,1.194-1.191V10.041A1.2,1.2,0,0,0,15.783,8.85Z" style="opacity:0.20000000298023224;isolation:isolate"/><path d="M15.783,8.85H8.512V23.8h7.271a1.2,1.2,0,0,0,1.194-1.191V10.041A1.2,1.2,0,0,0,15.783,8.85Z" style="opacity:0.20000000298023224;isolation:isolate"/><path d="M15.132,8.85H8.512V23.8h6.62a1.2,1.2,0,0,0,1.194-1.191V10.041A1.2,1.2,0,0,0,15.132,8.85Z" style="opacity:0.20000000298023224;isolation:isolate"/><path d="M3.194,8.85H15.132a1.193,1.193,0,0,1,1.194,1.191V21.959a1.193,1.193,0,0,1-1.194,1.191H3.194A1.192,1.192,0,0,1,2,21.959V10.041A1.192,1.192,0,0,1,3.194,8.85Z" style="fill:url(#a)"/><path d="M5.7,19.873l2.511-3.884-2.3-3.862H7.758L9.013,14.6c.116.234.2.408.238.524h.017c.082-.188.169-.369.26-.546l1.342-2.447h1.7l-2.359,3.84,2.419,3.905H10.821l-1.45-2.711A2.355,2.355,0,0,1,9.2,16.8H9.176a1.688,1.688,0,0,1-.168.351L7.515,19.873Z" style="fill:#fff"/><path d="M28.806,3H19.581V9.5H30V4.191A1.192,1.192,0,0,0,28.806,3Z" style="fill:#33c481"/><path d="M19.581,16H30v6.5H19.581Z" style="fill:#107c41"/></svg>

src/client/dd-hub-react/public/assets/icons/flags/ic-flag-de.svg

@@ -0,0 +1 @@
+<svg height="20" viewBox="0 0 28 20" width="28" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path id="a" d="m0 6.667h28v6.667h-28z"/><filter id="b" height="145%" width="110.7%" x="-5.4%" y="-22.5%"><feMorphology in="SourceAlpha" operator="dilate" radius=".5" result="shadowSpreadOuter1"/><feOffset in="shadowSpreadOuter1" result="shadowOffsetOuter1"/><feColorMatrix in="shadowOffsetOuter1" values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.06 0"/></filter><path id="c" d="m0 13.333h28v6.667h-28z"/><filter id="d" height="145%" width="110.7%" x="-5.4%" y="-22.5%"><feMorphology in="SourceAlpha" operator="dilate" radius=".5" result="shadowSpreadOuter1"/><feOffset in="shadowSpreadOuter1" result="shadowOffsetOuter1"/><feColorMatrix in="shadowOffsetOuter1" values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.06 0"/></filter><mask id="e" fill="#fff"><rect fill="#fff" fill-rule="evenodd" height="20" rx="3" width="28"/></mask></defs><g fill="none" fill-rule="evenodd"><path d="m0 0h28v6.667h-28z" fill="#262626" mask="url(#e)"/><g mask="url(#e)"><use fill="#000" filter="url(#b)" xlink:href="#a"/><use fill="#f01515" xlink:href="#a"/></g><g mask="url(#e)"><use fill="#000" filter="url(#d)" xlink:href="#c"/><use fill="#ffd521" xlink:href="#c"/></g></g></svg>

src/client/dd-hub-react/public/assets/icons/flags/ic-flag-en.svg

@@ -0,0 +1 @@
+<svg height="20" viewBox="0 0 28 20" width="28" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><rect id="a" height="20" rx="3" width="28"/><mask id="b" fill="#fff"><use fill="#fff" fill-rule="evenodd" xlink:href="#a"/></mask></defs><g fill="none" fill-rule="evenodd"><use fill="#0a17a7" xlink:href="#a"/><path d="m29.2824692-1.91644623 1.4911811 2.21076686-9.4483006 6.37223314 6.6746503.0001129v6.66666663l-6.6746503-.0007795 9.4483006 6.3731256-1.4911811 2.2107668-11.9501195-8.0608924.0009836 7.4777795h-6.6666666l-.000317-7.4777795-11.9488189 8.0608924-1.49118107-2.2107668 9.448-6.3731256-6.67434973.0007795v-6.66666663l6.67434973-.0001129-9.448-6.37223314 1.49118107-2.21076686 11.9488189 8.06.000317-7.4768871h6.6666666l-.0009836 7.4768871z" fill="#fff" mask="url(#b)"/><g stroke="#db1f35" stroke-linecap="round" stroke-width=".667"><path d="m18.668 6.332 12.665-8.332" mask="url(#b)"/><path d="m20.013 21.35 11.354-7.652" mask="url(#b)" transform="matrix(1 0 0 -1 0 35.048)"/><path d="m8.006 6.31-11.843-7.981" mask="url(#b)"/><path d="m9.29 22.31-13.127-8.705" mask="url(#b)" transform="matrix(1 0 0 -1 0 35.915)"/></g><path d="m0 12h12v8h4v-8h12v-4h-12v-8h-4v8h-12z" fill="#e6273e" mask="url(#b)"/></g></svg>

src/client/dd-hub-react/public/assets/icons/flags/ic-flag-fr.svg

@@ -0,0 +1 @@
+<svg height="20" viewBox="0 0 28 20" width="28" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><rect id="a" height="20" rx="3" width="28"/><mask id="b" fill="#fff"><use fill="#fff" fill-rule="evenodd" xlink:href="#a"/></mask></defs><g fill="none" fill-rule="evenodd"><use fill="#fff" xlink:href="#a"/><path d="m19 0h9v20h-9z" fill="#f44653" mask="url(#b)"/><path d="m0 0h9v20h-9z" fill="#1035bb" mask="url(#b)"/></g></svg>

src/client/dd-hub-react/public/assets/icons/glass/ic-glass-bag.svg

@@ -0,0 +1,30 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.48" d="M32.912 22.4416L32.9128 22.4377L33.0211 22.0336C34.1115 17.1555 31.1485 12.2812 26.3038 10.9831C21.459 9.68494 16.4559 12.4247 14.9612 17.1944C14.9012 17.323 14.8642 17.4611 14.8519 17.6024L17.5128 18.3154C17.5728 18.1868 17.6098 18.0488 17.6222 17.9074C18.551 14.441 22.1237 12.3865 25.6021 13.3185C29.0804 14.2505 31.1472 17.8162 30.2184 21.2826C30.1828 21.4226 30.1724 21.5679 30.1878 21.7117L14.7102 17.5644C12.3936 16.9437 9.50735 17.8095 7.68682 21.7279L3.2802 32.5497C-0.0732567 40.4637 3.60985 43.6537 9.13788 45.1349L24.1243 49.1505C29.6363 50.6274 34.5399 48.7512 35.4737 41.176L37.0844 29.605C37.3083 25.3821 35.3524 23.0955 33.0677 22.4833L32.912 22.4416Z" fill="url(#paint0_linear_2581_180288)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M45.9755 17.205C45.8697 16.7652 45.7895 16.4418 45.7745 16.3935L45.633 15.8655C43.8335 10.1231 37.8101 6.82466 31.9774 8.38753C26.1447 9.9504 22.5775 15.8187 23.8902 21.6915C23.8957 21.7545 24.0451 22.3389 24.2347 23.0573C21.6807 23.9935 19.543 26.6156 19.9728 31.4506L21.8927 45.3864C23.1601 55.6563 28.9205 56.7652 35.5758 54.9819L53.6183 50.1475C60.2544 48.3693 64.2376 43.4614 60.6513 35.001L55.3653 21.9672C53.0567 17.4295 49.641 16.2228 46.8904 16.9598L45.9755 17.205ZM42.6309 18.1012L27.4716 22.1631C27.2796 21.4577 27.1203 20.8898 27.0938 20.8331C25.9756 16.6598 28.4639 12.367 32.6516 11.2449C36.8393 10.1228 41.1406 12.5963 42.2588 16.7696L42.2928 16.8918C42.3521 17.105 42.4797 17.5636 42.6309 18.1012Z" fill="url(#paint1_linear_2581_180288)"/>
+<path opacity="0.48" fill-rule="evenodd" clip-rule="evenodd" d="M45.9755 17.205C45.8697 16.7652 45.7895 16.4418 45.7745 16.3935L45.633 15.8655C43.8335 10.1231 37.8101 6.82466 31.9774 8.38753C26.1447 9.9504 22.5775 15.8187 23.8902 21.6915C23.8957 21.7545 24.0451 22.3389 24.2347 23.0573C21.6807 23.9935 19.543 26.6156 19.9728 31.4506L21.8927 45.3864C23.1601 55.6563 28.9205 56.7652 35.5758 54.9819L53.6183 50.1475C60.2544 48.3693 64.2376 43.4614 60.6513 35.001L55.3653 21.9672C53.0567 17.4295 49.641 16.2228 46.8904 16.9598L45.9755 17.205ZM42.6309 18.1012L27.4716 22.1631C27.2796 21.4577 27.1203 20.8898 27.0938 20.8331C25.9756 16.6598 28.4639 12.367 32.6516 11.2449C36.8393 10.1228 41.1406 12.5963 42.2588 16.7696L42.2928 16.8918C42.3521 17.105 42.4797 17.5636 42.6309 18.1012Z" fill="url(#paint2_linear_2581_180288)"/>
+<path opacity="0.04" d="M45.4893 17.3219L45.6093 17.8208L46.1049 17.688L47.0198 17.4428C49.489 16.7812 52.6838 17.8142 54.91 22.175L60.1879 35.1889L60.1879 35.189L60.1909 35.1962C61.945 39.3341 61.8111 42.5072 60.53 44.8393C59.2417 47.1846 56.7302 48.796 53.4889 49.6645L35.4464 54.499C32.1554 55.3808 29.2119 55.5087 26.9549 54.2661C24.7238 53.0378 23.013 50.3817 22.3889 45.3251L22.3889 45.3251L22.388 45.3181L20.4698 31.3944C20.2645 29.064 20.6803 27.3113 21.4171 26.0431C22.1545 24.774 23.2316 23.9575 24.4068 23.5267L24.8343 23.37L24.7182 22.9297C24.6236 22.5712 24.5393 22.2473 24.4781 22.0059C24.4475 21.8849 24.4231 21.7864 24.4063 21.7152C24.3916 21.6535 24.3873 21.6308 24.3869 21.6309L24.3855 21.6149L24.3782 21.5824C23.1242 15.9726 26.5315 10.3644 32.1068 8.87049C37.6787 7.37749 43.43 10.526 45.1528 16.0051L45.2915 16.5229L45.2941 16.5327L45.2972 16.5423C45.297 16.5418 45.297 16.5419 45.2973 16.5429C45.2983 16.5467 45.3031 16.5642 45.3131 16.6031C45.3239 16.6452 45.3382 16.7024 45.3556 16.7727C45.3904 16.9131 45.4366 17.1027 45.4893 17.3219ZM42.7603 18.5841L43.2493 18.4531L43.1122 17.9658C42.9612 17.429 42.8338 16.971 42.7746 16.7578L42.7745 16.7577L42.7418 16.6402C42.7416 16.6394 42.7413 16.6386 42.7411 16.6378C41.55 12.1977 36.9742 9.56905 32.5222 10.762C28.0693 11.9551 25.4208 16.5209 26.6109 20.9625L26.6222 21.0048L26.6334 21.0287C26.6331 21.0293 26.6406 21.0508 26.6581 21.1092C26.6786 21.1778 26.7062 21.2733 26.7395 21.391C26.806 21.6259 26.8934 21.9424 26.9892 22.2944L27.12 22.7749L27.601 22.646L42.7603 18.5841Z" stroke="black"/>
+<path d="M32.4467 32.8606C31.3844 33.1452 30.2857 32.4896 29.9927 31.3962C29.6997 30.3028 30.3234 29.1857 31.3858 28.901C32.4481 28.6164 33.5468 29.272 33.8397 30.3654C34.1327 31.4588 33.509 32.5759 32.4467 32.8606Z" fill="url(#paint3_linear_2581_180288)"/>
+<path d="M42.5916 28.0206C42.8846 29.114 43.9833 29.7696 45.0456 29.485C46.1079 29.2003 46.7316 28.0832 46.4386 26.9898C46.1456 25.8964 45.047 25.2408 43.9846 25.5254C42.9223 25.8101 42.2986 26.9272 42.5916 28.0206Z" fill="url(#paint4_linear_2581_180288)"/>
+<defs>
+<linearGradient id="paint0_linear_2581_180288" x1="2" y1="10.6612" x2="40.7444" y2="45.5736" gradientUnits="userSpaceOnUse">
+<stop stop-color="#73BAFB"/>
+<stop offset="1" stop-color="#1877F2"/>
+</linearGradient>
+<linearGradient id="paint1_linear_2581_180288" x1="19.9175" y1="8" x2="67.2278" y2="49.7565" gradientUnits="userSpaceOnUse">
+<stop stop-color="#73BAFB"/>
+<stop offset="1" stop-color="#1877F2"/>
+</linearGradient>
+<linearGradient id="paint2_linear_2581_180288" x1="19.9175" y1="8" x2="67.2278" y2="49.7565" gradientUnits="userSpaceOnUse">
+<stop stop-color="#1877F2"/>
+<stop offset="1" stop-color="#0C44AE"/>
+</linearGradient>
+<linearGradient id="paint3_linear_2581_180288" x1="30.1261" y1="29.9601" x2="38.3844" y2="37.9524" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.16"/>
+<stop offset="1" stop-color="white" stop-opacity="0.64"/>
+</linearGradient>
+<linearGradient id="paint4_linear_2581_180288" x1="30.1261" y1="29.9601" x2="38.3844" y2="37.9524" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.16"/>
+<stop offset="1" stop-color="white" stop-opacity="0.64"/>
+</linearGradient>
+</defs>
+</svg>

src/client/dd-hub-react/public/assets/icons/glass/ic-glass-buy.svg

@@ -0,0 +1,47 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.48" d="M43.4118 15.2792C42.6075 14.3345 41.8032 13.9033 40.5766 13.9033H13.4218C12.7783 13.9033 12.2555 13.4104 12.1952 12.7512L11.8132 8.15124C11.7528 7.45303 11.2502 6.88008 10.5665 6.75481L5.77093 6.01758C4.94653 5.89232 4.16235 6.44883 4.0216 7.28874C3.88085 8.11017 4.44385 8.91106 5.24814 9.05481C7.03701 9.36938 8.38864 10.8509 8.53822 12.661L10.1342 31.9746C10.3554 34.6853 12.5672 36.7779 15.2415 36.7779H37.1785C39.7321 36.7779 41.9037 34.8702 42.2656 32.2806L44.1758 18.8092C44.3568 17.5792 44.216 16.2238 43.4118 15.2792Z" fill="url(#paint0_linear_2581_180285)"/>
+<path d="M20.2268 22.7221C18.893 22.7221 18.0184 23.191 17.1439 24.2182C16.2693 25.2454 16.1162 26.7192 16.313 28.0568L18.3901 42.7055C18.7837 45.5214 21.1451 47.5959 23.9219 47.5959H47.7762C50.6842 47.5959 53.0893 45.3204 53.3298 42.3728L55.3413 18.0304L58.6429 17.4498C59.5175 17.2935 60.1297 16.4226 59.9766 15.5294C59.8236 14.6161 58.9708 14.011 58.0744 14.1472L52.8597 14.9488C52.1163 15.0851 51.5697 15.7081 51.5041 16.4673L51.0887 21.4693C51.0231 22.1861 50.4546 22.7221 49.7549 22.7221H20.2268Z" fill="url(#paint1_linear_2581_180285)"/>
+<path d="M48.1267 51.1256C49.9633 51.1256 51.4501 52.6441 51.4501 54.5199C51.4501 56.3733 49.9633 57.8917 48.1267 57.8917C46.312 57.8917 44.8252 56.3733 44.8252 54.5199C44.8252 52.6441 46.312 51.1256 48.1267 51.1256Z" fill="url(#paint2_linear_2581_180285)"/>
+<path d="M23.5292 51.1256C25.3659 51.1256 26.8527 52.6441 26.8527 54.5199C26.8527 56.3733 25.3659 57.8917 23.5292 57.8917C21.7145 57.8917 20.2277 56.3733 20.2277 54.5199C20.2277 52.6441 21.7145 51.1256 23.5292 51.1256Z" fill="url(#paint3_linear_2581_180285)"/>
+<g opacity="0.48">
+<path d="M20.2268 22.7221C18.893 22.7221 18.0184 23.191 17.1439 24.2182C16.2693 25.2454 16.1162 26.7192 16.313 28.0568L18.3901 42.7055C18.7837 45.5214 21.1451 47.5959 23.9219 47.5959H47.7762C50.6842 47.5959 53.0893 45.3204 53.3298 42.3728L55.3413 18.0304L58.6429 17.4498C59.5175 17.2935 60.1297 16.4226 59.9766 15.5294C59.8236 14.6161 58.9708 14.011 58.0744 14.1472L52.8597 14.9488C52.1163 15.0851 51.5697 15.7081 51.5041 16.4673L51.0887 21.4693C51.0231 22.1861 50.4546 22.7221 49.7549 22.7221H20.2268Z" fill="url(#paint4_linear_2581_180285)"/>
+<path d="M48.1267 51.1256C49.9633 51.1256 51.4501 52.6441 51.4501 54.5199C51.4501 56.3733 49.9633 57.8917 48.1267 57.8917C46.312 57.8917 44.8252 56.3733 44.8252 54.5199C44.8252 52.6441 46.312 51.1256 48.1267 51.1256Z" fill="url(#paint5_linear_2581_180285)"/>
+<path d="M23.5292 51.1256C25.3659 51.1256 26.8527 52.6441 26.8527 54.5199C26.8527 56.3733 25.3659 57.8917 23.5292 57.8917C21.7145 57.8917 20.2277 56.3733 20.2277 54.5199C20.2277 52.6441 21.7145 51.1256 23.5292 51.1256Z" fill="url(#paint6_linear_2581_180285)"/>
+</g>
+<path opacity="0.04" d="M16.8081 27.9866L16.8077 27.984C16.6205 26.7118 16.7842 25.4118 17.5246 24.5423C17.9333 24.0623 18.3195 23.7393 18.7355 23.5328C19.1484 23.3277 19.6216 23.2221 20.2268 23.2221H49.7549C50.7264 23.2221 51.4987 22.4756 51.5866 21.5149L51.5869 21.5107L52.0022 16.5103C52.0491 15.9681 52.4342 15.5381 52.9434 15.4418L58.1495 14.6415C58.1497 14.6415 58.1499 14.6414 58.1501 14.6414C58.7781 14.5463 59.3759 14.9702 59.4835 15.6121L59.4838 15.6139C59.5909 16.2391 59.1563 16.8498 58.5555 16.9575C58.5553 16.9576 58.5551 16.9576 58.5549 16.9576L55.2547 17.538L54.8748 17.6048L54.843 17.9893L52.8315 42.3316L52.8314 42.3322C52.6113 45.0302 50.4139 47.0959 47.7762 47.0959H23.9219C21.4007 47.0959 19.2452 45.2114 18.8853 42.6363L18.8852 42.6353L16.8081 27.9866ZM48.1267 51.6256C49.6773 51.6256 50.9501 52.9103 50.9501 54.5199C50.9501 56.105 49.6795 57.3917 48.1267 57.3917C46.598 57.3917 45.3252 56.1071 45.3252 54.5199C45.3252 52.9081 46.6001 51.6256 48.1267 51.6256ZM23.5292 51.6256C25.0798 51.6256 26.3527 52.9103 26.3527 54.5199C26.3527 56.105 25.082 57.3917 23.5292 57.3917C22.0005 57.3917 20.7277 56.1071 20.7277 54.5199C20.7277 52.9081 22.0026 51.6256 23.5292 51.6256Z" stroke="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M27.4194 34.3307H33.4759C34.3942 34.3307 35.1157 33.5715 35.1157 32.6559C35.1157 31.718 34.3942 30.9811 33.4759 30.9811H27.4194C26.5011 30.9811 25.7795 31.718 25.7795 32.6559C25.7795 33.5715 26.5011 34.3307 27.4194 34.3307Z" fill="url(#paint7_linear_2581_180285)"/>
+<defs>
+<linearGradient id="paint0_linear_2581_180285" x1="4" y1="6" x2="33.7031" y2="44.8405" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFD666"/>
+<stop offset="1" stop-color="#FFAB00"/>
+</linearGradient>
+<linearGradient id="paint1_linear_2581_180285" x1="16.2368" y1="14.1281" x2="60.0005" y2="57.8913" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFD666"/>
+<stop offset="1" stop-color="#FFAB00"/>
+</linearGradient>
+<linearGradient id="paint2_linear_2581_180285" x1="16.2368" y1="14.1281" x2="60.0005" y2="57.8913" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFD666"/>
+<stop offset="1" stop-color="#FFAB00"/>
+</linearGradient>
+<linearGradient id="paint3_linear_2581_180285" x1="16.2368" y1="14.1281" x2="60.0005" y2="57.8913" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFD666"/>
+<stop offset="1" stop-color="#FFAB00"/>
+</linearGradient>
+<linearGradient id="paint4_linear_2581_180285" x1="16.2368" y1="14.1281" x2="60.0005" y2="57.8913" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFAB00"/>
+<stop offset="1" stop-color="#B76E00"/>
+</linearGradient>
+<linearGradient id="paint5_linear_2581_180285" x1="16.2368" y1="14.1281" x2="60.0005" y2="57.8913" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFAB00"/>
+<stop offset="1" stop-color="#B76E00"/>
+</linearGradient>
+<linearGradient id="paint6_linear_2581_180285" x1="16.2368" y1="14.1281" x2="60.0005" y2="57.8913" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFAB00"/>
+<stop offset="1" stop-color="#B76E00"/>
+</linearGradient>
+<linearGradient id="paint7_linear_2581_180285" x1="35" y1="33" x2="31.3628" y2="37.4165" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.16"/>
+<stop offset="1" stop-color="white" stop-opacity="0.64"/>
+</linearGradient>
+</defs>
+</svg>

src/client/dd-hub-react/public/assets/icons/glass/ic-glass-message.svg

@@ -0,0 +1,30 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.48" d="M39.4251 10.5168C37.1706 9.21199 34.4888 8.86675 31.9774 9.53967L13.4762 14.497C8.2306 15.9026 5.13409 21.2687 6.53413 26.4937L10.4984 41.2886C11.8985 46.5137 17.2819 49.6075 22.5088 48.207L41.0099 43.2496C46.2369 41.8491 49.354 36.4775 47.9539 31.2525L43.9896 16.4575C43.3172 13.948 41.6805 11.8173 39.4251 10.5168Z" fill="url(#paint0_linear_2581_180287)"/>
+<path d="M56.7953 20.2744C54.7416 18.2164 51.95 17.0695 49.048 17.0695H27.6693C21.6078 17.0695 16.7192 21.9602 16.7192 27.9979V45.0939C16.7192 51.1316 21.6295 56.0224 27.6693 56.0224H49.048C55.0879 56.0224 60.0003 51.1316 60.0003 45.0939V27.9979C60.0003 25.0981 58.8512 22.3281 56.7953 20.2744Z" fill="url(#paint1_linear_2581_180287)"/>
+<path opacity="0.48" d="M56.7953 20.2744C54.7416 18.2164 51.95 17.0695 49.048 17.0695H27.6693C21.6078 17.0695 16.7192 21.9602 16.7192 27.9979V45.0939C16.7192 51.1316 21.6295 56.0224 27.6693 56.0224H49.048C55.0879 56.0224 60.0003 51.1316 60.0003 45.0939V27.9979C60.0003 25.0981 58.8512 22.3281 56.7953 20.2744Z" fill="url(#paint2_linear_2581_180287)"/>
+<g opacity="0.04">
+<mask id="path-4-inside-1_2581_180287" fill="white">
+<path d="M56.7953 20.2744C54.7416 18.2164 51.95 17.0695 49.048 17.0695H27.6693C21.6078 17.0695 16.7192 21.9602 16.7192 27.9979V45.0939C16.7192 51.1316 21.6295 56.0224 27.6693 56.0224H49.048C55.0879 56.0224 60.0003 51.1316 60.0003 45.0939V27.9979C60.0003 25.0981 58.8512 22.3281 56.7953 20.2744Z"/>
+</mask>
+<path d="M57.5032 19.5681C55.2602 17.3204 52.2132 16.0695 49.048 16.0695V18.0695C51.6868 18.0695 54.223 19.1124 56.0875 20.9808L57.5032 19.5681ZM49.048 16.0695H27.6693V18.0695H49.048V16.0695ZM27.6693 16.0695C21.0567 16.0695 15.7192 21.4068 15.7192 27.9979H17.7192C17.7192 22.5137 22.159 18.0695 27.6693 18.0695V16.0695ZM15.7192 27.9979V45.0939H17.7192V27.9979H15.7192ZM15.7192 45.0939C15.7192 51.6864 21.0796 57.0224 27.6693 57.0224V55.0224C22.1793 55.0224 17.7192 50.5769 17.7192 45.0939H15.7192ZM27.6693 57.0224H49.048V55.0224H27.6693V57.0224ZM49.048 57.0224C55.6374 57.0224 61.0003 51.6866 61.0003 45.0939H59.0003C59.0003 50.5766 54.5383 55.0224 49.048 55.0224V57.0224ZM61.0003 45.0939V27.9979H59.0003V45.0939H61.0003ZM61.0003 27.9979C61.0003 24.8322 59.7453 21.8078 57.502 19.5669L56.0886 20.9819C57.957 22.8484 59.0003 25.364 59.0003 27.9979H61.0003Z" fill="black" mask="url(#path-4-inside-1_2581_180287)"/>
+</g>
+<path d="M52.6642 31.0492L52.4911 31.2223L42.7291 39.0345C41.5194 39.9867 40.024 40.5061 38.4897 40.5061C36.9511 40.5061 35.4817 39.9867 34.2698 39.0345L24.4234 31.3521L24.1399 31.0708C23.6443 30.4216 23.7092 29.4911 24.2935 28.9068C24.854 28.3225 25.7846 28.2576 26.4576 28.7553L36.1958 36.5459C37.4704 37.5868 39.2688 37.5868 40.5239 36.5459L50.2816 28.7553C50.6084 28.4523 51.0412 28.2987 51.4957 28.3225C51.9263 28.3658 52.3396 28.5627 52.6404 28.8851C53.1815 29.5127 53.1815 30.4216 52.6642 31.0492Z" fill="url(#paint3_linear_2581_180287)"/>
+<defs>
+<linearGradient id="paint0_linear_2581_180287" x1="4" y1="17.0362" x2="47.5044" y2="45.3021" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFAC82"/>
+<stop offset="1" stop-color="#FF5630"/>
+</linearGradient>
+<linearGradient id="paint1_linear_2581_180287" x1="16.7192" y1="17.0695" x2="55.457" y2="60.1114" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFAC82"/>
+<stop offset="1" stop-color="#FF5630"/>
+</linearGradient>
+<linearGradient id="paint2_linear_2581_180287" x1="16.7192" y1="17.0695" x2="55.457" y2="60.1114" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF5630"/>
+<stop offset="1" stop-color="#B71D18"/>
+</linearGradient>
+<linearGradient id="paint3_linear_2581_180287" x1="24.1701" y1="35.6649" x2="37.6395" y2="49.7453" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.16"/>
+<stop offset="1" stop-color="white" stop-opacity="0.64"/>
+</linearGradient>
+</defs>
+</svg>

src/client/dd-hub-react/public/assets/icons/glass/ic-glass-users.svg

@@ -0,0 +1,39 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g opacity="0.48">
+<path d="M12.133 21.5614C12.133 27.0199 16.5998 31.3942 22.1736 31.3942C27.7454 31.3942 32.2141 27.0199 32.2141 21.5614C32.2141 16.1029 27.7454 11.7286 22.1736 11.7286C16.5998 11.7286 12.133 16.1029 12.133 21.5614Z" fill="url(#paint0_linear_2581_180286)"/>
+<path d="M37.3479 42.5273C37.3479 37.4744 30.3579 36.2102 22.174 36.2102C13.9456 36.2102 7 37.518 7 42.5748C7 47.6278 13.99 48.892 22.174 48.892C30.4024 48.892 37.3479 47.5842 37.3479 42.5273Z" fill="url(#paint1_linear_2581_180286)"/>
+</g>
+<path d="M23.9326 20.8952C23.9326 28.0537 29.7904 33.7903 37.1002 33.7903C44.4073 33.7903 50.2678 28.0537 50.2678 20.8952C50.2678 13.7367 44.4073 8 37.1002 8C29.7904 8 23.9326 13.7367 23.9326 20.8952Z" fill="url(#paint2_linear_2581_180286)"/>
+<path d="M56.9997 48.3917C56.9997 41.7651 47.8328 40.1072 37.1 40.1072C26.3089 40.1072 17.2002 41.8222 17.2002 48.454C17.2002 55.0806 26.3672 56.7386 37.1 56.7386C47.891 56.7386 56.9997 55.0235 56.9997 48.3917Z" fill="url(#paint3_linear_2581_180286)"/>
+<g opacity="0.48">
+<path d="M23.9326 20.8952C23.9326 28.0537 29.7904 33.7903 37.1002 33.7903C44.4073 33.7903 50.2678 28.0537 50.2678 20.8952C50.2678 13.7367 44.4073 8 37.1002 8C29.7904 8 23.9326 13.7367 23.9326 20.8952Z" fill="url(#paint4_linear_2581_180286)"/>
+<path d="M56.9997 48.3917C56.9997 41.7651 47.8328 40.1072 37.1 40.1072C26.3089 40.1072 17.2002 41.8222 17.2002 48.454C17.2002 55.0806 26.3672 56.7386 37.1 56.7386C47.891 56.7386 56.9997 55.0235 56.9997 48.3917Z" fill="url(#paint5_linear_2581_180286)"/>
+</g>
+<path opacity="0.04" d="M37.1002 33.2903C30.0567 33.2903 24.4326 27.7677 24.4326 20.8952C24.4326 14.0226 30.0567 8.5 37.1002 8.5C44.1411 8.5 49.7678 14.0227 49.7678 20.8952C49.7678 27.7677 44.1411 33.2903 37.1002 33.2903ZM37.1 40.6072C42.4554 40.6072 47.3613 41.0227 50.9128 42.2376C52.6857 42.844 54.0846 43.6377 55.0362 44.645C55.9765 45.6404 56.4997 46.8641 56.4997 48.3917C56.4997 49.9219 55.9793 51.1507 55.0427 52.1522C54.0952 53.1654 52.7015 53.9662 50.9327 54.5797C47.3891 55.8088 42.4838 56.2386 37.1 56.2386C31.7445 56.2386 26.8386 55.823 23.2871 54.6082C21.5142 54.0017 20.1153 53.2081 19.1637 52.2007C18.2234 51.2053 17.7002 49.9817 17.7002 48.454C17.7002 46.9239 18.2206 45.695 19.1572 44.6936C20.1048 43.6804 21.4985 42.8796 23.2673 42.2661C26.8109 41.0369 31.7162 40.6072 37.1 40.6072Z" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_2581_180286" x1="7" y1="11.7286" x2="43.4135" y2="41.4641" gradientUnits="userSpaceOnUse">
+<stop stop-color="#C684FF"/>
+<stop offset="1" stop-color="#8E33FF"/>
+</linearGradient>
+<linearGradient id="paint1_linear_2581_180286" x1="7" y1="11.7286" x2="43.4135" y2="41.4641" gradientUnits="userSpaceOnUse">
+<stop stop-color="#C684FF"/>
+<stop offset="1" stop-color="#8E33FF"/>
+</linearGradient>
+<linearGradient id="paint2_linear_2581_180286" x1="17.2002" y1="8" x2="64.9552" y2="46.9963" gradientUnits="userSpaceOnUse">
+<stop stop-color="#C684FF"/>
+<stop offset="1" stop-color="#8E33FF"/>
+</linearGradient>
+<linearGradient id="paint3_linear_2581_180286" x1="17.2002" y1="8" x2="64.9552" y2="46.9963" gradientUnits="userSpaceOnUse">
+<stop stop-color="#C684FF"/>
+<stop offset="1" stop-color="#8E33FF"/>
+</linearGradient>
+<linearGradient id="paint4_linear_2581_180286" x1="17.2002" y1="8" x2="64.9552" y2="46.9963" gradientUnits="userSpaceOnUse">
+<stop stop-color="#8E33FF"/>
+<stop offset="1" stop-color="#5119B7"/>
+</linearGradient>
+<linearGradient id="paint5_linear_2581_180286" x1="17.2002" y1="8" x2="64.9552" y2="46.9963" gradientUnits="userSpaceOnUse">
+<stop stop-color="#8E33FF"/>
+<stop offset="1" stop-color="#5119B7"/>
+</linearGradient>
+</defs>
+</svg>

src/client/dd-hub-react/public/assets/icons/navbar/ic-analytics.svg

@@ -0,0 +1,8 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.9603 6.0506C20.9106 7.03855 19.9709 7.40975 19.242 6.741C18.9106 6.4369 18.5138 6.06255 18.0418 5.60285C16.9756 6.5731 15.322 8.08585 13.3506 9.91645C12.8329 10.3972 11.992 10.3435 11.5397 9.8007L11.5394 9.8003C10.6518 8.73835 9.75755 7.6807 8.8322 6.6514C7.7509 7.4453 5.81 8.95825 3.88389 10.8844C3.39573 11.3725 2.60427 11.3725 2.11612 10.8844C1.62796 10.3962 1.62796 9.60475 2.11612 9.1166C4.00573 7.227 6.079 5.4545 8.30255 3.96314L8.306 3.96082C8.30685 3.96027 8.3066 3.96042 8.3066 3.96042C8.8024 3.6299 9.46255 3.69527 9.8839 4.1166C10.8519 5.08455 11.7265 6.14925 12.6118 7.19265C14.1169 5.80065 15.3848 4.64087 16.274 3.8314C15.8705 3.41506 15.5362 3.06006 15.26 2.75898C14.591 2.02997 14.9624 1.08998 15.9506 1.04025C17.2115 0.976795 18.5055 0.939456 19.7511 1.17232C20.3119 1.27718 20.7233 1.68863 20.8281 2.24948C21.061 3.49521 21.0238 4.78949 20.9603 6.0506Z" fill="#637381"/>
+<g opacity="0.4">
+<path d="M2.60946 22.9843C1.77292 22.9631 1.13928 22.4599 1.07089 21.6259C1.02993 21.1264 1 20.4398 1 19.5C1 18.5602 1.02993 17.8736 1.07089 17.3741C1.13928 16.5401 1.77292 16.0369 2.60946 16.0157C2.97545 16.0064 3.43306 16 4 16C4.56694 16 5.02455 16.0064 5.39055 16.0157C6.2271 16.0369 6.8607 16.5401 6.9291 17.3741C6.97005 17.8736 7 18.5602 7 19.5C7 20.4398 6.97005 21.1264 6.9291 21.6259C6.8607 22.4599 6.2271 22.9631 5.39055 22.9843C5.02455 22.9936 4.56694 23 4 23C3.43306 23 2.97545 22.9936 2.60946 22.9843Z" fill="#637381"/>
+<path d="M18.8455 22.9792C17.8709 22.9408 17.1875 22.2557 17.1243 21.2823C17.0588 20.2731 17 18.6337 17 16C17 13.3663 17.0588 11.727 17.1243 10.7177C17.1875 9.74435 17.8709 9.0592 18.8455 9.02075C19.1671 9.00805 19.5489 9 20 9C20.4511 9 20.8329 9.00805 21.1545 9.02075C22.1291 9.0592 22.8125 9.74435 22.8757 10.7177C22.9412 11.727 23 13.3663 23 16C23 18.6337 22.9412 20.2731 22.8757 21.2823C22.8125 22.2557 22.1291 22.9408 21.1545 22.9792C20.8329 22.9919 20.4511 23 20 23C19.5489 23 19.1671 22.9919 18.8455 22.9792Z" fill="#637381"/>
+<path d="M10.7766 22.9832C9.8427 22.9548 9.162 22.3419 9.0949 21.41C9.0422 20.6775 9 19.5936 9 18C9 16.4064 9.0422 15.3225 9.0949 14.59C9.162 13.6581 9.8427 13.0453 10.7766 13.0169C11.1121 13.0067 11.5163 13 12 13C12.4837 13 12.8879 13.0067 13.2234 13.0169C14.1573 13.0453 14.838 13.6581 14.9051 14.59C14.9578 15.3225 15 16.4064 15 18C15 19.5936 14.9578 20.6775 14.9051 21.41C14.838 22.3419 14.1573 22.9548 13.2234 22.9832C12.8879 22.9934 12.4837 23 12 23C11.5163 23 11.1121 22.9934 10.7766 22.9832Z" fill="#637381"/>
+</g>
+</svg>

src/client/dd-hub-react/public/assets/icons/navbar/ic-blog.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M16.9841 2H7C4.25397 2 2 4.25397 2 7.01587V17C2 19.746 4.25397 22 7 22H16.9841C19.746 22 22 19.746 22 16.9841V7.01587C22 4.25397 19.746 2 16.9841 2Z" fill="#637381"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M14.254 18.1905C16.4286 18.1905 18.2064 16.4445 18.2223 14.2858V11.127L18.1905 10.9683L18.0794 10.7461L17.9048 10.6032C17.8005 10.5267 17.5196 10.5203 17.2101 10.5132C16.813 10.5041 16.3689 10.4939 16.1905 10.3334C15.9837 10.1413 15.9419 9.81166 15.8858 9.3701C15.8817 9.33731 15.8775 9.3039 15.8731 9.26989C15.7801 8.45979 15.6982 8.29413 15.5903 8.07571C15.5693 8.03306 15.5472 7.98841 15.5239 7.93655C14.9842 6.77782 13.4921 5.80957 12.4762 5.80957H9.71433C7.53973 5.80957 5.80957 7.53973 5.80957 9.69846V14.3016C5.80957 16.4604 7.53973 18.1905 9.71433 18.1905H14.254ZM9.7619 8.98413H11.9524C12.381 8.98413 12.7143 9.28572 12.7143 9.69842C12.7143 10.1111 12.3651 10.4127 11.9524 10.4127H9.7619C9.34921 10.4127 9 10.1111 9 9.69842C9 9.28572 9.34921 8.98413 9.7619 8.98413ZM9.7619 13.4286H14.2222C14.6349 13.4286 14.9683 13.8095 14.9683 14.2222C14.9683 14.6349 14.6349 15.0159 14.2222 15.0159H9.7619C9.33333 15.0159 9 14.6349 9 14.2222C9 13.8095 9.34921 13.4286 9.7619 13.4286Z" fill="#637381"/>
+</svg>

src/client/dd-hub-react/public/assets/icons/navbar/ic-cart.svg

@@ -0,0 +1,7 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.5505 10.5941C17.6091 10.0083 17.1491 9.5 16.5604 9.5C16.0492 9.5 15.6212 9.88735 15.5703 10.3961L15.2694 13.4059C15.2108 13.9917 15.6708 14.5 16.2595 14.5C16.7707 14.5 17.1987 14.1126 17.2496 13.6039L17.5505 10.5941Z" fill="#637381"/>
+<path d="M12.7496 10.3961C12.6987 9.88735 12.2707 9.5 11.7595 9.5C11.1708 9.5 10.7108 10.0083 10.7694 10.5941L11.0703 13.6039C11.1212 14.1126 11.5492 14.5 12.0604 14.5C12.6491 14.5 13.1091 13.9917 13.0505 13.4059L12.7496 10.3961Z" fill="#637381"/>
+<path d="M16.6602 19C16.6602 20.6569 18.0033 22 19.6602 22C21.317 22 22.6602 20.6569 22.6602 19C22.6602 17.3432 21.317 16 19.6602 16C18.0033 16 16.6602 17.3432 16.6602 19Z" fill="#637381"/>
+<path d="M6.16016 19C6.16016 20.6569 7.50331 22 9.16016 22C10.817 22 12.1602 20.6569 12.1602 19C12.1602 17.3432 10.817 16 9.16016 16C7.50331 16 6.16016 17.3432 6.16016 19Z" fill="#637381"/>
+<path opacity="0.4" d="M3.41016 2.00012C2.71981 2.00012 2.16016 2.55977 2.16016 3.25012C2.16016 3.94048 2.71981 4.50012 3.41016 4.50012H4.25251C4.48986 4.50012 4.69436 4.66605 4.74281 4.89837C4.96591 5.96777 5.59766 8.95907 6.10461 11.0001C6.73135 13.5236 7.29935 15.342 7.6574 16.4029C8.09928 16.1467 8.61259 16 9.16016 16C10.446 16 11.5429 16.809 11.9697 17.9457C12.7178 17.9791 13.5912 18.0001 14.6046 18.0001C15.462 18.0001 16.2042 17.9851 16.8452 17.9602C17.2681 16.8159 18.3689 16 19.6602 16C20.2143 16 20.7334 16.1503 21.1789 16.4123C21.5323 15.5226 22.0073 14.0331 22.4102 11.7501C22.6992 10.1123 22.8768 8.88287 22.986 7.99032C23.1201 6.89392 22.2647 6.00012 21.1602 6.00012H7.66016L7.03891 3.51505C6.81631 2.62472 6.01636 2.00012 5.09861 2.00012H3.41016Z" fill="#637381"/>
+</svg>

src/client/dd-hub-react/public/assets/icons/navbar/ic-disabled.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" fill-rule="evenodd" clip-rule="evenodd" d="M12 22.5C17.799 22.5 22.5 17.799 22.5 12C22.5 6.20101 17.799 1.5 12 1.5C6.20101 1.5 1.5 6.20101 1.5 12C1.5 17.799 6.20101 22.5 12 22.5ZM12 18.3C15.4794 18.3 18.3 15.4794 18.3 12C18.3 8.52061 15.4794 5.7 12 5.7C8.52061 5.7 5.7 8.52061 5.7 12C5.7 15.4794 8.52061 18.3 12 18.3Z" fill="#637381"/>
+<path d="M18.6028 3.01136C19.2179 2.39628 20.2151 2.39628 20.8302 3.01136C21.4453 3.62643 21.4453 4.62367 20.8302 5.23874L5.2385 20.8304C4.62342 21.4455 3.62619 21.4455 3.01111 20.8304C2.39604 20.2154 2.39604 19.2181 3.01111 18.6031L18.6028 3.01136Z" fill="#637381"/>
+</svg>

src/client/dd-hub-react/public/assets/icons/navbar/ic-doc-search.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <path d="M20 19.59V8l-6-6H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c.45 0 .85-.15 1.19-.4l-4.43-4.43c-.8.52-1.74.83-2.76.83-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5c0 1.02-.31 1.96-.83 2.75zM9 13c0 1.66 1.34 3 3 3s3-1.34 3-3-1.34-3-3-3-3 1.34-3 3"></path>
+</svg>

src/client/dd-hub-react/public/assets/icons/navbar/ic-lock.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M2.32694 4.28658C2.42248 3.46288 2.9222 2.78287 3.73187 2.60381C4.9948 2.32451 7.44275 2 12 2C16.5573 2 19.0052 2.32451 20.2682 2.60381C21.0778 2.78287 21.5775 3.46288 21.673 4.28658C21.8176 5.5322 22 7.58365 22 10C22 14.5142 19.6175 18.7382 15.6037 20.8039C14.2629 21.494 12.9543 22 12 22C11.0457 22 9.7371 21.494 8.3963 20.8039C4.38247 18.7382 2 14.5142 2 10C2 7.58365 2.18247 5.5322 2.32694 4.28658Z" fill="#637381"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.12105 7.7538C9.1895 6.21355 10.4582 5 12 5C13.5418 5 14.8105 6.21355 14.879 7.7538L14.9386 9.0968L15.0076 9.10265C15.8102 9.172 16.3768 9.7301 16.4377 10.5334C16.4735 11.0057 16.5 11.6444 16.5 12.5C16.5 13.3556 16.4735 13.9943 16.4377 14.4666C16.3768 15.2699 15.8102 15.828 15.0076 15.8974C14.3596 15.9534 13.3997 16 12 16C10.6003 16 9.6404 15.9534 8.9924 15.8974C8.18975 15.828 7.62325 15.2699 7.56235 14.4666C7.52655 13.9943 7.5 13.3556 7.5 12.5C7.5 11.7185 7.519 11.1179 7.54565 10.6598C7.5963 9.79025 8.19675 9.1729 9.0614 9.0959L9.12105 7.7538ZM12.8809 7.8426L12.9327 9.00755C12.6459 9.0027 12.3356 9 12 9C11.6648 9 11.3544 9.0027 11.0673 9.0075L11.1191 7.84265C11.14 7.3713 11.5283 7 12 7C12.4717 7 12.86 7.3713 12.8809 7.8426ZM13 12C13 12.4089 12.7545 12.7605 12.403 12.9155L12.4734 13.5415C12.4908 13.6961 12.4655 13.8652 12.3258 13.9338C12.2501 13.971 12.1446 14 12 14C11.8554 14 11.7499 13.971 11.6742 13.9338C11.5345 13.8652 11.5092 13.6961 11.5266 13.5415L11.597 12.9155C11.2455 12.7605 11 12.4089 11 12C11 11.4477 11.4477 11 12 11C12.5523 11 13 11.4477 13 12Z" fill="#637381"/>
+</svg>

src/client/dd-hub-react/public/assets/icons/navbar/ic-user.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M2.28099 19.6575C2.36966 20.5161 2.93261 21.1957 3.77688 21.3755C5.1095 21.6592 7.6216 22 12 22C16.3784 22 18.8905 21.6592 20.2232 21.3755C21.0674 21.1957 21.6303 20.5161 21.719 19.6575C21.8505 18.3844 22 16.0469 22 12C22 7.95305 21.8505 5.6156 21.719 4.34251C21.6303 3.48389 21.0674 2.80424 20.2231 2.62451C18.8905 2.34081 16.3784 2 12 2C7.6216 2 5.1095 2.34081 3.77688 2.62451C2.93261 2.80424 2.36966 3.48389 2.28099 4.34251C2.14952 5.6156 2 7.95305 2 12C2 16.0469 2.14952 18.3844 2.28099 19.6575Z" fill="#637381"/>
+<path d="M13.9382 13.8559C15.263 13.1583 16.1663 11.7679 16.1663 10.1666C16.1663 7.8655 14.3008 6 11.9996 6C9.69841 6 7.83291 7.8655 7.83291 10.1666C7.83291 11.768 8.73626 13.1584 10.0612 13.856C8.28691 14.532 6.93216 16.1092 6.51251 18.0529C6.45446 18.3219 6.60246 18.5981 6.87341 18.6471C7.84581 18.8231 9.45616 19 12.0006 19C14.545 19 16.1554 18.8231 17.1278 18.6471C17.3977 18.5983 17.5454 18.3231 17.4876 18.0551C17.0685 16.1103 15.7133 14.5321 13.9382 13.8559Z" fill="#637381"/>
+</svg>

src/client/dd-hub-react/public/assets/icons/notification/ic-notification-chat.svg

@@ -0,0 +1 @@
+<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" x1="39.907%" x2="113.315%" y1="39.91%" y2="113.318%"><stop offset="0" stop-color="#a7f3ce"/><stop offset="1" stop-color="#61db99"/></linearGradient><linearGradient id="b" x1="0%" x2="100%" y1="0%" y2="100%"><stop offset="0" stop-color="#5be584"/><stop offset="1" stop-color="#00ab55"/></linearGradient><linearGradient id="c" x1="0%" x2="100%" y1="0%" y2="100%"><stop offset="0" stop-color="#74caff"/><stop offset="1" stop-color="#0c53b7"/></linearGradient><g fill="none" fill-rule="evenodd"><path d="m15.9546562 7.27185938c4.38225-.0669375 7.9590001 3.38217192 8.0438438 7.76409372.0124687.6433594-.0518438 1.2695625-.1843125 1.8702188-.2243437 1.0170469-.3577031 2.052-.3577031 3.0935156v2.0131875c0 .3084375-.2500313.5584688-.5584688.5584688h-2.0131875c-1.0415156 0-2.0764687.1333593-3.0935156.3577031-.6006094.1324687-1.2268125.1967812-1.8701719.1843125-4.381875-.0847969-7.83098435-3.6614531-7.7641406-8.0436094.06520313-4.2773437 3.5203594-7.73254688 7.7976562-7.79789062z" fill="url(#a)" fill-rule="nonzero"/><path d="m15.9546562 7.27185938c4.38225-.0669375 7.9590001 3.38217192 8.0438438 7.76409372.0124687.6433594-.0518438 1.2695625-.1843125 1.8702188-.2243437 1.0170469-.3577031 2.052-.3577031 3.0935156v2.0131875c0 .3084375-.2500313.5584688-.5584688.5584688h-2.0131875c-1.0415156 0-2.0764687.1333593-3.0935156.3577031-.6006094.1324687-1.2268125.1967812-1.8701719.1843125-4.381875-.0847969-7.83098435-3.6614531-7.7641406-8.0436094.06520313-4.2773437 3.5203594-7.73254688 7.7976562-7.79789062z" fill="url(#b)"/><path d="m9.80146875.04260938c-5.33878125-.08156251-9.69623437 4.12035937-9.79964062 9.45876562-.01514063.7837031.06318749 1.5466875.224625 2.2784063.27328125 1.239.43575 2.4998906.43575 3.7687499v2.4525938c0 .37575.30459375.6803906.68039062.6803906h2.45259375c1.2688125 0 2.52970312.1624688 3.76875.43575.73171875.1613907 1.49465625.2397656 2.27835937.2245782 5.33831253-.1033594 9.54023433-4.4606719 9.45885933-9.79935942-.0794999-5.21095313-4.2887812-9.42032813-9.49968745-9.499875z" fill="url(#c)"/><g fill="#0c53b7"><path d="m6.19654688 9.17526562c-.272625-.28968749-.6585-.47160937-1.08778125-.47160937-.82560938 0-1.49489063.66928125-1.49489063 1.49489065 0 .4292343.181875.8151094.47160938 1.0877812l3.22471875 3.2247188c.27267187.2896875.65854687.4716093 1.08778125.4716093.82560937 0 1.49489062-.6692812 1.49489062-1.4948906 0-.4292344-.18192188-.8151094-.47160937-1.0877812z"/><path d="m10.4242031 9.17526562c-.272625-.28968749-.65849997-.47160937-1.08778122-.47160937-.82560938 0-1.49489063.66928125-1.49489063 1.49489065 0 .4292343.181875.8151094.47160938 1.0877812l3.22471877 3.2247188c.2726719.2896875.6585469.4716093 1.0877812.4716093.8256094 0 1.4948907-.6692812 1.4948907-1.4948906 0-.4292344-.1819219-.8151094-.4716094-1.0877812z"/><path d="m14.6518125 9.17526562c-.272625-.28968749-.6585-.47160937-1.0877813-.47160937-.8256093 0-1.4948906.66928125-1.4948906 1.49489065 0 .4292343.1819219.8151094.4716094 1.0877812l3.2247187 3.2247188c.2726719.2896875.6585469.4716093 1.0877813.4716093.8256094 0 1.4948906-.6692812 1.4948906-1.4948906 0-.4292344-.1819219-.8151094-.4716094-1.0877812z"/></g><g fill="#fff" fill-rule="nonzero"><circle cx="5.109" cy="10.198" r="1.495"/><circle cx="9.336" cy="10.198" r="1.495"/><circle cx="13.564" cy="10.198" r="1.495"/></g></g></svg>

src/client/dd-hub-react/public/assets/icons/notification/ic-notification-mail.svg

@@ -0,0 +1 @@
+<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><linearGradient id="a" x1="0%" x2="100%" y1="37.93%" y2="62.07%"><stop offset="0" stop-color="#ffa48d"/><stop offset="1" stop-color="#b72136"/></linearGradient><path id="b" d="m2.15609375.29484375h12.00031245c1.1045695 0 2 .8954305 2 2v15.99953125h-16.00031245v-15.99953125c0-1.1045695.8954305-2 2-2z"/><mask id="c" fill="#fff"><use fill="#fff" fill-rule="evenodd" xlink:href="#b"/></mask></defs><g fill="none" fill-rule="evenodd"><path d="m24 9.585-.703 8.935h-22.594l-.703-8.935 4-2.857h16z" fill="url(#a)"/><g transform="translate(3.844 .719)"><use fill="#d0f2ff" xlink:href="#b"/><path d="m3.21345312 3.02020312h4.74279688c.11045695 0 .2.08954306.2.2v1.00625c0 .11045695-.08954305.2-.2.2h-4.74279688c-.11045694 0-.2-.08954305-.2-.2v-1.00625c0-.11045694.08954306-.2.2-.2zm.00014063 3.42839063h9.88531245c.110457 0 .2.08954305.2.2v1.00625c0 .11045695-.089543.2-.2.2h-9.88531245c-.11045695 0-.2-.08954305-.2-.2v-1.00625c0-.11045695.08954305-.2.2-.2zm0 3.4284375h9.88531245c.110457 0 .2.08954305.2.19999995v1.00625c0 .110457-.089543.2-.2.2h-9.88531245c-.11045695 0-.2-.089543-.2-.2v-1.00625c0-.1104569.08954305-.19999995.2-.19999995z" fill="#74caff" mask="url(#c)"/></g><path d="m24 9.585v13.714l-12-1.115-12 1.115v-13.714l9.6 6.857h4.8z" fill="#ffa48d"/><path d="m24 9.585v13.714l-12-1.115v-5.742h2.4z" fill="#ff4842"/><path d="m24 23.299h-24l12-8.571z" fill="#ff4842"/><path d="m24 23.299h-12v-8.571z" fill="#b72136"/></g></svg>

src/client/dd-hub-react/public/assets/icons/notification/ic-notification-package.svg

@@ -0,0 +1 @@
+<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" x1="0%" x2="100%" y1=".004%" y2="99.996%"><stop offset="0" stop-color="#5be584"/><stop offset="1" stop-color="#00ab55"/></linearGradient><linearGradient id="b"><stop offset="0" stop-color="#ffe16a"/><stop offset="1" stop-color="#b78103"/></linearGradient><linearGradient id="c" x1="0%" x2="100%" xlink:href="#b" y1="33.335%" y2="66.665%"/><linearGradient id="d" x1="46.26%" x2="53.74%" xlink:href="#b" y1="0%" y2="100%"/><g fill="none" fill-rule="evenodd"><path d="m15.048 20.02c-1.0907987-1.8799016-.7822977-4.2581652.7520392-5.7975424 1.534337-1.5393772 3.9115761-1.8556761 5.7950449-.7710485 1.8834688 1.0846277 2.8030986 3.2994848 2.2418005 5.3992029-.5612982 2.0997182-2.4634376 3.5602579-4.6368846 3.5604215-1.7129421.0063742-3.2977706-.9062763-4.152-2.3910335z" fill="url(#a)"/><path d="m19.2 5.5775v7.2335c-1.7166788.0001456-3.3026139.9169895-4.1593869 2.4045801-.856773 1.4875907-.8539564 3.3194709.0073869 4.8044199l-5.448 3.145v-12.046l9.599-5.542z" fill="#ffe16a"/><path d="m9.6 11.119-3.343-1.93 9.6-5.542 3.342 1.93z" fill="#ffc107"/><path d="m15.857 3.647-9.6 5.542-2.446-1.412 9.598-5.542z" fill="url(#c)"/><path d="m9.6.035 3.809 2.2-9.598 5.542h-.001l-3.809-2.2z" fill="#ffe16a"/><path d="m9.6 11.119v12.046l-9.6-5.543v-12.045h.001l3.809 2.2v7.987l1.163-.48 1.267 1.44v-7.525l.017-.01z" fill="#ffc107"/><path d="m6.257 9.189-.017.01v7.525l-1.267-1.44-1.163.48v-7.987h.001z" fill="url(#d)"/><path d="m1.2415 17.7185c-.19329966 0-.35-.1567003-.35-.35v-1.296c0-.1932997.15670034-.35.35-.35s.35.1567003.35.35v1.296c0 .1932997-.15670034.35-.35.35zm1.421.8315c-.19329966 0-.35-.1567003-.35-.35v-1.1675c0-.1932997.15670034-.35.35-.35s.35.1567003.35.35v1.1675c0 .1932997-.15670034.35-.35.35zm1.4215.8205c-.19329966 0-.35-.1567003-.35-.35v-1.028c0-.1932997.15670034-.35.35-.35s.35.1567003.35.35v1.028c0 .1932997-.15670034.35-.35.35zm1.421.8205c-.19329966 0-.35-.1567003-.35-.35v-.8885c0-.1932997.15670034-.35.35-.35s.35.1567003.35.35v.8885c0 .1932997-.15670034.35-.35.35zm1.421.8395c-.19329966 0-.35-.1567003-.35-.35v-.768c0-.1932997.15670034-.35.35-.35s.35.1567003.35.35v.768c0 .1932997-.15670034.35-.35.35z" fill="#ffe16a"/><path d="m11.5888 18.0470503c-.1585311.0002073-.2974056-.1061671-.3384968-.2592803-.0410911-.1531132.0258634-.3147262.1631968-.39392l1.5945-.9205c.1082961-.0625215.2417207-.0625184.350014.000008.1082932.0625265.175.1780771.175.3031251 0 .1250479-.0667179.2405954-.175014.3031169l-1.5945.9204c-.0530713.0308005-.1133385.0470316-.1747.0470503z" fill="#b78103"/><path d="m18.11 19.3200003c-.1025165.0001366-.1999191-.0447622-.2664-.1228003l-1.16-1.35895c-.0822583-.0949733-.1072983-.2267514-.0656083-.3452769s.1437126-.2056108.2673136-.2281755c.1236009-.0225647.2498135.0228536.3306947.1190024l.93805 1.09895 3.075-2.50175c.0969003-.0798306.2291361-.1016444.3465425-.0571661.1174065.0444783.2019957.1484341.2216779.2724309s-.0285581.2490369-.1264204.3276852l-3.34 2.71755c-.0623537.0508655-.1403809.0785998-.22085.0785003z" fill="#005249" fill-rule="nonzero"/><path d="m12.5425 11.3317c-.0771973-.0817777-.1889878-.1214799-.3004729-.1067123-.1114852.0147677-.2090836.082206-.2623271.1812623l-.845 1.572c-.0583242.1084299-.0553868.2395303.0077352.3452392s.1771439.1704773.3002648.1705608c.1305767.0002905.2510292-.0702925.3146-.18435l.1927-.34735v3.00865c0 .1932997.1567003.35.35.35s.35-.1567003.35-.35v-3.51845l.2845.30775c.0631331.0674517.1505922.1068933.2429416.1095598s.1819386-.0316631.2488584-.0953598c.0673574-.0639388.106541-.152027.108923-.2448683.002382-.0928414-.032233-.182823-.096223-.2501317z" fill="#b78103"/></g></svg>

src/client/dd-hub-react/public/assets/icons/notification/ic-notification-shipping.svg

@@ -0,0 +1 @@
+<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" x1="14.104%" x2="85.896%" y1="0%" y2="100%"><stop offset="0" stop-color="#ffe16a"/><stop offset="1" stop-color="#b78103"/></linearGradient><g fill="none" fill-rule="evenodd" transform="translate(0 1)"><path d="m15.1110698 8.30009302h4.3585116c.3817736 0 .7460423.16013285 1.004093.44148838l3.5106977 3.8249302v4.8429768c0 .361502-.1435207.7082149-.3991412.9638355-.2556206.2556205-.6023335.3991412-.9638356.3991412h-1.0733023c0-1.3171606-1.0677696-2.3849302-2.3849302-2.3849302s-2.3849302 1.0677696-2.3849302 2.3849302h-1.6671628z" fill="url(#a)"/><circle cx="19.163" cy="18.772" fill="#7a4f01" r="2.385"/><path d="m15.1110698 12.5665116v6.2059535h-7.25860468c0-1.3173147-1.06789458-2.3852093-2.38520931-2.3852093-1.31731472 0-2.3852093 1.0678946-2.3852093 2.3852093h-1.70344186c-.36150206 0-.70821494-.1435207-.96383551-.3991412-.25562056-.2556206-.39914125-.6023335-.39914125-.9638355v-11.37934887c0-.36150206.14352069-.70821494.39914125-.9638355.25562057-.25562056.60233345-.39914126.96383551-.39914126h1.47851163c.08500164 2.4030825 2.05774024 4.30727527 4.46232558 4.30727527s4.37732394-1.90419277 4.46232554-4.30727527h1.9663256c.7527258 0 1.3629768.61025103 1.3629768 1.36297676z" fill="#b78103"/><path d="m11.7845581 4.51702326c0 .05023255-.0005581.10046511-.0027907.15013953-.0850016 2.40308248-2.0577402 4.30727525-4.46232554 4.30727525s-4.37732394-1.90419277-4.46232558-4.30727525c-.00223256-.04967442-.0027907-.09990698-.0027907-.15013953 0-2.46601563 1.99910065-4.46511628 4.46511628-4.46511628s4.46511624 1.99910065 4.46511624 4.46511628z" fill="#74caff" stroke="#74caff"/><path d="m5.46697674 16.3875349c1.3171606 0 2.38493024 1.0677696 2.38493024 2.3849302s-1.06776964 2.3849302-2.38493024 2.3849302c-1.31716059 0-2.38493023-1.0677696-2.38493023-2.3849302 0-1.3171478 1.06778241-2.3849302 2.38493023-2.3849302z" fill="#7a4f01"/><path d="m8.8096186 6.30306977c-.09917416.00012442-.19465699-.03760557-.26695813-.10548837l-1.49023256-1.39534884c-.0788836-.07387832-.12362791-.17713235-.12362791-.2852093v-2.89562791c0-.21577637.17492131-.39069768.39069767-.39069768.21577637 0 .39069768.17492131.39069768.39069768v2.72651163l1.36654884 1.27953488c.11707405.10960812.15527467.27962928.09633971.42878338-.05893496.14915409-.20303407.2471236-.36340948.2471236z" fill="#0c53b7"/></g></svg>

src/client/dd-hub-react/public/assets/icons/shape-avatar.svg

@@ -0,0 +1 @@
+<svg height="62" viewBox="0 0 144 62" width="144" xmlns="http://www.w3.org/2000/svg"><path d="m111.34 23.88c-10.62-10.46-18.5-23.88-38.74-23.88h-1.2c-20.24 0-28.12 13.42-38.74 23.88-7.72 9.64-19.44 11.74-32.66 12.12v26h144v-26c-13.22-.38-24.94-2.48-32.66-12.12z" fill="#fff" fill-rule="evenodd"/></svg>

src/client/dd-hub-react/public/assets/illustrations/illustration-404.svg

@@ -0,0 +1,40 @@
+<svg width="480" height="360" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd"
+    d="M0 198.781c0 41.457 14.945 79.235 39.539 107.785 28.214 32.765 69.128 53.365 114.734 53.434a148.458 148.458 0 0056.495-11.036c9.051-3.699 19.182-3.274 27.948 1.107a75.774 75.774 0 0033.957 8.011c5.023 0 9.942-.495 14.7-1.434 13.581-2.67 25.94-8.99 36.089-17.94 6.379-5.627 14.548-8.456 22.898-8.446h.142c27.589 0 53.215-8.732 74.492-23.696 19.021-13.36 34.554-31.696 44.904-53.225C474.92 234.581 480 213.388 480 190.958c0-76.931-59.774-139.305-133.498-139.305-7.516 0-14.88.663-22.063 1.899C305.418 21.42 271.355 0 232.498 0a103.647 103.647 0 00-45.879 10.661c-13.24 6.487-25.011 15.705-34.641 26.939-32.697.544-62.93 11.69-87.675 30.291C25.351 97.155 0 144.882 0 198.781z"
+    fill="url(#prefix__paint0_linear)" opacity=".2" />
+  <g filter="url(#prefix__filter0_d)">
+    <circle opacity=".15" cx="182.109" cy="97.623" r="44.623" fill="#FFC107" />
+    <circle cx="182.109" cy="97.623" r="23.406" fill="url(#prefix__paint1_linear)" />
+    <path fill-rule="evenodd" clip-rule="evenodd"
+      d="M244.878 306.611c34.56 0 62.575-28.016 62.575-62.575 0-34.56-28.015-62.576-62.575-62.576-34.559 0-62.575 28.016-62.575 62.576 0 34.559 28.016 62.575 62.575 62.575zm0-23.186c21.754 0 39.389-17.635 39.389-39.389 0-21.755-17.635-39.39-39.389-39.39s-39.389 17.635-39.389 39.39c0 21.754 17.635 39.389 39.389 39.389z"
+      fill="#061B64" />
+    <path fill-rule="evenodd" clip-rule="evenodd"
+      d="M174.965 264.592c0-4.133-1.492-5.625-5.637-5.625h-11.373v-66.611c0-4.476-1.492-5.637-5.638-5.637h-9.172a9.866 9.866 0 00-7.948 3.974l-55.03 68.274a11.006 11.006 0 00-1.957 6.787v5.968c0 4.145 1.492 5.637 5.625 5.637h54.676v21.707c0 4.133 1.492 5.625 5.625 5.625h8.12c4.146 0 5.638-1.492 5.638-5.625v-21.707h11.434c4.414 0 5.637-1.492 5.637-5.637v-7.13zm-72.42-5.625l35.966-44.415v44.415h-35.966zM411.607 264.592c0-4.133-1.492-5.625-5.638-5.625h-11.422v-66.611c0-4.476-1.492-5.637-5.637-5.637h-9.111a9.87 9.87 0 00-7.949 3.974l-55.03 68.274a11.011 11.011 0 00-1.981 6.787v5.968c0 4.145 1.492 5.637 5.626 5.637h54.687v21.707c0 4.133 1.492 5.625 5.626 5.625h8.12c4.145 0 5.637-1.492 5.637-5.625v-21.707h11.434c4.476 0 5.638-1.492 5.638-5.637v-7.13zm-72.42-5.625l35.965-44.415v44.415h-35.965z"
+      fill="#2065D1" />
+    <path opacity=".24"
+      d="M425.621 117.222a8.267 8.267 0 00-9.599-8.157 11.129 11.129 0 00-9.784-5.87h-.403a13.23 13.23 0 00-20.365-14.078 13.23 13.23 0 00-5.316 14.078h-.403a11.153 11.153 0 100 22.293h38.68v-.073a8.279 8.279 0 007.19-8.193zM104.258 199.045a7.093 7.093 0 00-7.093-7.092c-.381.007-.761.039-1.138.097a9.552 9.552 0 00-8.425-5.026h-.343a11.348 11.348 0 10-22.012 0h-.342a9.564 9.564 0 100 19.114h33.177v-.061a7.107 7.107 0 006.176-7.032z"
+      fill="#2065D1" />
+  </g>
+  <defs>
+    <linearGradient id="prefix__paint0_linear" x1="328.81" y1="424.032" x2="505.393" y2="26.048"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#2065D1" />
+      <stop offset="1" stop-color="#2065D1" stop-opacity=".01" />
+    </linearGradient>
+    <linearGradient id="prefix__paint1_linear" x1="135.297" y1="97.623" x2="182.109" y2="144.436"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FFE16A" />
+      <stop offset="1" stop-color="#B78103" />
+    </linearGradient>
+    <filter id="prefix__filter0_d" x="51" y="49" width="394.621" height="277.611" filterUnits="userSpaceOnUse"
+      color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" />
+      <feOffset dx="8" dy="8" />
+      <feGaussianBlur stdDeviation="6" />
+      <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
+      <feBlend in2="BackgroundImageFix" result="effect1_dropShadow" />
+      <feBlend in="SourceGraphic" in2="effect1_dropShadow" result="shape" />
+    </filter>
+  </defs>
+</svg>

src/client/dd-hub-react/public/vite.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

src/client/dd-hub-react/src/App.css

@@ -1,42 +0,0 @@
-#root {
-  max-width: 1280px;
-  margin: 0 auto;
-  padding: 2rem;
-  text-align: center;
-}
-
-.logo {
-  height: 6em;
-  padding: 1.5em;
-  will-change: filter;
-  transition: filter 300ms;
-}
-.logo:hover {
-  filter: drop-shadow(0 0 2em #646cffaa);
-}
-.logo.react:hover {
-  filter: drop-shadow(0 0 2em #61dafbaa);
-}
-
-@keyframes logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  a:nth-of-type(2) .logo {
-    animation: logo-spin infinite 20s linear;
-  }
-}
-
-.card {
-  padding: 2em;
-}
-
-.read-the-docs {
-  color: #888;
-}

src/client/dd-hub-react/src/App.jsx

@@ -1,35 +0,0 @@
-import { useState } from 'react'
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
-import './App.css'
-
-function App() {
-  const [count, setCount] = useState(0)
-
-  return (
-    <>
-      <div>
-        <a href="https://vite.dev" target="_blank">
-          <img src={viteLogo} className="logo" alt="Vite logo" />
-        </a>
-        <a href="https://react.dev" target="_blank">
-          <img src={reactLogo} className="logo react" alt="React logo" />
-        </a>
-      </div>
-      <h1>Vite + React</h1>
-      <div className="card">
-        <button onClick={() => setCount((count) => count + 1)}>
-          count is {count}
-        </button>
-        <p>
-          Edit <code>src/App.jsx</code> and save to test HMR
-        </p>
-      </div>
-      <p className="read-the-docs">
-        Click on the Vite and React logos to learn more
-      </p>
-    </>
-  )
-}
-
-export default App

src/client/dd-hub-react/src/_mock/_data.ts

@@ -0,0 +1,564 @@
+
+import { Doc } from 'src/services/document-service';
+import { Product } from 'src/services/product-service';
+import { Attribute, Type } from 'src/services/attribute-service';
+
+import {
+  _id,
+  _price,
+  _times,
+  _company,
+  _boolean,
+  _fullName,
+  _taskNames,
+  _postTitles,
+  _description,
+  _productNames,
+  _base64,
+} from './_mock';
+
+// ----------------------------------------------------------------------
+
+export const _myAccount = {
+  displayName: 'Jaydon Frankie',
+  email: 'demo@minimals.cc',
+  photoURL: '/assets/images/avatar/avatar-25.webp',
+};
+
+// ----------------------------------------------------------------------
+
+export const _users = [...Array(24)].map((_, index) => ({
+  id: _id(index),
+  name: _fullName(index),
+  company: _company(index),
+  isVerified: _boolean(index),
+  avatarUrl: `/assets/images/avatar/avatar-${index + 1}.webp`,
+  status: index % 4 ? 'active' : 'banned',
+  role:
+    [
+      'Leader',
+      'Hr Manager',
+      'UI Designer',
+      'UX Designer',
+      'UI/UX Designer',
+      'Project Manager',
+      'Backend Developer',
+      'Full Stack Designer',
+      'Front End Developer',
+      'Full Stack Developer',
+    ][index] || 'UI Designer',
+}));
+
+// ----------------------------------------------------------------------
+
+export const _posts = [...Array(23)].map((_, index) => ({
+  id: _id(index),
+  title: _postTitles(index),
+  description: _description(index),
+  coverUrl: `/assets/images/cover/cover-${index + 1}.webp`,
+  totalViews: 8829,
+  totalComments: 7977,
+  totalShares: 8556,
+  totalFavorites: 8870,
+  postedAt: _times(index),
+  author: {
+    name: _fullName(index),
+    avatarUrl: `/assets/images/avatar/avatar-${index + 1}.webp`,
+  },
+}));
+
+// ----------------------------------------------------------------------
+
+const COLORS = [
+  '#00AB55',
+  '#000000',
+  '#FFFFFF',
+  '#FFC0CB',
+  '#FF4842',
+  '#1890FF',
+  '#94D82D',
+  '#FFC107',
+];
+
+export const _productsTextile = [...Array(24)].map((_, index) => {
+  const setIndex = index + 1;
+
+  return {
+    id: _id(index),
+    price: _price(index),
+    name: _productNames(index),
+    priceSale: setIndex % 3 ? null : _price(index),
+    coverUrl: `/assets/images/product/product-${setIndex}.webp`,
+    colors:
+      (setIndex === 1 && COLORS.slice(0, 2)) ||
+      (setIndex === 2 && COLORS.slice(1, 3)) ||
+      (setIndex === 3 && COLORS.slice(2, 4)) ||
+      (setIndex === 4 && COLORS.slice(3, 6)) ||
+      (setIndex === 23 && COLORS.slice(4, 6)) ||
+      (setIndex === 24 && COLORS.slice(5, 6)) ||
+      COLORS,
+    status:
+      ([1, 3, 5].includes(setIndex) && 'sale') || ([4, 8, 12].includes(setIndex) && 'new') || '',
+  };
+});
+
+// ----------------------------------------------------------------------
+
+export const _langs = [
+  {
+    value: 'en',
+    label: 'English',
+    icon: '/assets/icons/flags/ic-flag-en.svg',
+  },
+  {
+    value: 'de',
+    label: 'German',
+    icon: '/assets/icons/flags/ic-flag-de.svg',
+  },
+  {
+    value: 'fr',
+    label: 'French',
+    icon: '/assets/icons/flags/ic-flag-fr.svg',
+  },
+];
+
+// ----------------------------------------------------------------------
+
+export const _timeline = [...Array(5)].map((_, index) => ({
+  id: _id(index),
+  title: [
+    '1983, orders, $4220',
+    '12 Invoices have been paid',
+    'Order #37745 from September',
+    'New order placed #XF-2356',
+    'New order placed #XF-2346',
+  ][index],
+  type: `order${index + 1}`,
+  time: _times(index),
+}));
+
+export const _traffic = [
+  {
+    value: 'facebook',
+    label: 'Facebook',
+    total: 19500,
+  },
+  {
+    value: 'google',
+    label: 'Google',
+    total: 91200,
+  },
+  {
+    value: 'linkedin',
+    label: 'Linkedin',
+    total: 69800,
+  },
+  {
+    value: 'twitter',
+    label: 'Twitter',
+    total: 84900,
+  },
+];
+
+export const _tasks = Array.from({ length: 5 }, (_, index) => ({
+  id: _id(index),
+  name: _taskNames(index),
+}));
+
+// ----------------------------------------------------------------------
+
+export const _notifications = [
+  {
+    id: _id(1),
+    title: 'Your order is placed',
+    description: 'waiting for shipping',
+    avatarUrl: null,
+    type: 'order-placed',
+    postedAt: _times(1),
+    isUnRead: true,
+  },
+  {
+    id: _id(2),
+    title: _fullName(2),
+    description: 'answered to your comment on the Minimal',
+    avatarUrl: '/assets/images/avatar/avatar-2.webp',
+    type: 'friend-interactive',
+    postedAt: _times(2),
+    isUnRead: true,
+  },
+  {
+    id: _id(3),
+    title: 'You have new message',
+    description: '5 unread messages',
+    avatarUrl: null,
+    type: 'chat-message',
+    postedAt: _times(3),
+    isUnRead: false,
+  },
+  {
+    id: _id(4),
+    title: 'You have new mail',
+    description: 'sent from Guido Padberg',
+    avatarUrl: null,
+    type: 'mail',
+    postedAt: _times(4),
+    isUnRead: false,
+  },
+  {
+    id: _id(5),
+    title: 'Delivery processing',
+    description: 'Your order is being shipped',
+    avatarUrl: null,
+    type: 'order-shipped',
+    postedAt: _times(5),
+    isUnRead: false,
+  },
+];
+
+// ----------------------------------------------------------------------
+
+export const _products: Product[] = [
+  {
+    id: '1',
+    name: "User Manager",
+    version: "1.0.0"
+  },
+  {
+    id: '2',
+    name: "Envelope Generator",
+    version: "1.0.0"
+  }
+];
+
+// ----------------------------------------------------------------------
+
+export const _attributes: Attribute[] = [
+  { id: 1, label: 'Rechnungsnummer', name: 'invoiceNumber', type: 'VARCHAR' },
+  { id: 2, label: 'Kundenname', name: 'customerName', type: 'INTEGER' },
+  { id: 3, label: 'Startdatum', name: 'startDate', type: 'DATE' },
+  { id: 4, label: 'Enddatum', name: 'endDate', type: 'DATE' },
+  { id: 5, label: 'Status der Rechnung', name: 'status', type: 'VARCHAR' },
+  { id: 6, label: 'Mindestbetrag', name: 'minAmount', type: 'DECIMAL' },
+  { id: 7, label: 'Höchstbetrag', name: 'maxAmount', type: 'DECIMAL' },
+  { id: 8, label: 'Steuer inbegriffen?', name: 'taxIncluded', type: 'BOOLEAN' },
+  { id: 9, label: 'Währung', name: 'currency', type: 'VARCHAR' },
+  { id: 10, label: 'Erstellungsdatum', name: 'createdAt', type: 'DATE' },
+  { id: 11, label: 'Lieferzeit', name: 'deliveryTime', type: 'TIME' },
+  { id: 12, label: 'Letzte Aktualisierung', name: 'lastUpdated', type: 'DATETIME' }
+];
+
+// ----------------------------------------------------------------------
+
+export const _documents: Doc[] = [
+  {
+    id: 1,
+    name: "example1.pdf",
+    addedWhen: new Date("2024-01-12T10:00:00Z"),
+    addedWho: "TekH",
+    attributes: [
+      {
+        name: "invoiceNumber",
+        serilizedValue: "INV-20250714-001",
+        type: 'VARCHAR'
+      },
+      {
+        name: "customerName",
+        serilizedValue: "John Doe",
+        type: 'VARCHAR'
+      },
+      {
+        name: "startDate",
+        serilizedValue: "2025-07-01",
+        type: 'DATE'
+      },
+      {
+        name: "endDate",
+        serilizedValue: "2025-07-14",
+        type: 'DATE'
+      },
+      {
+        name: "minAmount",
+        serilizedValue: "100.50",
+        type: 'DECIMAL'
+      },
+      {
+        name: "maxAmount",
+        serilizedValue: "1000.00",
+        type: 'DECIMAL'
+      },
+      {
+        name: "taxIncluded",
+        serilizedValue: "true",
+        type: 'BOOLEAN'
+      },
+      {
+        name: "createdAt",
+        serilizedValue: "2025-07-10",
+        type: 'DATE'
+      },
+      {
+        name: "deliveryTime",
+        serilizedValue: "15:30:00",
+        type: 'TIME'
+      },
+      {
+        name: "lastUpdated",
+        serilizedValue: "2025-07-14T10:45:00",
+        type: 'DATETIME'
+      }
+    ]
+  },
+  {
+    id: 2,
+    name: "example2.pdf",
+    addedWhen: new Date("2024-02-03T09:30:00Z"),
+    addedWho: "bob",
+    changedWhen: new Date("2024-03-15T12:00:00Z"),
+    changedWho: "KammM",
+    attributes: [
+      {
+        name: "invoiceNumber",
+        serilizedValue: "INV-20250701-007",
+        type: 'VARCHAR'
+      },
+      {
+        name: "customerName",
+        serilizedValue: "Jane Smith",
+        type: 'VARCHAR'
+      },
+      {
+        name: "startDate",
+        serilizedValue: "2025-06-01",
+        type: 'DATE'
+      },
+      {
+        name: "endDate",
+        serilizedValue: "2025-06-30",
+        type: 'DATE'
+      },
+      {
+        name: "minAmount",
+        serilizedValue: "250.00",
+        type: 'DECIMAL'
+      },
+      {
+        name: "maxAmount",
+        serilizedValue: "850.75",
+        type: 'DECIMAL'
+      },
+      {
+        name: "taxIncluded",
+        serilizedValue: "false",
+        type: 'BOOLEAN'
+      },
+      {
+        name: "createdAt",
+        serilizedValue: "2025-06-15",
+        type: 'DATE'
+      },
+      {
+        name: "deliveryTime",
+        serilizedValue: "09:00:00",
+        type: 'TIME'
+      },
+      {
+        name: "lastUpdated",
+        serilizedValue: "2025-06-30T14:15:00",
+        type: 'DATETIME'
+      }
+    ]
+  },
+  {
+    id: 3,
+    name: "document1.docx",
+    addedWhen: new Date("2023-12-20T14:45:00Z"),
+    addedWho: "SchreiberM",
+    attributes: [
+      {
+        name: "invoiceNumber",
+        serilizedValue: "INV-20250620-043",
+        type: 'VARCHAR'
+      },
+      {
+        name: "customerName",
+        serilizedValue: "Max Mustermann",
+        type: 'VARCHAR'
+      },
+      {
+        name: "startDate",
+        serilizedValue: "2025-05-01",
+        type: 'DATE'
+      },
+      {
+        name: "endDate",
+        serilizedValue: "2025-05-15",
+        type: 'DATE'
+      },
+      {
+        name: "maxAmount",
+        serilizedValue: "600.00",
+        type: 'DECIMAL'
+      },
+      {
+        name: "taxIncluded",
+        serilizedValue: "true",
+        type: 'BOOLEAN'
+      },
+      {
+        name: "createdAt",
+        serilizedValue: "2025-05-02",
+        type: 'DATE'
+      },
+      {
+        name: "lastUpdated",
+        serilizedValue: "2025-05-15T11:00:00",
+        type: 'DATETIME'
+      }
+    ]
+  },
+  {
+    id: 4,
+    name: "spreadsheet1.xlsx",
+    addedWhen: new Date("2024-05-01T08:15:00Z"),
+    addedWho: "KammM",
+    changedWhen: new Date("2024-06-10T16:20:00Z"),
+    changedWho: "OlgunR",
+    attributes: [
+      {
+        name: "invoiceNumber",
+        serilizedValue: "INV-20250410-021",
+        type: 'VARCHAR'
+      },
+      {
+        name: "startDate",
+        serilizedValue: "2025-04-01",
+        type: 'DATE'
+      },
+      {
+        name: "endDate",
+        serilizedValue: "2025-04-30",
+        type: 'DATE'
+      },
+      {
+        name: "minAmount",
+        serilizedValue: "150.99",
+        type: 'DECIMAL'
+      },
+      {
+        name: "maxAmount",
+        serilizedValue: "999.99",
+        type: 'DECIMAL'
+      },
+      {
+        name: "createdAt",
+        serilizedValue: "2025-04-15",
+        type: 'DATE'
+      },
+      {
+        name: "deliveryTime",
+        serilizedValue: "17:45:00",
+        type: 'TIME'
+      },
+      {
+        name: "lastUpdated",
+        serilizedValue: "2025-04-30T18:30:00",
+        type: 'DATETIME'
+      }
+    ]
+  },
+  {
+    id: 5,
+    name: "report.docx",
+    addedWhen: new Date("2024-04-17T11:25:00Z"),
+    addedWho: "SchreiberM",
+    attributes: [
+      {
+        name: "invoiceNumber",
+        serilizedValue: "INV-20250305-099",
+        type: 'VARCHAR'
+      },
+      {
+        name: "customerName",
+        serilizedValue: "Ali Veli",
+        type: 'VARCHAR'
+      },
+      {
+        name: "startDate",
+        serilizedValue: "2025-03-01",
+        type: 'DATE'
+      },
+      {
+        name: "endDate",
+        serilizedValue: "2025-03-20",
+        type: 'DATE'
+      },
+      {
+        name: "minAmount",
+        serilizedValue: "75.00",
+        type: 'DECIMAL'
+      },
+      {
+        name: "maxAmount",
+        serilizedValue: "500.00",
+        type: 'DECIMAL'
+      },
+      {
+        name: "taxIncluded",
+        serilizedValue: "false",
+        type: 'BOOLEAN'
+      },
+      {
+        name: "createdAt",
+        serilizedValue: "2025-03-02",
+        type: 'DATE'
+      },
+      {
+        name: "deliveryTime",
+        serilizedValue: "08:20:00",
+        type: 'TIME'
+      },
+      {
+        name: "lastUpdated",
+        serilizedValue: "2025-03-20T09:30:00",
+        type: 'DATETIME'
+      }
+    ]
+  }
+]
+  .map(doc => ({
+    ...doc,
+    attributes: doc.attributes?.map(attr => ({
+      ...attr,
+      type: attr.type as Type
+    }))
+  }))
+  .map(doc => Doc.map(doc));
+
+function base64ToUint8Array(base64: string): Uint8Array {
+  const binaryString = atob(base64); // Decode base64 to binary string
+  const len = binaryString.length;
+  const bytes = new Uint8Array(len);
+
+  for (let i = 0; i < len; i++) {
+    bytes[i] = binaryString.charCodeAt(i);
+  }
+
+  return bytes;
+}
+
+export function _genFile(name: string): Uint8Array | undefined {
+  switch (name) {
+    case "example1.pdf":
+      return base64ToUint8Array(_base64.example1_pdf);
+    case "example2.pdf":
+      return base64ToUint8Array(_base64.example2_pdf);
+    case "document1.docx":
+      return base64ToUint8Array(_base64.document1_docx);
+    case "spreadsheet1.xlsx":
+      return base64ToUint8Array(_base64.spreadsheet1_xlsx);
+    case "report.docx":
+      return base64ToUint8Array(_base64.report_docx);
+    default:
+      return undefined;
+  }
+}

src/client/dd-hub-react/src/_mock/index.ts

@@ -0,0 +1,2 @@
+export * from './_mock';
+export * from './_data';

src/client/dd-hub-react/src/app.tsx

@@ -0,0 +1,62 @@
+import 'src/global.css';
+
+import { useEffect } from 'react';
+
+import Fab from '@mui/material/Fab';
+
+import { usePathname } from 'src/routes/hooks';
+
+import { ThemeProvider } from 'src/theme/theme-provider';
+
+// ----------------------------------------------------------------------
+
+type AppProps = {
+  children: React.ReactNode;
+};
+
+export default function App({ children }: AppProps) {
+  useScrollToTop();
+
+  const ddButton = () => (
+    <Fab
+      size="medium"
+      aria-label="Digital Data"
+      href="https://digitaldata.works/"
+      target="_blank"
+      sx={{
+        zIndex: 9,
+        right: 20,
+        bottom: 20,
+        width: 48,
+        height: 48,
+        position: 'fixed',
+        bgcolor: 'transparent',
+        boxShadow: 'none'
+      }}
+    >
+      <img
+        src="/assets/images/dd-button-icon.webp"
+        alt="Digital Data"
+      />
+    </Fab>
+  );
+
+  return (
+    <ThemeProvider>
+      {children}
+      {ddButton()}
+    </ThemeProvider>
+  );
+}
+
+// ----------------------------------------------------------------------
+
+function useScrollToTop() {
+  const pathname = usePathname();
+
+  useEffect(() => {
+    window.scrollTo(0, 0);
+  }, [pathname]);
+
+  return null;
+}

src/client/dd-hub-react/src/assets/react.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>