@igstack/app-catalog-frontend-core 0.0.1

package/src/appPropsFactory.ts

@@ -0,0 +1,37 @@
+import { createBrowserHistory } from '@tanstack/react-router'
+import { createTRPCClient, httpBatchLink } from '@trpc/client'
+import { AcDb } from './userDb/AcDb'
+import type { TRPCRouter } from '@igstack/app-catalog-backend-core'
+import type { AppProps } from './App'
+import type { EhPlugin } from './modules/pluginCore/types'
+import { createQueryClient } from '~/api/infra/createQueryClient'
+import { createEhRouter } from '~/util/createEhRouter'
+
+// registerSW();
+export function appPropsFactory(): AppProps {
+  const trpcClient = createTRPCClient<TRPCRouter>({
+    links: [
+      httpBatchLink({
+        url: `${window.location.origin}/api/trpc`,
+      }),
+    ],
+  })
+
+  const db = new AcDb()
+  const queryClient = createQueryClient({ trpcClient, db })
+  const plugins: Array<EhPlugin> = [
+    // Future plugins can be added here
+  ]
+  const router = createEhRouter({
+    history: createBrowserHistory(),
+    context: {
+      queryClient,
+      trpcClient,
+      db,
+      plugins,
+      boostrapHealth: {},
+    },
+  })
+
+  return { router, queryClient, trpcClient, db }
+}

package/src/assets/app-catalog.svg

