fix: improved storybook and docker compose stack

.storybook/main.ts

@@ -1,4 +1,5 @@
 import type { StorybookConfig } from '@storybook/react-vite'
+import { mergeConfig } from 'vite'
 
 const config: StorybookConfig = {
   stories: ['../stories/**/*.mdx', '../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
@@ -12,12 +13,19 @@ const config: StorybookConfig = {
     options: {},
   },
   core: {
-    disableTelemetry: true,
-    enableCrashReports: false,
+    disableTelemetry: true, // 👈 Disables telemetry
+    enableCrashReports: false, // 👈 Appends the crash reports to the telemetry events
   },
   docs: {
     autodocs: 'tag',
   },
+  async viteFinal(config) {
+    return mergeConfig(config, {
+      build: {
+        chunkSizeWarningLimit: 1024,
+      },
+    })
+  },
 }
 
 export default config

.storybook/preview.ts

@@ -3,10 +3,9 @@ import { themes } from '@storybook/theming'
 import '../app/styles.css'
 
 const preview: Preview = {
+  // Optional parameter to center the component in the Canvas.
+  // More info: https://storybook.js.org/docs/configure/story-layout
   parameters: {
-    // Optional parameter to center the component in the Canvas.
-    // More info: https://storybook.js.org/docs/configure/story-layout
-    layout: 'centered',
     controls: {
       matchers: {
         color: /(background|color)$/i,

docker-compose.yml

@@ -1,67 +1,55 @@
 # yaml-language-server: $schema=https://raw.githubusercontent.com/compose-spec/compose-spec/master/schema/compose-spec.json
 
-version: '3.8'
-
 services:
   pgsql:
     image: postgres:16-alpine
     container_name: remix_pgsql
     hostname: postgres
+    restart: unless-stopped
     ports:
       - 5432:5432
     volumes:
-      - pg_data:/var/lib/postgresql/data
-      # Optional: only use when using custom query for preparation
-      # - ./initialize.sql:/docker-entrypoint-initdb.d/initialize.sql
+      - pgsql_data:/var/lib/postgresql/data
+      - ./scripts/pgsql-multidb.sh:/docker-entrypoint-initdb.d/multidb.sh
     environment:
       POSTGRES_USER: postgres
       POSTGRES_PASSWORD: securedb
-      POSTGRES_DB: remixdb
+      POSTGRES_MULTIPLE_DATABASES: remixdb,extradb
+    command: ['postgres', '-c', 'wal_level=logical']
     healthcheck:
       test: ['CMD-SHELL', 'pg_isready -U postgres -d remixdb']
       interval: 30s
       timeout: 20s
       retries: 3
 
-  # keydb:
-  #   # drop-in replacement for Redis
-  #   image: eqalpha/keydb:latest
-  #   container_name: remix_keydb
-  #   restart: always
-  #   ports:
-  #     - '6379:6379'
-  #   volumes:
-  #     - 'keydb_data:/data'
-  #   command: 'keydb-server /etc/keydb/redis.conf --server-threads 2'
-
   pgweb:
-    image: ghcr.io/sosedoff/pgweb:latest
+    image: sosedoff/pgweb:latest
     container_name: remix_pgweb
     restart: always
     ports:
-      - '54321:8081'
+      - 54321:8081
     environment:
-      PGWEB_DATABASE_URL: 'postgres://postgres:postgres@pgsql:5432/remixdb?sslmode=disable'
+      PGWEB_DATABASE_URL: 'postgres://postgres:securedb@pgsql:5432/remixdb?sslmode=disable'
     depends_on:
-      - pgsql
+      pgsql:
+        condition: service_started
 
   mailpit:
-    image: axllent/mailpit:v1.10
+    image: axllent/mailpit:latest
     container_name: remix_mailpit
     restart: unless-stopped
     volumes:
       - mailpit_data:/data
     ports:
-      - '1025:1025' # port the SMTP server should be accessible on
-      - '8025:8025' # port the web interface should be accessible on
+      - 1025:1025 # port the SMTP server should be accessible on
+      - 8025:8025 # port the web interface should be accessible on
     environment:
       # https://github.com/axllent/mailpit/wiki/Runtime-options
-      TZ: 'Asia/Jakarta'
+      # MP_UI_AUTH: 'user1:password1 user2:password2'
+      TZ: Asia/Jakarta
 
 volumes:
-  pg_data:
+  pgsql_data:
     driver: local
-  # keydb_data:
-  #   driver: local
   mailpit_data:
     driver: local

package.json

@@ -17,7 +17,7 @@
         "dev:remix": "remix vite:dev",
         "dev:storybook": "storybook dev -p 6006 --no-open",
         "dev": "pnpm run --reporter-hide-prefix --color --parallel \"/dev:(?!storybook)/\"",
-        "build:storybook": "storybook build -o storybook-static",
+        "build:storybook": "VITE_CJS_IGNORE_WARNING=true storybook build -o storybook-static",
         "start": "remix-serve ./build/server/index.js",
         "preview": "dotenv -e .env -- remix-serve ./build/server/index.js",
         "docker:build": "docker build -f Dockerfile . -t $npm_package_name:latest -t $npm_package_name:$npm_package_version",
@@ -93,13 +93,13 @@
         "happy-dom": "^15.7.3",
         "npm-check-updates": "^17.1.1",
         "playwright": "^1.46.1",
-        "postcss": "^8.4.44",
+        "postcss": "^8.4.45",
         "rollup-plugin-visualizer": "^5.12.0",
-        "storybook": "8.2.9",
+        "storybook": "^8.2.9",
         "tailwind-debug-breakpoints": "^1.0.3",
         "tailwindcss-animate": "^1.0.7",
         "tailwindcss": "^3.4.10",
-        "typescript": "^5.1.6",
+        "typescript": "^5.5.4",
         "vite-tsconfig-paths": "^5.0.1",
         "vite": "^5.4.3",
         "vitest": "^2.0.5"