@@ -0,0 +1,198 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 443.93 270.99">
+  <defs>
+    <style>
+      .cls-1, .cls-2, .cls-3, .cls-4, .cls-5, .cls-6, .cls-7, .cls-8, .cls-9, .cls-10, .cls-11, .cls-12, .cls-13, .cls-14, .cls-15, .cls-16, .cls-17, .cls-18 {
+        stroke-miterlimit: 10;
+      }
+
+      .cls-1, .cls-2, .cls-3, .cls-4, .cls-5, .cls-6, .cls-7, .cls-8, .cls-9, .cls-10, .cls-11, .cls-12, .cls-14, .cls-15, .cls-16, .cls-17, .cls-18 {
+        stroke: #231f20;
+      }
+
+      .cls-1, .cls-2, .cls-4, .cls-8, .cls-11, .cls-14, .cls-18 {
+        stroke-width: 2px;
+      }
+
+      .cls-1, .cls-3, .cls-6, .cls-8, .cls-13, .cls-16 {
+        fill: none;
+      }
+
+      .cls-2 {
+        fill: #87a2d4;
+      }
+
+      .cls-2, .cls-4, .cls-5, .cls-6, .cls-7, .cls-8, .cls-9, .cls-10, .cls-11, .cls-12, .cls-14, .cls-15, .cls-16, .cls-17, .cls-18 {
+        stroke-linecap: round;
+      }
+
+      .cls-19 {
+        fill: #faf7ed;
+      }
+
+      .cls-3, .cls-6, .cls-10, .cls-17 {
+        stroke-width: 4px;
+      }
+
+      .cls-4 {
+        fill: #eca832;
+      }
+
+      .cls-5 {
+        fill: #e4724a;
+      }
+
+      .cls-5, .cls-7, .cls-12, .cls-13, .cls-15, .cls-16 {
+        stroke-width: 3px;
+      }
+
+      .cls-20 {
+        fill: #f2999b;
+      }
+
+      .cls-21 {
+        fill: #fcf7eb;
+      }
+
+      .cls-22 {
+        fill: #fff;
+      }
+
+      .cls-23 {
+        fill: #fceac1;
+      }
+
+      .cls-24 {
+        fill: #dc6827;
+      }
+
+      .cls-7 {
+        fill: #708fc8;
+      }
+
+      .cls-25 {
+        fill: #fdf5d8;
+      }
+
+      .cls-26 {
+        fill: #fdfaf5;
+      }
+
+      .cls-27 {
+        fill: #eeedee;
+      }
+
+      .cls-28 {
+        fill: #faf8f5;
+      }
+
+      .cls-9 {
+        fill: #010101;
+      }
+
+      .cls-10 {
+        fill: #fab33d;
+      }
+
+      .cls-11 {
+        fill: #d38b41;
+      }
+
+      .cls-12 {
+        fill: #3782c2;
+      }
+
+      .cls-13 {
+        stroke: #fff;
+      }
+
+      .cls-14 {
+        fill: #65a443;
+      }
+
+      .cls-15 {
+        fill: #e9d5c6;
+      }
+
+      .cls-29 {
+        fill: #c85e29;
+      }
+
+      .cls-17 {
+        fill: #f07a84;
+      }
+
+      .cls-18 {
+        fill: #388aca;
+      }
+    </style>
+  </defs>
+  <g id="Layer_3" data-name="Layer 3">
+    <path class="cls-14" d="M193.66,37.05c.63,24.54,1.25,49.09.94,73.64-.05,4.18-.13,8.45,1.1,12.45,12.09-.12,24.18.44,36.2,1.68,2.87-10.5,1.62-21.62,1.03-32.49-1.44-26.08.96-52.49-3.8-78.18-.35-1.88-.86-3.95-2.47-5-1.13-.74-2.57-.79-3.92-.78-8.85.07-17.67,1.77-25.92,4.95-1.72.66-3.13.89-3.69,2.64s.12,4.61.16,6.42l.37,14.66Z"/>
+    <path class="cls-15" d="M274.09,83.92c-.03,52.84,7.29,39.66-29.16,39.26-25.5,4.72-21.33-49.03-20.76-65.16.76-9.51,1.95-19.13.28-28.52-.15-3.22-3.06-8.56.48-10.53,24.24-12.48,20.06-7.95,43.21-4.76,4.82.46,3.63,2.75,4.06,8.53,1.25,20.34.99,40.81,1.89,61.18Z"/>
+    <path class="cls-11" d="M262.49,124.9c-17.68.47-79.79,2.13-93.15,2.49-2.19,5.73-4,11.6-5.44,17.56"/>
+    <path class="cls-11" d="M160.47,142.91c24.48,2.19,142.75,4.83,179.14,3.67,12.26-.39,73.72-1.34,91.67-2.26-1.87-6.7-3.96-15.81-4.1-22.77-31.09-2.35-62.32-1.52-93.49-.69-24.87.66-49.75,1.33-74.62,1.99"/>
+    <path class="cls-2" d="M368.24,18.29c-.58,33.33.05,66.81,1.64,99.98.05,1.09-.62,2.1-1.65,2.45-6.29,2.08-40.08.42-40.08-.7-.05-30.72-3.46-104.01-.41-107.67.58-.7,1.54-.97,2.42-.75,11.48,2.82,23.59,4.7,35.56,4.19,1.4-.06,2.55,1.09,2.53,2.5Z"/>
+    <path class="cls-5" d="M373.14,120.05c27.42-5.29,26.31,19.56,17.27-57.28-29.5-3.14-18.88-3.11-17.27,57.28Z"/>
+    <path class="cls-22" d="M378.58,73.28c2.67-.13,12.92,2.58,10.59-2.31-2.82-1.6-11.27-2.28-14.14-.77-2.52,1.93,1.76,2.82,3.55,3.08Z"/>
+    <path class="cls-4" d="M328.39,110.27c-.3,2.52-.58,5.29.82,7.42.74,1.12,1.88,1.93,3.12,2.43,2.18.9,4.61.91,6.97.87,4.25-.07,8.49-.27,12.73-.6.98-.08,2.01-.17,2.83-.72,1.37-.92,1.7-2.76,1.89-4.4,2.6-22.96.37-46.16-1.94-69.15-.05-.53-.12-1.09-.42-1.53-.22-.33-.56-.56-.89-.77-6.36-3.89-21.28-.99-21.66.47-1.36,5.22-1.6,16.83-1.45,22.17.19,6.81.14,13.63-.14,20.45-.32,7.81-.94,15.61-1.86,23.37Z"/>
+    <path class="cls-26" d="M360.55,30.96c-7.93-1.37-16.6-2.7-24.11.96,5.04,7.69,37.87,1.4,16.63-2"/>
+    <path class="cls-26" d="M355.42,20.66c-5.78,1.44-14.49-.09-18.91,3.02,5.9,5.19,36.89,1.72,15.63-3.02"/>
+    <path class="cls-18" d="M237.02,113.68c-9.06-9.19-19.3-17.22-30.39-23.82,6.62-8.71,10.39-19.18,15.2-29,6.79-13.84,15.8-26.58,26.58-37.59.22-.22.44-.45.73-.56.89-.36,1.77.48,2.43,1.19,6.53,7.02,17.5,7.57,25.44,12.94.31.21.65.47.72.84.06.32-.09.64-.24.93-6.06,11.75-12.14,23.51-19.31,34.62-5.01,7.76-10.56,15.2-14.8,23.41-2.7,5.24-5.02,10.98-9.66,14.62"/>
+    <path class="cls-12" d="M236.09,109.61c15.63-22.04,27.57-46.38,40.13-70.09,5.59-.95,12.14,8.54,19.79,6.98-12.77,23.06-25.91,45.82-33.25,71.36-5.32,8.55-18.15-8.11-26.67-8.25Z"/>
+    <path class="cls-7" d="M300.18,38.25c-4.73,27.47,1.15,54.99,2.2,82.63,10.16.19,20.33.12,30.49-.21,1.33-34.66-2.44-65.91-.96-100.48.04-1.04-.95-1.79-1.94-1.47-20.9,6.68-32.82-13.84-29.79,19.53Z"/>
+    <path class="cls-1" d="M301.67,30.21l22.41.57c2.02.05,4.24.04,5.8-1.24"/>
+    <path class="cls-22" d="M281.48,54.23c12.85,2.61,2.12-4.42-3.55-4.47-5.12-.47,2.2,3.8,3.55,4.47Z"/>
+    <path class="cls-3" d="M201.5,23.21l11.28-1.61c1.33-.19,2.68-.38,4.01-.21"/>
+    <path class="cls-1" d="M255.59,11.97c-.42,3.96-.85,10.63-.16,14.55"/>
+    <path class="cls-13" d="M337.3,51.58c4.42-.12,8.84-.1,13.26.07"/>
+    <path class="cls-26" d="M327.83,24.32c-7.93-1.37-16.6-2.7-24.11.96,5.04,7.69,37.87,1.4,16.63-2"/>
+    <path class="cls-27" d="M422.67,155.53c3.64-1.33,2.25-7.06-1.58-7.64-52.67-8.06-117.1,1.2-170.1-2.92-.1,0-.2-.02-.29-.03-16.6-2.39-33.32-3.24-38.3,17.31-.05.19,1.66,1.66,1.63,1.86-1.8,15.39,16.44-4.33,33.72-5.22,31.62-1.62,142.23,8.6,174.92-3.36Z"/>
+  </g>
+  <g id="Layer_2" data-name="Layer 2">
+    <path class="cls-10" d="M186.45,71.44c-.1-2.31-.72-4.56-.96-6.86s-.04-4.78,1.33-6.64c1.72-2.34,4.8-3.13,7.63-3.76,8.03-1.8,16.06-3.6,24.09-5.41,3.48-.78,7.57-1.42,10.23.96.33.29.63.64.75,1.06.22.8-.27,1.6-.74,2.29-6.11,9.03-11.39,18.63-15.76,28.62-.93,2.13-2.07,4.52-4.28,5.24.77.97.37,2.39-.07,3.56-3.01,7.96-6.31,15.81-9.87,23.54-.82,1.77-1.66,3.55-2.83,5.11-2.87,3.81-7.75,6.01-12.51,5.64.22-4.8.43-9.73-1.05-14.31-.89-2.75-2.36-5.27-3.84-7.74-1.73-2.89-5.38-6.81-6.04-10.1s2.81-4.35,5.01-5.79c5.15-3.38,9.18-9.02,8.91-15.39Z"/>
+    <path class="cls-10" d="M145.04,179.3c-21.62,9.98-57.57,15.13-80.17-2.43-25.1-19.51-17.78-41.98-19.36-43.36-15.17-13.25-19.58-45.06-16.49-54.92.57-1.83,8.67-4.3,46.88,8,9.44-12.76,18.07-13.4,21-13.08,2.21-19.21,5.93-34.39,14.36-37.1,6.14-1.98,15.95,10.35,31.36,31.36.81,1.1,25.99,7.14,38.65,27.9,11.52,18.88,11.1,40.87-3.75,59.13-8.45,10.38-25.29,21.2-32.47,24.51Z"/>
+    <path class="cls-26" d="M187.68,73.98c.83-2.07,1.67-4.17,3.06-5.91.6-.76,1.3-1.44,2-2.11,1.96-1.91,3.92-3.81,5.88-5.72,1.17-1.14,2.36-2.29,3.8-3.05,3.7-1.95,8.18-.98,12.36-1.18,3.93-.19,7.81-1.49,11.05-3.72.59-.4,1.2-.92,1.27-1.63.06-.69-.45-1.32-1.08-1.6s-1.34-.29-2.03-.25c-3.95.23-7.72,1.7-11.64,2.22-1.93.26-3.89.28-5.83.49-5.07.53-10,2.28-14.27,5.07-.77.5-1.52,1.04-2.13,1.72-1.32,1.48-1.86,3.48-2.35,5.4-1.03,3.98-2.06,8.09-1.5,12.16"/>
+    <ellipse class="cls-22" cx="101.02" cy="126.03" rx="17.38" ry="16.78"/>
+    <ellipse class="cls-22" cx="150.39" cy="96.17" rx="14.56" ry="17.15" transform="translate(-25.8 67.51) rotate(-23.36)"/>
+    <ellipse cx="155.51" cy="93.96" rx="8.75" ry="11.68" transform="translate(-25.03 73.55) rotate(-24.69)"/>
+    <circle class="cls-22" cx="156.8" cy="88.17" r="1.29"/>
+    <ellipse cx="108.47" cy="122.8" rx="9.52" ry="11.65" transform="translate(-41.38 56.54) rotate(-24.69)"/>
+    <circle class="cls-22" cx="111.4" cy="117.41" r="2.65"/>
+    <path class="cls-10" d="M181.09,195.54c4.89,18.56,3.47,39.77,5.49,58.84-18.51,4.48-95.07-7.08-122.92,5.79-1.22-7.39,9.73-23.52,13.95-29.7s11.86-23.19,12.26-30.67c.13-2.35,1.14-9.55,2.65-9.87,12.91-2.76,26.35-1.74,38.88-5.89,23.35-9.14,48.55-23.2,56.29-48.44,4.96-13.35,11.66-26.27,12.33-40.7,1.3-7.83,12.3-7.89,11.61.56,2.04-5.47,8.12-11.96,14.04-7.7,2.41,1.95-1.44,3.74-.99,6.92,1.45-8.16,13.29-6.76,9.78.87,27.72-3.79-12.55,54.06-18.06,62.85-14.55,19.09-32.94,40.67-57.28,46.01"/>
+    <path class="cls-17" d="M142.11,117.9c-5.66,2.52-5,7.08,1.03,8.67,3.6.6,8.85-2.4,8.32-6.59-.45-4.28-6.36-3.05-9.18-2.15l-.18.07Z"/>
+    <path class="cls-6" d="M150.15,124.56c3.2,9.45.83,20.45-10.2,21.81-6.49.8-12.99-2.28-18.41-5.56"/>
+    <path d="M82.81,124.26c.6-3.91,2.44-7.64,5.24-10.44s6.57-4.58,10.51-5.03c6.81-.79,11.58,3.71,15.17,4.92-12.48-3.09-17.24-2.1-22.39,1.89s-5.33,7.95-8.09,15.17c0,0-.75-4.43-.43-6.51Z"/>
+    <path class="cls-9" d="M140.9,83.74c-3.23,2.9-3.45,6.73-5.22,8.82-1.52,1.65-.51.2-.35-1.88.99-12.75,14.46-10.89,17.17-11.07.62-.04.79.81.22,1.05"/>
+    <path class="cls-24" d="M88.2,245.44c6.55,2.43,20.3,5.02,26.01.23.46-.47,3.73-3.12,1.89-3.06-12.66-2.26-20.7-15.24-32.66-19.71-6.44,13.02-11.85,14.83,4.75,22.53Z"/>
+    <path class="cls-24" d="M86.16,214.54c4.82,9.92,32.74,13.25,39.64,4.83,1.58-1.48.34-2.59-1.49-2.67-36.51-5.66-32.05-24.51-38.15-2.32"/>
+    <path class="cls-24" d="M107.67,200.52c6.59-.31,12.99-3.41,18.42-6.97,6.94-8.51-.58-5.62-5.93-3.05-8.75,3.93-19.58-1.8-27.86,2.14-4.08,7.15,10.99,8.58,15.36,7.88Z"/>
+    <path class="cls-24" d="M66.4,157.96c1.7-3.58,3.25-7.22,4.47-11-3.4-.82-6.7,1.36-10.02,2.46-3.72,1.22-13,.64-11.05,4.32,2.43,4.6,6.79,24.92,16.6,4.21Z"/>
+    <path class="cls-24" d="M93.96,160.99c-.66,7.59-8.75,13.51-8.68,21.5,0,.94-.35,1.97-1.42,1.94-30.34-6.63-5.19-19.82,10.09-23.44Z"/>
+    <path class="cls-24" d="M105.34,180.28c3.58-6.57,22.2-14.08,16.09-.82-2.08,8.01-30.06,10.81-16.09.82Z"/>
+    <path class="cls-20" d="M46.23,108.16c.21-1.38.84-2.65,1.26-3.98s.64-2.82.04-4.08c-.42-.88-1.2-1.54-1.97-2.14-1.82-1.42-3.76-2.68-5.8-3.78,6.99-.69,14.14.22,20.74,2.63.94.34,1.99.85,2.23,1.82.14.56-.03,1.16-.28,1.68-.64,1.33-1.76,2.36-2.81,3.4-3.04,2.97-5.77,6.24-8.44,9.55-.57.7-1.02,1.68-2.02,1.48-.69-.14-1.45-1.23-1.81-1.77-.95-1.39-1.4-3.14-1.15-4.81Z"/>
+    <path class="cls-20" d="M104.16,61.74c.93-2.2,1.87-4.4,3.1-6.45,1.14-1.91,2.52-3.66,3.93-5.37.45-.55,1-1.13,1.71-1.15.55,0,1.04.34,1.48.67,4.27,3.21,8.54,6.43,12.81,9.64,2.23,1.68,4.54,3.45,5.73,5.98-4.31-.81-8.77-.84-13.1-.09-2.2.38-4.37.96-6.57,1.32-3.06.49-6.17.55-9.21,1.12-1.34.25-2.4.66-1.88-.99s1.34-3.14,1.99-4.67Z"/>
+    <path class="cls-29" d="M92.88,83.31c2.74,1.82,5.25,4.14,8.41,5.06,1.12.32,2.54.36,3.2-.6.4-.59.37-1.39.09-2.04s-.77-1.19-1.26-1.71c-2.11-2.23-4.39-4.37-7.15-5.7-1.96-.94-7.36-2.52-8.96-.17s4.3,4.24,5.67,5.15Z"/>
+    <path class="cls-29" d="M114.71,79.67c.53.26,1.09.52,1.69.51,1.56,0,2.57-1.88,2.26-3.4s-1.5-2.7-2.7-3.69c-.99-.82-2.04-1.59-3.23-2.08-1.01-.41-2.1-.6-3.18-.79-1.22-.21-4.07-1.32-5.07-.22-.83.91-.11,2.41.55,3.17,2.43,2.77,6.43,4.9,9.69,6.5Z"/>
+    <path class="cls-23" d="M62.6,97.58c-.99-1.69-2.68-2.87-4.42-3.78-5.15-2.72-11.23-3.63-16.94-2.54-1.4.27-2.89.73-3.71,1.89,6.49,1.1,13.01,2.21,19.32,4.07,1.73.51,3.47,1.08,5.27,1.16.32-.95-.51-2.09-1.52-2.07"/>
+    <path class="cls-24" d="M183.86,177.11c14.87,16.24,10.55-14.45-5.12-18.23-.98,5.68,1.64,13.4,5.12,18.23Z"/>
+    <path class="cls-24" d="M194.13,154.52c1.35,4.7,13.57,13.25,14.78,5.01-2.26-4.28-20.23-18.38-14.78-5.01Z"/>
+    <path class="cls-24" d="M199.58,135.98c-.25,7.15,18.68,14.87,20.68,7.1-2.16-2.78-23.35-14.78-19.88-5.07"/>
+    <path class="cls-25" d="M209.51,96.42c.63,1.1,2.09,1.45,3.34,1.24.9-.15-1.24-5.7-2.61-5.99-2.53-.52-1.37,3.61-.73,4.74Z"/>
+    <path class="cls-19" d="M219.78,96.09c.26.87.53,1.74.79,2.6.16.54.33,1.09.65,1.56s.81.85,1.38.89c.09,0,.19,0,.26-.04.13-.08.17-.24.2-.39.38-2-.05-4.07.24-6.08.12-.85.37-1.68.46-2.54s.01-1.77-.47-2.48c-.87-1.28-3.83-2.21-4.61-.45-.83,1.86.56,5.15,1.09,6.92Z"/>
+    <path class="cls-28" d="M237.02,105.09c3.01,3.69,1.63,9.18-.22,13.56-6.62,15.68-17.25,29.27-27.76,42.65-5.75,7.32-11.53,14.67-18.44,20.89-6.27,5.64-13.37,10.26-20.43,14.85,3.36-.34,5.72-3.33,8.49-5.27,2.25-1.58,4.9-2.5,7.26-3.91,3.18-1.9,5.76-4.63,8.3-7.32,7.82-8.29,15.65-16.6,22.92-25.37,1.8-2.17,3.56-4.36,5.19-6.65,3.73-5.25,6.74-10.97,9.74-16.67,4.47-8.5,9.03-17.33,9.68-26.91.15-2.14.02-4.51-1.42-6.11-1.28-1.43-4.43-1.7-5.77-.14-2.04,2.38,1.15,4.78,2.47,6.39Z"/>
+    <path class="cls-21" d="M29.7,89.46c3.21-7.8,32.82,3.77,44.36-1.29-10.08-4.69-30.96-8.36-42.55-9.38"/>
+    <path class="cls-21" d="M77.16,86.07c2.98-2.39,5.96-4.78,8.94-7.16,1.11-.89,2.22-1.78,3.47-2.44,1.92-1.03,4.13-1.49,6.29-1.33-.03,1.18-1.34,1.87-2.49,2.12s-13.35,9.67-16.43,10.64"/>
+    <path class="cls-21" d="M119.65,68.77c4.71-.11,9.42-.23,14.12-.34.1,0,.2,0,.28-.05.33-.17.12-.68-.15-.94-1.23-1.21-2.93-1.86-4.65-2.11s-3.45-.13-5.18,0c-1.81.14-3.61.3-5.42.45-3.9.34-7.81.68-11.6,1.62-2.33.58-4.7,1.45-6.32,3.3,1.08.82,1.99.3,3.1-.13,1.62-.62,3.4-.89,5.11-1.13,3.55-.5,7.13-.59,10.71-.67Z"/>
+    <path class="cls-16" d="M168.05,112.86c4.64-4.5,10.84-7.15,15.38-11.75"/>
+    <path class="cls-16" d="M173.23,117.26c5.89-.85,9.6-7.14,15.31-8.8"/>
+    <path class="cls-16" d="M175.75,121.8c5.67.1,8.3-5.85,13.97-5.75"/>
+    <path class="cls-8" d="M107.76,152.78c-6.64,1.98-13.44,3.44-20.31,4.35"/>
+    <path class="cls-8" d="M111.71,156.45c-5.33,4.96-13.37,6.17-18.59,11.25"/>
+    <path class="cls-8" d="M114.01,162.32c-4.11,3.86-7.87,8.09-11.22,12.63"/>
+    <path class="cls-10" d="M60,260.76c6.75-8.08,5.3-12.37,6.3-22.76-1.23-26.74-23.08-52.14-47.77-60.76-8.34-4.04-14.85-1.28-12.31,8.09,2.71,10.04,14.98,13.97,22.64,19.55,32.51,25.01,12.04,35.93,20.1,55.88h11.04Z"/>
+    <path class="cls-24" d="M48.77,236.25c-.51.02-1.16-.07-1.3-.6-.06-.23,0-.46.07-.69.83-3.15.59-6.61-.68-9.58,5.52.27,10.51-3.37,15.93-4.53.91-.19,2.64,8.61,2.23,9.93-.46,1.49-2.03,2-3.26,2.52-1.96.82-3.98,1.48-6.04,1.96-2.29.54-4.62.87-6.96.99Z"/>
+    <path class="cls-24" d="M36.57,208.43c-.24.2-.48.41-.63.68-.5.94.35,2.02,1.18,2.68,2.08,1.65,4.54,2.81,7.14,3.38,1.5.33,3.15.44,4.5-.28,1.23-.65,2.03-1.87,2.74-3.06,1.21-2.05,2.28-4.18,3.2-6.37.33-.77.63-1.69.2-2.41-.23-.39-.63-.64-1.02-.87-1.25-.73-3.02-1.89-4.49-2.06s-2.98,1.22-4.14,1.95c-3.04,1.92-5.94,4.04-8.68,6.35Z"/>
+    <path class="cls-24" d="M14.99,192.27c-.38.56-.75,1.25-.5,1.87.16.4.53.66.89.89,1.45.91,3.05,1.56,4.64,2.2,1.91.77,4.08,1.54,5.98.73.82-.35,1.5-.98,2.12-1.62,1.86-1.93,3.39-4.18,4.51-6.62,1.76-3.84-.44-6.56-4.58-6.67-3-.08-6.6,2.67-8.77,4.5-1.63,1.38-3.08,2.97-4.28,4.73Z"/>
+  </g>
+</svg>

package/src/components/IconPickerDialog.tsx

@@ -0,0 +1,136 @@
+import { useQuery } from '@tanstack/react-query'
+import { Search } from 'lucide-react'
+import { useState } from 'react'
+import { useTRPC } from '~/api/infra/trpc'
+import { Button } from '~/ui/button'
+import {
+    Dialog,
+    DialogContent,
+    DialogDescription,
+    DialogHeader,
+    DialogTitle,
+} from '~/ui/dialog'
+import { Input } from '~/ui/input'
+import { ScrollArea } from '~/ui/scroll-area'
+
+interface IconPickerDialogProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  onSelect: (iconName: string) => void
+  selectedIconName?: string
+}
+
+export function IconPickerDialog({
+  open,
+  onOpenChange,
+  onSelect,
+  selectedIconName,
+}: IconPickerDialogProps) {
+  const [search, setSearch] = useState('')
+  const trpc = useTRPC()
+
+  const queryOptions = trpc.icon.list.queryOptions()
+  const { data: icons = [], isLoading } = useQuery({
+    ...queryOptions,
+    enabled: open,
+  })
+
+  type IconData = (typeof icons)[number]
+
+  const filteredIcons = icons.filter((icon: IconData) =>
+    icon.name.toLowerCase().includes(search.toLowerCase()),
+  )
+
+  const handleSelect = (iconName: string) => {
+    onSelect(iconName)
+    onOpenChange(false)
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="max-w-3xl max-h-[80vh] flex flex-col">
+        <DialogHeader>
+          <DialogTitle>Select Icon</DialogTitle>
+          <DialogDescription>
+            Search and select an icon from the available icons
+          </DialogDescription>
+        </DialogHeader>
+
+        <div className="relative">
+          <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
+          <Input
+            placeholder="Search icons by name..."
+            value={search}
+            onChange={(e) => setSearch(e.target.value)}
+            className="pl-10"
+          />
+        </div>
+
+        <ScrollArea className="flex-1 pr-4">
+          {isLoading ? (
+            <div className="text-center py-8 text-muted-foreground">Loading icons...</div>
+          ) : filteredIcons.length === 0 ? (
+            <div className="text-center py-8 text-muted-foreground">
+              {search ? `No icons found matching "${search}"` : 'No icons available'}
+            </div>
+          ) : (
+            <div className="grid grid-cols-4 sm:grid-cols-6 md:grid-cols-8 gap-3 pb-4">
+              {filteredIcons.map((icon: IconData) => {
+                const isSelected = icon.name === selectedIconName
+                return (
+                  <button
+                    key={icon.id}
+                    type="button"
+                    onClick={() => handleSelect(icon.name)}
+                    className={`group relative flex flex-col items-center gap-2 p-3 rounded-lg border-2 transition-all hover:border-primary hover:shadow-md ${
+                      isSelected
+                        ? 'border-primary bg-primary/5'
+                        : 'border-border bg-background'
+                    }`}
+                    title={icon.name}
+                  >
+                    <div className="w-12 h-12 flex items-center justify-center">
+                      <img
+                        src={`/api/assets/${icon.id}?w=64`}
+                        alt={icon.name}
+                        className="max-w-full max-h-full object-contain"
+                      />
+                    </div>
+                    <span className="text-xs text-center line-clamp-2 w-full wrap-break-word">
+                      {icon.name}
+                    </span>
+                    {isSelected && (
+                      <div className="absolute top-1 right-1 bg-primary text-primary-foreground rounded-full p-0.5">
+                        <svg
+                          className="w-3 h-3"
+                          fill="none"
+                          strokeLinecap="round"
+                          strokeLinejoin="round"
+                          strokeWidth="2"
+                          viewBox="0 0 24 24"
+                          stroke="currentColor"
+                        >
+                          <path d="M5 13l4 4L19 7" />
+                        </svg>
+                      </div>
+                    )}
+                  </button>
+                )
+              })}
+            </div>
+          )}
+        </ScrollArea>
+
+        <div className="flex justify-between items-center pt-2 border-t">
+          <span className="text-sm text-muted-foreground">
+            {filteredIcons.length} icon{filteredIcons.length !== 1 ? 's' : ''}
+            {search && ` matching "${search}"`}
+          </span>
+          <Button variant="outline" onClick={() => onOpenChange(false)}>
+            Cancel
+          </Button>
+        </div>
+      </DialogContent>
+    </Dialog>
+  )
+}

package/src/components/IconPickerField.tsx

@@ -0,0 +1,88 @@
+import { Image, X } from 'lucide-react'
+import { useState } from 'react'
+import { Button } from '~/ui/button'
+import { Label } from '~/ui/label'
+import { IconPickerDialog } from './IconPickerDialog'
+
+interface IconPickerFieldProps {
+  label?: string
+  value?: string
+  onChange: (iconName: string | undefined) => void
+  placeholder?: string
+  required?: boolean
+}
+
+export function IconPickerField({
+  label = 'Icon',
+  value,
+  onChange,
+  placeholder = 'No icon selected',
+  required = false,
+}: IconPickerFieldProps) {
+  const [dialogOpen, setDialogOpen] = useState(false)
+
+  const handleClear = () => {
+    onChange(undefined)
+  }
+
+  return (
+    <div className="space-y-2">
+      {label && (
+        <Label>
+          {label}
+          {required && <span className="text-destructive ml-1">*</span>}
+        </Label>
+      )}
+
+      <div className="flex items-center gap-2">
+        <Button
+          type="button"
+          variant="outline"
+          onClick={() => setDialogOpen(true)}
+          className="flex-1 justify-start"
+        >
+          {value ? (
+            <div className="flex items-center gap-2">
+              <div className="w-6 h-6 flex items-center justify-center">
+                <img
+                  src={`/api/icons/${value}`}
+                  alt={value}
+                  className="max-w-full max-h-full object-contain"
+                  onError={(e) => {
+                    // Fallback if icon not found
+                    e.currentTarget.style.display = 'none'
+                  }}
+                />
+              </div>
+              <span className="truncate">{value}</span>
+            </div>
+          ) : (
+            <div className="flex items-center gap-2 text-muted-foreground">
+              <Image className="h-4 w-4" />
+              <span>{placeholder}</span>
+            </div>
+          )}
+        </Button>
+
+        {value && (
+          <Button
+            type="button"
+            variant="ghost"
+            size="icon"
+            onClick={handleClear}
+            title="Clear icon"
+          >
+            <X className="h-4 w-4" />
+          </Button>
+        )}
+      </div>
+
+      <IconPickerDialog
+        open={dialogOpen}
+        onOpenChange={setDialogOpen}
+        onSelect={onChange}
+        selectedIconName={value}
+      />
+    </div>
+  )
+}

package/src/components/ThemeSwitcher.tsx

@@ -0,0 +1,22 @@
+'use client'
+
+import { Moon, Sun } from 'lucide-react'
+import { useTheme } from 'next-themes'
+
+import { Button } from '~/ui/button'
+
+export function ThemeSwitcher() {
+  const { setTheme, theme } = useTheme()
+
+  return (
+    <Button
+      variant="outline"
+      size="sm"
+      onClick={() => (theme === 'dark' ? setTheme('light') : setTheme('dark'))}
+    >
+      <Sun className="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
+      <Moon className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
+      <span className="sr-only">Toggle theme</span>
+    </Button>
+  )
+}

package/src/components/theme-provider.tsx

@@ -0,0 +1,8 @@
+'use client'
+
+import { ThemeProvider as NextThemesProvider } from 'next-themes'
+import type { ThemeProviderProps } from 'next-themes'
+
+export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
+  return <NextThemesProvider {...props}>{children}</NextThemesProvider>
+}

package/src/errors/AuthorizationError.ts

@@ -0,0 +1,32 @@
+/**
+ * Custom error class for authorization failures
+ * Stores information about required permissions and provides user-friendly messages
+ */
+export class AuthorizationError extends Error {
+  public readonly requiredRoles?: Array<string>
+  public readonly requiredPermissions?: Array<string>
+  public readonly resource?: string
+
+  constructor(options: {
+    message?: string
+    requiredRoles?: Array<string>
+    requiredPermissions?: Array<string>
+    resource?: string
+  }) {
+    const defaultMessage =
+      options.message || 'You do not have permission to access this resource'
+    super(defaultMessage)
+
+    this.name = 'AuthorizationError'
+    this.requiredRoles = options.requiredRoles
+    this.requiredPermissions = options.requiredPermissions
+    this.resource = options.resource
+  }
+
+  /**
+   * Check if an error is an AuthorizationError
+   */
+  static isAuthorizationError(error: unknown): error is AuthorizationError {
+    return error instanceof AuthorizationError
+  }
+}

package/src/errors/index.ts

@@ -0,0 +1 @@
+export { AuthorizationError } from './AuthorizationError'