diff --git a/.env.example b/.env.example
index f01d9ca6..9f4b06d1 100644
--- a/.env.example
+++ b/.env.example
@@ -1,221 +1,20 @@
-# || 🔥 [Important note]: Please note that currently, v1.3.0-canary.7 requires specifying Clerk, as its API has changed.
-# || We are working on making Clerk optional again. However, all other environment variables are optional.
-# || If this statement is incorrect, meaning something is broken somewhere, please let us know.
-# || https://github.com/blefnk/relivator-nextjs-template
+# PLEASE SET ALL THESE VARIABLES
+# https://docs.reliverse.org/env
 
-# ====================================================
-# GENERAL
-# ====================================================
-
-# || You can try our brand-new linting script: `pnpm lint:env` or `pnpm appts:env`.
-# || These commands will check the correctness of your .env and .env.example files.
-
-# Specify the website domain in production
 NEXT_PUBLIC_APP_URL="http://localhost:3000"
-
-# ====================================================
-# DATABASE
-# ====================================================
-
-# || When the following connection string is set, you can run "pnpm db:push" to create/update the database tables.
-# || If you've just created the database, please give your provider a moment for the database to be fully created.
-
-# Type here any word, e.g. your project name, you want to prepend to your database table names
-NEXT_PUBLIC_DATABASE_PREFIX="relivator"
-
-# Database (https://neon.tech) (it's recommended to check 'Pooled connection' to get the production URL)
 DATABASE_URL=""
 
-# || DATABASE URL EXAMPLES (pg: try 'postgres://' if 'postgresql://' does not work)
-# || ---------------------------------------------------------------
-# || - Postgres  ➞  Neon (recommended for most users) ➞ postgresql://database_owner:password@hostname/database?sslmode=require
-# || - Postgres  ➞  Private (not tested yet with latest Relivator version) ➞ postgresql://username:password@127.0.0.1:5432/db
-# || - Postgres  ➞  Railway (not tested yet with latest Relivator version) ➞ postgresql://root:password@hostname:36906/railway
-# || ---------------------------------------------------------------
-
-# || We are using Drizzle and Neon as default database provider
-# || https://orm.drizzle.team/learn/tutorials/drizzle-with-neon
-
-# || NOTE: NEXT_PUBLIC_DB_PROVIDER was removed in Relivator 1.2.6
-# || To switch the provider from Neon, modify drizzle.config.ts
-# || To use MySQL or LibSQL providers, update files inside src/db.
-# || Automatic switcher coming in Relivator 1.3.x version.
-
-# ====================================================
-# AUTHENTICATION
-# ====================================================
-
-# || Fake session data will be assigned to your users
-# || if DATABASE_URL or Clerk api keys are not set.
-
-# Required for both "authjs" and "clerk" authProviders.
-# https://authjs.dev/guides/environment-variables
-# Recommended (bash): openssl rand -base64 33
-# Or try this: pnpm dlx randomstring length=44
-AUTH_SECRET="EnsureUseSomethingRandomHere44CharactersLong"
-
-# Required if you choose "authjs" as your authentication provider.
-# Discord: https://discord.com/developers/applications
-AUTH_DISCORD_SECRET=""
-AUTH_DISCORD_ID=""
-# GitHub: https://github.com/settings/developers
-AUTH_GITHUB_SECRET=""
-AUTH_GITHUB_ID=""
-# Google: https://console.cloud.google.com/apis/credentials
-AUTH_GOOGLE_SECRET=""
-AUTH_GOOGLE_ID=""
-
-# Required if you choose "clerk" as your authentication provider.
-# Obtain keys from: https://dashboard.clerk.com/last-active?path=api-keys
-# Ensure the domain is connected in production (for PageSpeed Insights).
 NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=""
 CLERK_SECRET_KEY=""
-NEXT_PUBLIC_CLERK_SIGN_IN_URL="/signin"
-NEXT_PUBLIC_CLERK_SIGN_UP_URL="/signup"
-# Additional optional feature, to enable visit:
-# Clerk Dashboard > [app] > Organizations Settings
-NEXT_PUBLIC_ORGANIZATIONS_ENABLED="false"
-
-# || NOTE: NEXT_PUBLIC_AUTH_PROVIDER was removed in Relivator 1.2.6.
-# || To switch the provider from Neon, modify `reliverse.config.ts`.
-# || Automatic switcher coming in the release of Relivator v1.3.0 GA.
-
-# || Auth.js Guide: https://nextjs.org/learn/dashboard-app/adding-authentication
-# || Clerk Guide: https://clerk.com/docs/quickstarts/nextjs
+CLERK_ENCRYPTION_KEY=""
 
-# ====================================================
-# PAYMENT SYSTEM
-# ====================================================
-
-# || Fake store data will be generated if DATABASE_URL
-# || and STRIPE_WEBHOOK_SIGNING_SECRET are not set.
-
-# For API keys: https://dashboard.stripe.com/test/apikeys
 NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=""
-STRIPE_SECRET_KEY=""
 STRIPE_API_KEY=""
-
-# Please read the instructions at the end of the file.
-STRIPE_WEBHOOK_SIGNING_SECRET=""
 STRIPE_WEBHOOK_SECRET=""
-
-# For product setup: https://dashboard.stripe.com/test/products
-STRIPE_PROFESSIONAL_SUBSCRIPTION_PRICE_ID=""
-STRIPE_ENTERPRISE_SUBSCRIPTION_PRICE_ID=""
-# Stripe Product and Price IDs for your created products
-# found at https://dashboard.stripe.com/test/products
-STRIPE_STD_MONTHLY_PRICE_ID=""
 STRIPE_PRO_MONTHLY_PRICE_ID=""
 
-# ====================================================
-# RELIVERSE ADDONS
-# ====================================================
-
-# || Currently, "next dev --turbo" does not read the .env file after launch.
-# || So, you need to close the application using Cmd/Ctrl+C and run it again.
-
-# Set to true if you want to enable addons/scripts/reliverse/relimter/python/index.ts
-# Note: addons/scripts/reliverse/relimter/python/index.ts is a more stable version.
-PYTHON_INSTALLED="false"
-
-# Set to true if you want to enable addons/scripts/reliverse/toolbar/index.ts toolbar
-# https://vercel.com/docs/workflow-collaboration/vercel-toolbar
-ENABLE_VERCEL_TOOLBAR="false"
-ENABLE_VT_ON_PRODUCTION="false"
-
-# ENABLE_VERCEL_TOOLBAR must be enabled to enable the following
-# https://vercel.com/docs/workflow-collaboration/feature-flags
-ENABLE_FEATURE_FLAGS="false"
-# node -e "console.log(crypto.randomBytes(32).toString('base64url'))"
-FLAGS_SECRET=""
-
-# Remotion GitHub Personal Access Token
-# Obtain from: https://github.com/settings/personal-access-tokens/new
-REMOTION_GITHUB_TOKEN=""
-
-# ====================================================
-# MEDIA UPLOAD
-# ====================================================
-
-# || Uploadthing is free, but redirects you to Stripe
-# || after signing up, so you can just close the tab.
-
-# Image Upload Configuration
-# https://uploadthing.com (Dashboard > [App] > API Keys)
+UPLOADTHING_TOKEN=""
 UPLOADTHING_SECRET=""
-UPLOADTHING_APP_ID=""
-
-# ====================================================
-# EMAIL SYSTEM
-# ====================================================
 
-# || The email system is already partially integrated into Relivator 1.2.6. It will
-# || be fully functional starting from Relivator 1.3.0. Contributions are welcome!
-
-# Email System Configuration
-# Get API keys: https://resend.com
-NEXT_PUBLIC_RESEND_API_KEY=""
-# Set email: https://resend.com/domains or use Resend's test email
-NEXT_PUBLIC_RESEND_EMAIL_FROM="onboarding@resend.dev"
-# We need to register a domain with Resend to send emails from
-# Register a domain at https://resend.com/domains
-# Or we can use this email provided by resend for only testing: "onboarding@resend.dev"
+RESEND_API_KEY=""
 EMAIL_FROM_ADDRESS="onboarding@resend.dev"
-
-# https://novu.co
-NOVU_SECRET_KEY=""
-# https://your-live-domain.com/api/novu
-NOVU_BRIDGE_URL=""
-
-# ====================================================
-# ADDITIONAL
-# ====================================================
-
-# || Never share or commit the .env file. It has been added to .gitignore.
-# || When adding new variables, update the schema in the /src/env.js file.
-
-# upstash
-# https://YOUR_UPSTASH_REDIS_REST_URL
-UPSTASH_REDIS_REST_URL=""
-# •••••••••••••
-UPSTASH_REDIS_REST_TOKEN=""
-
-# Loglib Analytics (https://loglib.io)
-LOGLIB_ID=""
-
-# Discord Server Notifications Integration
-# Open your server settings > Integrations > New Webhook > obtain the URL.
-DISCORD_WEBHOOK_URL=""
-
-# Do not enable it, it's used exclusively by https://relivator.com
-DEMO_NOTES_ENABLED="false"
-
-# ====================================================
-# STRIPE INSTRUCTIONS
-# ====================================================
-
-# Ensure that you have the required configuration
-# set up before following the instructions below:
-# - DATABASE_URL
-# - STRIPE_SECRET_KEY
-# - NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY
-
-# [STRIPE WEBHOOK FOR DEVELOPMENT]
-# 1. Install Stripe CLI: https://stripe.com/docs/stripe-cli#install
-# 2. Create webhook: https://dashboard.stripe.com/test/webhooks/create?endpoint_location=local
-# 3. Open 3 terminals:
-#    - Terminal 1: "pnpm dev"
-#    - Terminal 2: "stripe login"
-#    - Terminal 3: "pnpm dev:stripe" or "pnpm stripe:listen"
-# 4. Copy the signing secret from the terminal and paste it into STRIPE_WEBHOOK_SIGNING_SECRET.
-# 5. Run "stripe trigger payment_intent.succeeded", wait for it to complete, then click Done.
-# Keep "pnpm dev:stripe" or "pnpm stripe:listen" enabled when testing Stripe on localhost.
-# Test data: 4242424242424242 | 12/34 | 567
-
-# [STRIPE WEBHOOK FOR PRODUCTION]
-# 1. Create webhook: https://dashboard.stripe.com/test/webhooks/create?endpoint_location=hosted
-# 2. Endpoint: https://use-the-domain-here.com/api/webhooks/stripe
-# 3. Select all events and add the endpoint.
-# 4. Ensure "Latest API version" is selected.
-# 5. Reveal the signing secret.
-# Note: You will get the test-mode production signing key. Switch to live-mode for the real key.
diff --git a/.github/workflows/NOVU.txt b/.github/workflows/NOVU.txt
deleted file mode 100644
index 539fee82..00000000
--- a/.github/workflows/NOVU.txt
+++ /dev/null
@@ -1,27 +0,0 @@
-name: Novu Sync
-
-on:
-  workflow_dispatch:
-
-jobs:
-  deploy:
-    runs-on: ubuntu-latest
-    steps:
-      # https://github.com/novuhq/actions-novu-sync
-      - name: Sync State to Novu
-        uses: novuhq/actions-novu-sync@v2
-        with:
-          # The secret key used to authenticate with Novu Cloud
-          # To get the secret key, go to https://web.novu.co/api-keys.
-          # Required.
-          secret-key: ${{ secrets.NOVU_SECRET_KEY }}
-
-          # The publicly available endpoint hosting the bridge application
-          # where notification entities (eg. workflows, topics) are defined.
-          # Required.
-          bridge-url: ${{ secrets.NOVU_BRIDGE_URL }}
-
-          # The Novu Cloud API URL to sync with.
-          # Optional.
-          # Defaults to https://api.novu.co
-          api-url: https://api.novu.co
diff --git a/.github/workflows/RELIVERSE.txt b/.github/workflows/RELIVERSE.txt
deleted file mode 100644
index b017d7ae..00000000
--- a/.github/workflows/RELIVERSE.txt
+++ /dev/null
@@ -1,21 +0,0 @@
-name: Reliverse Standard
-on:
-  push: null
-jobs:
-  build:
-    runs-on: ubuntu-22.04
-    strategy:
-      matrix:
-        node-version:
-          - 20
-    steps:
-      - uses: actions/checkout@v4
-      - name: Install pnpm
-        uses: pnpm/action-setup@v4
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v4
-        with:
-          node-version: ${{ matrix.node-version }}
-          cache: pnpm
-      - name: Install dependencies
-        run: pnpm install --no-frozen-lockfile
diff --git a/.github/workflows/STARGAZERS.txt b/.github/workflows/STARGAZERS.txt
deleted file mode 100644
index c436f380..00000000
--- a/.github/workflows/STARGAZERS.txt
+++ /dev/null
@@ -1,58 +0,0 @@
-name: Stargazers
-on:
-  workflow_dispatch:
-    inputs:
-      repoOrg:
-        description: Repo Org
-        required: true
-        default: blefnk
-      repoName:
-        description: Repo Name
-        required: true
-        default: relivator-nextjs-template
-      starCount:
-        description: Star Count
-        required: true
-        default: "900"
-      duration:
-        description: Duration (seconds)
-        required: false
-        default: "15"
-jobs:
-  render:
-    name: Stargazers
-    runs-on: ubuntu-22.04
-    strategy:
-      matrix:
-        node-version:
-          - 20
-    steps:
-      - name: Run checkout
-        uses: actions/checkout@v4
-      - name: Install pnpm
-        uses: pnpm/action-setup@v4
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v4
-        with:
-          node-version: ${{ matrix.node-version }}
-          cache: pnpm
-      - name: Install Fallback fonts (fonts)
-        run: |
-          sudo apt-get update -yqq
-          sudo apt-get install -yq --no-install-recommends \
-            fonts-noto-core fonts-noto-cjk fonts-noto-color-emoji fonts-noto-mono
-      - name: Install dependencies from package.json
-        run: pnpm install --no-frozen-lockfile
-      - name: Define input props
-        run: echo $WORKFLOW_INPUT | tee input-props.json | jq -C '.'
-        env:
-          WORKFLOW_INPUT: ${{ toJson(github.event.inputs) }}
-      - name: Stargazers
-        run: pnpm stargazers:build -- --props="./input-props.json"
-        env:
-          REMOTION_GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-      - name: Upload video
-        uses: actions/upload-artifact@v3
-        with:
-          name: stargazers.mp4
-          path: public/internal/stargazers.mp4
diff --git a/.gitignore b/.gitignore
index e80a8be5..aa290d86 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,104 +1,13 @@
-node_modules/
-jspm_packages/
-bower_components/
-web_modules/
-.pnp
-.pnp.js
-build/
-dist/
-out/
-.next/
-next-env.d.ts
-.nuxt/
-.gatsby/
-target/
-logs/
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-lerna-debug.log*
-.pnpm-debug.log*
-pids/
-*.pid
-*.seed
-*.pid.lock
-lib-cov/
-coverage/
-*.lcov
-.nyc_output/
-.grunt/
-.lock-wscript
-build/Release/
-*.tsbuildinfo
-*.d.ts.map
-.npm/
-.npm/_locks
-.stylelintcache
-.rpt2_cache/
-.rts2_cache_cjs/
-.rts2_cache_es/
-.rts2_cache_umd/
-.node_repl_history
-*.tgz
-.yarn/
-.yarn/cache/
-.yarn/unplugged/
-.yarn/build-state.yml
-.yarn/install-state.gz
-.pnp.*
-.yarn-integrity
-.env
-.env.local
-__.env
-.__.env
-.cache/
-.parcel-cache/
-.expo/
-dist/
-expo-env.d.ts
-apps/expo/.gitignore
-.docusaurus/
-.serverless/
-.fusebox/
-.dynamodb/
-.tern-port/
-.turbo/
-.vercel/
-report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
-.idea/
+# https://help.github.com/articles/ignoring-files
+
+/node_modules
+/.next/
+/.venv/
 .DS_Store
-*.exe
-*.dll
-*.so
-*.dylib
-*.bin
-*.tmp
-*.temp
-*.bak
-*.old
-*.orig
-*.swp
-*.pem
-*.swc
-__pycache__/
-*.py[oc]
-*.egg-info/
-.now/
-.venv/
-.ruff_cache/
-.wheels/
-*.sublime-project
-*.sublime-workspace
-*.idea/
-.eslintcache
-.vscode-test/
-addons/.output/
-addons/premium/
-yarn-error.log/
-path_mapping.txt
-coverage/
-.million/
+*.log*
+.env*
 .vercel
-.env*.local
-.unlighthouse
+*.tsbuildinfo
+next-env.d.ts
+.eslintcache
+.idea
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
index 65d46c9a..649b36b9 100644
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@@ -1,23 +1,10 @@
 {
   "recommendations": [
-    "aaron-bond.better-comments",
-    "astro-build.houston",
-    "biomejs.biome",
     "bradlc.vscode-tailwindcss",
-    "charliermarsh.ruff",
-    "chunsen.bracket-select",
-    "davidanson.vscode-markdownlint",
+    "biomejs.biome",
+    "usernamehw.errorlens",
     "dbaeumer.vscode-eslint",
-    "fabiospampinato.vscode-open-multiple-files",
-    "github.github-vscode-theme",
     "lokalise.i18n-ally",
-    "mikekscholz.pop-icon-theme",
-    "ms-python.python",
-    "neptunedesign.vs-sequential-number",
-    "streetsidesoftware.code-spell-checker",
-    "unifiedjs.vscode-mdx",
-    "usernamehw.errorlens",
-    "usernamehw.remove-empty-lines",
-    "yzhang.markdown-all-in-one"
+    "fabiospampinato.vscode-open-multiple-files"
   ]
 }
diff --git a/.vscode/launch.json b/.vscode/launch.json
deleted file mode 100644
index 6acd8335..00000000
--- a/.vscode/launch.json
+++ /dev/null
@@ -1,74 +0,0 @@
-{
-  "compounds": [
-    {
-      "configurations": ["Launch Next.js"],
-      "name": "Launch Next.js"
-    },
-    {
-      "configurations": ["Launch Next.js", "Launch Next.js in Chrome"],
-      "name": "Launch Next.js and Chrome"
-    }
-  ],
-  "configurations": [
-    {
-      "name": "Attach by Process ID",
-      "processId": "${command:PickProcess}",
-      "request": "attach",
-      "restart": true,
-      "type": "node"
-    },
-    {
-      "console": "internalConsole",
-      "env": {
-        "NODE_OPTIONS": "--inspect"
-      },
-      "name": "Launch Next.js",
-      "program": "${workspaceFolder}/node_modules/next/dist/bin/next",
-      "request": "launch",
-      "sourceMaps": true,
-      "trace": true,
-      "type": "node"
-    },
-    {
-      "name": "Launch Next.js in Chrome",
-      "request": "launch",
-      "type": "chrome",
-      "url": "http://localhost:3000",
-      "webRoot": "${workspaceFolder}"
-    },
-    {
-      "args": ["--runInBand"],
-      "envFile": "${workspaceFolder}/.env",
-      "name": "Launch All Jest Tests",
-      "program": "${workspaceFolder}/node_modules/jest/bin/jest",
-      "request": "launch",
-      "type": "node"
-    },
-    {
-      "args": ["${relativeFile}"],
-      "console": "internalConsole",
-      "internalConsoleOptions": "openOnSessionStart",
-      "name": "Launch Current Jest Test",
-      "program": "${workspaceFolder}/node_modules/jest/bin/jest",
-      "request": "launch",
-      "type": "node"
-    },
-    {
-      "console": "integratedTerminal",
-      "env": {
-        "NODE_OPTIONS": "--loader=tsx"
-      },
-      "name": "Launch Ava Test (experimental)",
-      "outputCapture": "std",
-      "program": "${workspaceFolder}/node_modules/ava/entrypoints/cli.js",
-      "request": "launch",
-      "runtimeArgs": ["${file}", "--break", "debug"],
-      "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/ava",
-      "runtimeVersion": "20.10.0",
-      "skipFiles": ["<node_internals>/**/*.js"],
-      "type": "node"
-    }
-  ],
-  "type": "commonjs",
-  "version": "0.2.0"
-}
diff --git a/.vscode/settings.json b/.vscode/settings.json
index acce712f..14eae4b4 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,454 +1,28 @@
 {
-  "[appts.reliverse]": {
-    "vscodePreset": "default"
-  },
-  "[css]": {
-    "editor.defaultFormatter": "vscode.css-language-features"
-  },
-  "[html]": {
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[javascript]": {
-    "editor.defaultFormatter": "biomejs.biome"
-  },
-  "[javascriptreact]": {
-    "editor.defaultFormatter": "biomejs.biome"
-  },
-  "[json]": {
-    "editor.defaultFormatter": "biomejs.biome"
-  },
-  "[json5]": {
-    "editor.defaultFormatter": "biomejs.biome"
-  },
-  "[jsonc]": {
-    "editor.defaultFormatter": "biomejs.biome"
-  },
-  "[markdown]": {
-    "editor.defaultFormatter": "DavidAnson.vscode-markdownlint"
-  },
-  "[mdx]": {
-    "editor.wordWrap": "on"
-  },
-  "[python]": {
-    "editor.codeActionsOnSave": {
-      "source.fixAll": "explicit",
-      "source.organizeImports": "explicit"
-    },
-    "editor.defaultFormatter": "charliermarsh.ruff",
-    "editor.formatOnSave": true
-  },
-  "[typescript]": {
-    "editor.defaultFormatter": "biomejs.biome"
-  },
-  "[typescriptreact]": {
-    "editor.defaultFormatter": "biomejs.biome"
-  },
-  "[yaml]": {
-    "editor.defaultFormatter": "redhat.vscode-yaml"
-  },
-  "biome.enabled": true,
-  "breadcrumbs.enabled": true,
-  "cSpell.enabled": true,
-  "cSpell.userWords": [
-    "Menlo",
-    "Monaspace",
-    "astro",
-    "biomejs",
-    "dotjs",
-    "mjml",
-    "pwsh",
-    "quickfix",
-    "rgba",
-    "tson"
-  ],
-  "cSpell.words": ["callout", "combobox", "reliverse", "utapi"],
-  "css.lint.important": "ignore",
-  "css.lint.unknownAtRules": "ignore",
-  "debug.toolBarLocation": "docked",
-  "diffEditor.experimental.showMoves": true,
-  "diffEditor.hideUnchangedRegions.enabled": true,
-  "editor.acceptSuggestionOnCommitCharacter": true,
-  "editor.acceptSuggestionOnEnter": "on",
-  "editor.bracketPairColorization.enabled": true,
-  "editor.bracketPairColorization.independentColorPoolPerBracketType": true,
+  "workbench.activityBar.orientation": "vertical",
+  "editor.formatOnSave": true,
   "editor.codeActionsOnSave": {
     "quickfix.biome": "explicit",
     "source.addMissingImports": "never",
-    "source.fixAll": "never",
     "source.fixAll.eslint": "explicit",
     "source.organizeImports": "never",
-    "source.organizeImports.biome": "never",
     "source.removeUnused": "never"
   },
-  "editor.colorDecorators": true,
-  "editor.cursorBlinking": "phase",
-  "editor.cursorSmoothCaretAnimation": "on",
-  "editor.cursorStyle": "line",
-  "editor.defaultFormatter": "biomejs.biome",
-  "editor.detectIndentation": false,
-  "editor.formatOnPaste": false,
-  "editor.formatOnSave": true,
-  "editor.formatOnSaveMode": "file",
-  "editor.formatOnType": false,
-  "editor.guides.bracketPairs": true,
-  "editor.guides.indentation": false,
-  "editor.hideCursorInOverviewRuler": false,
-  "editor.inlayHints.enabled": "offUnlessPressed",
-  "editor.inlineSuggest.enabled": true,
-  "editor.inlineSuggest.showToolbar": "always",
-  "editor.insertSpaces": true,
-  "editor.linkedEditing": true,
-  "editor.minimap.autohide": false,
-  "editor.minimap.enabled": true,
-  "editor.minimap.renderCharacters": false,
-  "editor.multiCursorModifier": "alt",
-  "editor.parameterHints.enabled": true,
-  "editor.quickSuggestions": {
-    "comments": true,
-    "other": true,
-    "strings": true
-  },
-  "editor.quickSuggestionsDelay": 10,
-  "editor.rulers": [54, 74, 119],
-  "editor.smoothScrolling": true,
-  "editor.snippets.codeActions.enabled": true,
-  "editor.stickyScroll.enabled": true,
-  "editor.suggest.insertMode": "insert",
-  "editor.suggest.localityBonus": true,
-  "editor.suggestOnTriggerCharacters": true,
-  "editor.suggestSelection": "first",
-  "editor.tabCompletion": "off",
-  "editor.tabSize": 2,
-  "editor.tokenColorCustomizations": {
-    "comments": "#746f68"
-  },
-  "editor.unicodeHighlight.allowedCharacters": {
-    "a": true,
-    "І": true,
-    "А": true,
-    "В": true,
-    "Е": true,
-    "З": true,
-    "Н": true,
-    "О": true,
-    "Р": true,
-    "С": true,
-    "Т": true,
-    "У": true,
-    "а": true,
-    "б": true,
-    "г": true,
-    "е": true,
-    "з": true,
-    "н": true,
-    "о": true,
-    "р": true,
-    "с": true,
-    "у": true,
-    "і": true,
-    "ا": true,
-    "ه": true,
-    "–": true
-  },
-  "editor.unicodeHighlight.allowedLocales": {
-    "tr": true
-  },
-  "editor.wordBasedSuggestions": "currentDocument",
-  "eslint.codeActionsOnSave.mode": "problems",
-  "eslint.enable": true,
-  "eslint.format.enable": true,
-  "eslint.ignoreUntitled": true,
-  "eslint.lintTask.enable": true,
-  "eslint.lintTask.options": ".",
-  "eslint.probe": [
-    "MDX",
-    "astro",
-    "github-actions-workflow",
-    "html",
-    "javascript",
-    "javascriptreact",
-    "json",
-    "json5",
-    "jsonc",
-    "markdown",
-    "toml",
-    "typescript",
-    "typescriptreact",
-    "yaml"
-  ],
   "eslint.rules.customizations": [
     {
-      "rule": "@stylistic/*",
-      "severity": "off"
-    },
-    {
-      "rule": "perfectionist/*",
-      "severity": "off"
-    },
-    {
-      "rule": "@typescript-eslint/consistent-type-imports",
-      "severity": "info"
-    },
-    {
-      "rule": "import-x/newline-after-import",
-      "severity": "info"
-    },
-    {
-      "rule": "readable-tailwind/*",
-      "severity": "info"
-    },
-    {
-      "rule": "curly",
-      "severity": "info"
-    },
-    {
-      "rule": "no-lonely-if",
-      "severity": "info"
-    },
-    {
-      "rule": "@stylistic/linebreak-style",
-      "severity": "info"
-    },
-    {
-      "rule": "jsonc/indent",
-      "severity": "info"
-    },
-    {
-      "rule": "RULES-BELOW-ARE-NOT-AUTOFIXABLE",
+      "rule": "perfectionist/sort-imports",
       "severity": "warn"
-    },
-    {
-      "rule": "@typescript-eslint/no-unused-vars",
-      "severity": "warn"
-    },
-    {
-      "rule": "@stylistic/no-tabs",
-      "severity": "error"
-    },
-    {
-      "rule": "@stylistic/no-mixed-spaces-and-tabs",
-      "severity": "error"
-    },
-    {
-      "rule": "@stylistic/no-mixed-operators",
-      "severity": "error"
-    },
-    {
-      "rule": "@stylistic/max-statements-per-line",
-      "severity": "error"
-    },
-    {
-      "rule": "@stylistic/max-len",
-      "severity": "error"
-    },
-    {
-      "rule": "@stylistic/line-comment-position",
-      "severity": "error"
-    },
-    {
-      "rule": "@stylistic/jsx-pascal-case",
-      "severity": "error"
-    },
-    {
-      "rule": "@stylistic/jsx-child-element-spacing",
-      "severity": "error"
     }
   ],
-  "eslint.timeBudget.onFixes": {
-    "error": 25000,
-    "warn": 25000
-  },
-  "eslint.timeBudget.onValidation": {
-    "error": 25000,
-    "warn": 25000
-  },
-  "eslint.validate": [
-    "MDX",
-    "astro",
-    "github-actions-workflow",
-    "html",
-    "javascript",
-    "javascriptreact",
-    "json",
-    "json5",
-    "jsonc",
-    "markdown",
-    "toml",
-    "typescript",
-    "typescriptreact",
-    "yaml"
-  ],
-  "extensions.ignoreRecommendations": false,
-  "files.associations": {
-    "*.json": "json",
-    "*.mdx": "mdx",
-    "*.toml": "properties",
-    "*.txt": "plaintext",
-    ".env.example": "properties"
-  },
-  "files.eol": "\n",
-  "files.insertFinalNewline": true,
-  "files.trimTrailingWhitespace": true,
-  "git.autofetch": true,
-  "git.confirmSync": false,
-  "git.enableSmartCommit": true,
-  "git.openRepositoryInParentFolders": "never",
-  "html.format.indentInnerHtml": true,
-  "i18n-ally.displayLanguage": "en-US",
-  "i18n-ally.enabledFrameworks": ["general", "next-intl", "react"],
-  "i18n-ally.keysInUse": [
-    "Manifest.name",
-    "faq.1.details",
-    "faq.1.summary",
-    "faq.2.details",
-    "faq.2.summary",
-    "faq.3.details",
-    "faq.3.summary",
-    "name"
-  ],
-  "i18n-ally.keystyle": "nested",
-  "i18n-ally.localesPaths": ["messages"],
-  "i18n-ally.sourceLanguage": "en-US",
-  "javascript.format.semicolons": "insert",
-  "javascript.inlayHints.enumMemberValues.enabled": true,
-  "javascript.inlayHints.functionLikeReturnTypes.enabled": true,
-  "javascript.inlayHints.parameterNames.enabled": "all",
-  "javascript.inlayHints.parameterTypes.enabled": true,
-  "javascript.preferences.importModuleSpecifier": "non-relative",
-  "javascript.updateImportsOnFileMove.enabled": "always",
-  "json.validate.enable": false,
-  "markdown.extension.preview.autoShowPreviewToSide": false,
-  "markdown.preview.scrollEditorWithPreview": true,
-  "markdown.preview.scrollPreviewWithEditor": true,
+  "openMultipleFiles.limit": 700,
   "markdownlint.config": {
-    "MD033": false,
-    "MD041": false
-  },
-  "mdx.server.enable": true,
-  "openMultipleFiles.exclude": [
-    "**/*.gif",
-    "**/*.jpeg",
-    "**/*.png",
-    "**/*.svg",
-    "**/*.txt",
-    "**/.git",
-    "**/.idea",
-    "**/.million",
-    "**/.next",
-    "**/.nyc_output",
-    "**/.pnp.*",
-    "**/.turbo",
-    "**/.venv",
-    "**/.yarn",
-    "**/build",
-    "**/cluster/deprecated",
-    "**/coverage",
-    "**/dist",
-    "**/dist-dev",
-    "**/fixture",
-    "**/node_modules",
-    "**/package-lock.json",
-    "**/public",
-    "**/target",
-    "**/yarn.lock",
-    "**/yarn-error.log",
-    "addons/.output"
-  ],
-  "openMultipleFiles.ignore": [".gitignore"],
-  "openMultipleFiles.limit": 1000,
-  "outline.problems.badges": false,
-  "prettify-ts.viewNestedTypes": true,
-  "problems.defaultViewMode": "table",
-  "problems.showCurrentInStatus": true,
-  "problems.sortOrder": "position",
-  "ruff.lineLength": 88,
-  "ruff.nativeServer": true,
-  "search.exclude": {
-    "**/*.lock": true,
-    "**/.eslintcache": true,
-    "**/.idea": true,
-    "**/.next": true,
-    "**/.pnp.*": true,
-    "**/.venv": true,
-    "**/.yarn": true,
-    "**/build": true,
-    "**/dist": true,
-    "**/next-env.d.ts": true,
-    "**/package-lock.json": true,
-    "**/pnpm-lock.yaml": true,
-    "**/reset.d.ts": true,
-    "**/tsconfig.tsbuildinfo": true,
-    "**/yarn-error.log": true
+    "MD033": false
   },
-  "search.useIgnoreFiles": false,
-  "tailwindCSS.classAttributes": ["class", "className", "classNames"],
-  "tailwindCSS.experimental.classRegex": [
-    ["(?:'|\"|`)([^']*)(?:'|\"|`)", "cx\\(([^)]*)\\)"],
-    ["[\"'`]([^\"'`]*).*?[\"'`]", "cva\\(([^)]*)\\)"]
-  ],
-  "terminal.integrated.allowedLinkSchemes": [
-    "C",
-    "file",
-    "http",
-    "https",
-    "mailto",
-    "vscode",
-    "vscode-insiders"
-  ],
-  "terminal.integrated.smoothScrolling": true,
-  "totalTypeScript.hideAllTips": true,
-  "totalTypeScript.hideBasicTips": true,
-  "tsEssentialPlugins.arrayMethodsSnippets.enable": true,
-  "tsEssentialPlugins.fixSuggestionsSorting": true,
-  "tsEssentialPlugins.globalLibCompletions.action": "mark",
-  "tsEssentialPlugins.jsxEmmet.modernize": true,
-  "tsEssentialPlugins.outline.arraysTuplesNumberedItems": true,
-  "tsEssentialPlugins.patchOutline": true,
-  "tsEssentialPlugins.renameImportNameOfFileRename": true,
-  "tsEssentialPlugins.signatureHelp.excludeBlockScope": true,
-  "tsEssentialPlugins.skipNodeModulesReferences": true,
-  "tsEssentialPlugins.suggestions.localityBonus": true,
-  "tsEssentialPlugins.tupleHelpSignature": true,
-  "typescript.enablePromptUseWorkspaceTsdk": true,
-  "typescript.format.semicolons": "insert",
-  "typescript.inlayHints.enumMemberValues.enabled": true,
-  "typescript.inlayHints.parameterNames.enabled": "all",
-  "typescript.preferences.autoImportFileExcludePatterns": [
-    "next/dist/client/router.d.ts",
-    "next/router.d.ts"
-  ],
-  "typescript.preferences.importModuleSpecifier": "non-relative",
-  "typescript.preferences.includePackageJsonAutoImports": "on",
-  "typescript.referencesCodeLens.enabled": true,
-  "typescript.reportStyleChecksAsWarnings": true,
-  "typescript.tsdk": "node_modules/typescript/lib",
-  "typescript.updateImportsOnFileMove.enabled": "always",
-  "typescript.validate.enable": true,
-  "window.autoDetectColorScheme": true,
-  "window.commandCenter": true,
-  "window.title": "${dirty}${folderName}${separator}${activeEditorMedium}",
-  "workbench.colorCustomizations": {
-    "terminal.ansiBlack": "#21222c",
-    "terminal.ansiBlue": "#bd93f9",
-    "terminal.ansiBrightBlack": "#8d92ff",
-    "terminal.ansiBrightBlue": "#bd93f9",
-    "terminal.ansiBrightCyan": "#2cccff",
-    "terminal.ansiBrightGreen": "#20E3B2",
-    "terminal.ansiBrightMagenta": "#ff6bcb",
-    "terminal.ansiBrightRed": "#ff7979",
-    "terminal.ansiBrightWhite": "#ffffff",
-    "terminal.ansiBrightYellow": "#EAC394",
-    "terminal.ansiCyan": "#8be9fd",
-    "terminal.ansiGreen": "#20e3b2",
-    "terminal.ansiMagenta": "#ff6bcb",
-    "terminal.ansiRed": "#ff5555",
-    "terminal.ansiWhite": "#f8f8f2",
-    "terminal.ansiYellow": "#fde181",
-    "terminalCursor.background": "#868690",
-    "terminalCursor.foreground": "#43444D"
-  },
-  "workbench.editor.enablePreview": false,
-  "workbench.layoutControl.enabled": true,
-  "workbench.panel.defaultLocation": "bottom",
-  "workbench.statusBar.visible": true
+  "typescript.tsdk": "node_modules\\typescript\\lib",
+  "eslint.ignoreUntitled": true,
+  "i18n-ally.localesPaths": ["messages"],
+  "i18n-ally.enabledFrameworks": ["react"],
+  "i18n-ally.sourceLanguage": "en",
+  "i18n-ally.autoDetection": true,
+  "i18n-ally.keystyle": "nested"
 }
diff --git a/README.md b/README.md
index d13d2c9b..fb72de9d 100644
--- a/README.md
+++ b/README.md
@@ -1,1144 +1,44 @@
-# Relivator 1.3.0-canary.7: Next.js 15 eCommerce Template
+# Relivator Next.js Template
 
-We are currently migrating the documentation from the existing Relivator README.md to the official, newly launched [Relivator & Reliverse Docs website (https://reliverse.org)](https://reliverse.org). The content will be organized into appropriate sections on the new site. During the migration, some elements might not function properly. The current README.md will contain only minimal information. Please let us know if you encounter any issues.
+Please consider following this project's author, [Nazar Kornienko](https://github.com/blefnk), and consider starring the project to show your ❤️ and support.
 
----
+- **🚀 Live Demo**: [relivator.com](https://relivator.com/en)
+- **💙 Discord**: [discord.gg/Pb8uKbwpsJ](https://discord.gg/Pb8uKbwpsJ)
+- **📚 Docs**: [docs.reliverse.org](https://docs.reliverse.org/relivator)
 
-<!--
-For those who are viewing the current markdown file using:
- – VSCode: Press F1 or Cmd/Ctrl+Shift+P and enter ">Markdown: Open Preview". Please install the "markdownlint" and "Markdown All in One" extensions.
- – GitHub: Does this .md file appear different from what you are used to seeing on GitHub? Ensure the URL does not end with "?plain=1".
--->
+![cover image](./public/screenshot-dark.png)
 
-<div align="center">
+## How to Run or Build the Project?
 
-[🌐 Demo](https://relivator.com) | [👋 Introduction](#introduction) | [🏗️ Installation](#installation) | [🩷 Sponsors](#sponsors)
+Make sure you have [Git](https://git-scm.com/downloads), [Node.js](https://nodejs.org/en), and [Bun](https://bun.sh) installed. Then:
 
-[⚙️ Scripts](#scripts) | [🤔 FAQ](#faq) | [🔍 Details](#details) | [✅ Roadmap](#roadmap) | [📖 Changelog](#changelog)
+1. `git clone https://github.com/blefnk/relivator.git`
+2. `cd relivator`
+3. `bun i`
+4. `cp .env.example .env` → Fill in the .env file
+5. `bun db:push`
+6. `bun dev` / `bun run build`
 
-</div>
+## What is Relivator?
 
-<!-- 🚀 Yay! Thanks for the installation and welcome! If you like it, please consider giving us a star! ⭐ -->
+The Relivator template serves as the foundation for your eCommerce platform, helping you create efficient, engaging, and profitable online stores. Relivator enhances any eCommerce with the power of modern Next.js, React, TypeScript, Tailwind, and more. For detailed information about the Relivator template and its bootstrapper, [Reliverse](https://github.com/reliverse/cli), you can visit the [documentation website](https://docs.reliverse.org/relivator).
 
-<!-- 👉 https://github.com/blefnk/relivator-nextjs-template 🙏 -->
+## Stack of technologies
 
-Stop jumping from one starter to the next. With [Relivator](https://github.com/blefnk/relivator-nextjs-template#readme), your possibilities are endless! You can create anything you want; all the tools are ready and waiting for you.
+- **Core**: Next.js 15.1, React 19, TypeScript 5.7
+- **Internationalization**: next-intl
+- **Styling**: Tailwind & Shadcn/UI
+- **Auth**: Clerk
+- **Payments**: Stripe
+- **Database**: Drizzle ORM & Neon Postgres
+- **File Storage**: Uploadthing
+- **Tools**: ESLint 9, Biome, Knip
 
-The entire Relivator project was developed by one person, [Nazar Kornienko (blefnk)](https://github.com/blefnk)! Some people have already contributed, and you’re welcome to do the same—any contributions at all are appreciated! Your contributions will not be forgotten; [our awesome community](https://discord.gg/Pb8uKbwpsJ) value them highly, and you might even receive financial gratitude from the project's creator in the future. Let's come together to create the most coolest Next.js template in the world! This will be a joint effort and a shared victory, a true win-win. Thank you all for your contributions and [financial support](#sponsors)!
+## What if I want to have another stack?
 
-Please take a moment to read through the information below. You'll find helpful details about how everything works in the project, as well as an extensive list of features.
-
-<div align="center">
-
-<p>
-    <span>
-      <a href="https://relivator.com">
-        <picture>
-            <source media="(prefers-color-scheme: dark)" srcset="public/screenshot-dark.png" />
-            <source media="(prefers-color-scheme: light)" srcset="public/screenshot-light.png" />
-            <img alt="Shows the landing page of Relivator Next.js template, with its logo and the phrase 'Relivator Empowers Your eCommerce with the Power of Next.js'." src="/public/screenshot-light.png" width="40%" />
-        </picture>
-      </a>
-    </span>
-    <span>
-      <a href="https://github.com/blefnk/relivator-nextjs-template/blob/main/public/og.png">
-        <picture>
-            <source media="(prefers-color-scheme: dark)" srcset="public/og.png" />
-            <source media="(prefers-color-scheme: light)" srcset="public/og.png" />
-            <img alt="Dark-themed image displaying various technologies and tools used in the Relivator project. The heading highlights Next.js 15, React 19, shadcn, and Tailwind Template. The image is divided into multiple sections listing technologies like shadcn, tailwind, next 15, react 19, clerk, authjs, drizzle, neon, ts 5.6, python, eslint 9, ts-eslint 8, knip, biome, unjs, and reliverse. The background features a grid layout with a minimalistic design, inspired by the Figma and Loading UI style." src="/public/og.png" width="45%" />
-        </picture>
-      </a>
-    </span>
-</p>
-
-[![Discord chat][badge-discord]][link-discord]
-[![npm version][badge-npm]][link-npm]
-[![MIT License](https://img.shields.io/github/license/blefnk/relivator-nextjs-template.svg?color=blue)](LICENSE)
-
-[𝕏](https://x.com/blefnk) | [GitHub](https://github.com/blefnk) | [Slack](https://join.slack.com/t/reliverse/shared_invite/zt-2mq703yro-hKnLmsgbIQul0wX~gLxRPA) | [LinkedIn](https://linkedin.com/in/blefnk) | [Facebook](https://facebook.com/blefnk) | [Discord](https://discord.gg/Pb8uKbwpsJ) | [Fiverr](https://fiverr.com/blefnk)
-
-</div>
-
-> *«I couldn't find the ~~sports car~~ Next.js starter of my dreams, so I built it myself.»* © ~~Ferdinand Porsche~~ [@blefnk](https://github.com/blefnk)
-
-Our goal is to create the world's most feature-rich and globally accessible Next.js starter. It offers more than just code—it's an experience. Scroll down to see the impressive list of project features, including the ability to switch between Clerk/Auth.js (next-auth@beta/NextAuth.js) and Drizzle's MySQL/PostgreSQL on the fly. Welcome to the Relivator starter and the Reliverse community!
-
-<!-- <p align="center">
-    <span>
-      <a href="https://relivator.com">
-        <picture>
-            <source media="(prefers-color-scheme: dark)" srcset="public/screenshot-dark.png" />
-            <source media="(prefers-color-scheme: light)" srcset="public/screenshot-light.png" />
-            <img alt="Shows the landing page of Relivator Next.js template, with its logo and the phrase 'Relivator Empowers Your eCommerce with the Power of Next.js'." src="/public/screenshot-light.png" width="50%" />
-        </picture>
-      </a>
-    </span>
-    <span>
-      <a href="https://star-history.com/#blefnk/relivator-nextjs-template&Timeline">
-      <picture>
-        <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=blefnk/relivator-nextjs-template&type=Timeline&theme=dark" />
-        <source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=blefnk/relivator-nextjs-template&type=Timeline" />
-        <img alt="Star History Chart" src="https://api.star-history.com/svg?repos=blefnk/relivator-nextjs-template&type=Timeline" width="50%" />
-      </picture>
-      </a>
-    </span>
-</p> -->
-
-## Introduction
-
-[**👉 Read the Detailed Blog Post About 1.2.6 & 1.3.0@canary Update 👈**](https://reliverse.org/relivator/v126)
-
-**✅ Relivator 1.2.6 uses the following dependencies (only some are listed)**: Next.js 15, React 19, TypeScript 5.5/5.6, Tailwind 3/4, tRPC 11, Clerk 5, Auth.js 5, ESLint 9 (with multiple plugins like typescript-eslint 8, react, unicorn, sonarjs, perfectionist, tailwindcss, readable-tailwind, import-x, jsx-a11y, security, markdown, mdx, json), Biome, Stripe, Million, Reliverse, next-intl, shadcn/ui, radix-ui, react-query, pnpm, zod, cn, turbo, Drizzle (Postgres, MySQL, SQLite, Neon, Railway, PlanetScale, Turso), GSAP, SWR, Resend, react-email, next-themes, Putout, Flowbite, Udecode, Slate, uploadthing, Radash, CSpell, TypeStat, Lucide & Radix Icons, Vercel & Loglib Analytics, Axios, Day.js, Embla Carousel, Execa, Math.js, UnJS libs (consola, fs-extra, pathe, etc), and much more
-
-**[upd. 18.08.2024]** You can now try out the first published Reliverse Addon – [@reliverse/fs](https://github.com/reliverse/fs#readme), which is already available and used in Relivator! **🎉 The upcoming Relivator 1.3.0 will have as few dependencies as possible.** Everything will work thanks to @reliverse/addons. Everything will be separated into its own libraries and will be published on npmjs and/or jsr. You will be able to install exactly what you need, including functionality and UI. You will have two options. One is to install the addons the classic way using 'package.json'. The other option is that all these addons can also be installed in a style inspired by shadcn/ui, where you keep all the content directly in your project (as it is currently in test mode in Relivator 1.2.6 (please check `addons` folder or run `pnpm addons`)), although the first option will be recommended for the most use cases. 'addons' folder already contains many cool things, especially related to codemods. It also includes the @reliverse/academy game, where you can check how good you know JavaScript/TypeScript, React/Next.js, Relivator/Reliverse, and even ESLint, ecosystems (you will even find there table of records and will can contest with other players if you share data/players.json and data/progress.json save files to them; the game has also achievement system).
-
-**🙏 Please help us reach 1,000 stars on GitHub**: Once this project reaches this goal, I, @blefnk, the author of this project, will start my video course on the basics of web development (HTML, CSS, JS), React, Next.js, TypeScript, related libraries, and many other topics. This milestone will also affirm that Relivator and [Reliverse](https://github.com/blefnk/reliverse-website-builder) truly make sense to exist, leading to more frequent updates and further dedication to these projects.
-
-**⭐ Bookmark this page in your browser**: This project will only get better in the future. You can also click the star at the top of the page and add the repo to your collection to keep it easily accessible.
-
-## The Huge Relivator 1.2.6 & 1.3.0@canary are Already Available
-
-[**👉 Read the Detailed Blog Post About 1.2.6 & 1.3.0@canary Update 👈**](https://reliverse.org/relivator/v126)
-
-Relivator 1.2.6 was released on August 4, 2024! We are now actively working on the next major update, Relivator 1.3.0, with the goal of making the project production-ready, clean, and high-quality. We invite you to join us in actively searching for issues, contributing freely, and earning cool rewards. A canary branch was launched a few days ago (and is available to everyone in the main repo), and the dev branch is also now available (the dev branch is available for a limited time to all sponsors at any paid pledge level).
-
-**🔥 Important Note:** Relivator currently requires specifying Clerk environment variable keys, as its API has changed. We are working on making Clerk optional again. However, all other environment variables are optional. If this statement is incorrect and something is broken, please let us know.
-
-## What About the Future? Any News on 1.3.0?
-
-**🎉 The upcoming Relivator 1.3.0 will have as few dependencies as possible! Finally!**
-
-I'm ([blefnk](https://github.com/blefnk)) working to automate the Relivator's developer experience as much as possible, including the installation process. The upcoming version 1.3.0 will feature significant automated installation. If you wish to try the initial alpha version of one of my many automation scripts, use the `pnpm deps:install` (or `pnpm deps:install-all`) command. This script already allows you to install and remove project packages, and it also works as a linter. You can check the comprehensive number of predefined commands configured inside the 'scripts' section of the 'package.json' file. However, before running this script, you should manually install the essentials:
-
-- `npx npm add typescript tsx npm @mnrendra/read-package @clack/prompts`
-- `npx npm add fs-extra pathe fast-npm-meta semver @types/semver redrun axios`
-- `bun|yarn|pnpm dlx jsr add @reliverse/core` (or: `npx jsr add @reliverse/core`)
-
-Thanks to @reliverse/addons, everything now works smoothly with fewer dependencies. In the future, each feature and component will be split into its own library and published on [npmjs](https://npmjs.com) and/or [jsr](https://jsr.io), so you can install only what you need. With the future Relivator 1.3.0 version, you won't have to deal with unnecessary components in web templates anymore. You get the core package and can add features and UI components as you need them.
-
-The 'addons' folder is divided into two parts: terminal context and browser context (it's everything, excluding the 'addons/scripts' folder). The 'addons/scripts' folder contains functions used by the CLI (command line interface), while the 'src' and 'addons/*' folders (excluding 'addons/scripts') are for the browser, since the browser doesn't support certain JS features. So, while 'addons/scripts' has everything needed for the whole app, not everything can import from 'addons/scripts'.
-
-You’ll have two installation options: the classic method using 'package.json' or a new approach inspired by shadcn/ui, where you keep all the content directly in your project (currently in test mode in Relivator 1.2.6—check the `addons` folder or run `pnpm addons`). While the classic method is recommended for most cases, feel free to explore the new approach!
-
-The 'addons' folder is already packed with many exciting features, especially related to codemods, and includes the **@reliverse/academy game**. This game allows you to test your knowledge of JavaScript/TypeScript, React/Next.js, Relivator/Reliverse (make food/tea/coffee before trying this test—it has a lot of questions!), and even ESLint v9 ecosystems. It features a leaderboard, enabling you to compete with others by sharing `data/players.json` and `data/progress.json` save files. Plus, an achievement system keeps you motivated!
-
-I can’t wait for you to experience the new and improved Relivator 1.3.0! By the way, the items in the [✅ Roadmap](#roadmap) section will finally be checked off! But to make 1.3.0 truly stable, production-ready, and just great, let's first work together on Relivator v1.3.0-canary.0, which is coming soon! If you want to get it even faster, there is now a 'dev' branch. We recently opened the project pages on financial support platforms, and currently, any contribution grants you access to the 'dev' branch. Thank you for your attention!
-
-## Sponsors
-
-**[We're Growing Fast! A Huge Thanks to All Our Supporters!](https://github.com/blefnk/relivator-nextjs-template/stargazers)**
-
-Developing something as ambitious as Relivator takes a lot of time, especially since the project is primarily developed by just one person. The development could be significantly accelerated by hiring additional developers. Therefore, @blefnk (Nazar Kornienko), the author of this project, would be immensely grateful to anyone who can donate to the project in any amount. A big thank you to everyone in advance!
-
-**[Visit the "Donate to Relivator" page to learn more.](https://relivator.com/donate)**
-
-*Relivator is currently sponsored by the following awesome people/organizations:*
-
-### 💚 [GitHub Sponsors](https://github.com/sponsors/blefnk) 🩵 [PayPal](https://paypal.me/blefony) 🧡 [Patreon](https://patreon.com/blefnk) 💛 [Buy Me a Coffee](https://buymeacoffee.com/blefnk) 🩷 [Ko-fi](https://ko-fi.com/blefnk)
-
-*Love using this project? If you find this project useful, I'd appreciate a cup of coffee. You'll get Reliverse Pro, access to some private repositories, pre-release downloads, and the ability to influence my project planning. Please click on the donation platforms above to learn more. Thank you, everyone, for any kind of support!*
-
-*I retrieve your data from donation and related platforms. If you do not wish for certain information about you to be included here, please contact me.*
-
-- [@devmarauda](https://github.com/devmarauda) *(Discord: kongkong86 | Name: Daniel Humphreys)*
-- [@svict4](https://github.com/svict4) *(Discord: svict4 | Name: Simon Victory)*
-- [@mfpiano](https://youtube.com/@mfpiano) *(Discord: mfpiano | Name: Petro Melnyk)*
-
-### 💜 [Discord Server Boost](https://discord.gg/C4Z46fHKQ8)
-
-- [@Saif-V](https://github.com/Saif-V) *(Discord: Gh0st | Name: Saif Al-Hashar)*
-- [@demiroo](https://github.com/demiroo) *(Discord: demiroezkan | Name: Özkan Demir)*
-
-## 🖥️ Hire Me
-
-Hello, I'm [Nazar Kornienko](https://github.com/blefnk), a flexible web developer specializing in JavaScript/TypeScript and React/Next.js front-end development. If you’re looking for someone with my skill set, please contact me at <blefnk@gmail.com> or via [Discord](https://discordapp.com/users/611578864958832641).
-
-Please explore the current repository to learn more about my experience with the JavaScript/TypeScript and React/Next.js ecosystems. I'm available for both remote work and full-time positions. While my primary focus is frontend and CLI development, if you need help with code automation tools, small tasks related to Python or backend, or even designs in Figma, graphic design, or copywriting/marketing, feel free to reach out to me as well—I’d love to see how I can assist.
-
-## 🤝 Partnerships
-
-Starting with version 1.2.6, Relivator is now truly production-ready. However, there's still much to be accomplished, and you might be surprised when you check the [✅ Roadmap](#roadmap) section! To reach our goals, we are seeking partners to collaborate and support each other's projects' growth. If you're interested and would like to learn more, please feel free to email me at <blefnk@gmail.com>.
-
-### Our Partners
-
-<a href="https://railway.app?referralCode=sATgpf">
-  <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="public/partners-dark.svg" />
-    <source media="(prefers-color-scheme: light)" srcset="public/partners-light.svg" />
-    <img alt="Gallery of all partners' logos" src="/public/partners-dark.svg" width="64" />
-  </picture>
-  <p>Railway</p>
-</a>
-
-## 🙏 Dear Audience, I Need Your Help
-
-Currently, I’m in a challenging financial situation, so I would greatly appreciate any recommendations or mentions of my work and Relivator as part of my portfolio, such as on the pages of your own repositories. Your support would mean a lot to me! As a token of my appreciation, I’d be happy to send some interesting gifts to you. Thank you for your time and consideration!
-
-## Installation
-
-<!-- [![Bootstrap Relivator with a stack of your choice using the Reliverse CLI](https://github.com/blefnk/reliverse-website-builder)] -->
-
-**How to Install and Get Started:** You have two options for installation. You can either immediately deploy to Vercel using the button below and start working on the generated repository right away (but still read the information below), or you can follow the short or detailed manual installation instructions provided.
-
-**By The Way:** *Sometimes, we gift `Reliverse Pro`, which gives you early access to the Reliverse projects ecosystem, including Relivator, as well as upcoming plugins, to randomly selected individuals. We also give away other interesting things. Simply `star this repository` and [let us know how to reach you](https://forms.gle/NXZ6QHpwrxh52VA36). To join the discussion, hop into [the project's Discord](https://discord.gg/Pb8uKbwpsJ).*
-
-### One-click Installation Method (**find recommended method below**)
-
-**🔥 Important Note:** Relivator currently requires specifying Clerk environment variable keys, as its API has changed. We are working on making Clerk optional again. However, all other environment variables are optional. If this statement is incorrect and something is broken, please let us know.
-
-By using this method, you will get only the front-end, with all the functionality disabled (learn how to enable it by reading the manual instructions below):
-
-[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fblefnk%2Frelivator-nextjs-template&project-name=relivator&repository-name=my-new-repository-name)
-
-**Please note:** As of version 1.2.6 and 1.3.0 (dev and canary), it is recommended to use Clerk as the authProvider (specified in the `reliverse.config.ts` file) since this version has been more thoroughly tested with Clerk. We are working on fixing and improving the stability of Auth.js (next-auth@beta/NextAuth.js) as an authentication provider.
-
-### Manual Installation: Short Method (**find recommended method below**)
-
-**🔥 Important Note:** Relivator currently requires specifying Clerk environment variable keys, as its API has changed. We are working on making Clerk optional again. However, all other environment variables are optional. If this statement is incorrect and something is broken, please let us know.
-
-1. **Node.js LTS**: **(A)** classical method - [Windows/macOS](https://nodejs.org) | [Linux](https://youtu.be/NS3aTgKztis); **(B)** nvm - [Windows](https://github.com/coreybutler/nvm-windows?tab=readme-ov-file#install-nvm-windows) | [macOS/Linux](https://github.com/nvm-sh/nvm?tab=readme-ov-file#installing-and-updating); **(C)** [fnm](https://github.com/Schniz/fnm#readme).
-2. **Tools**: `corepack enable pnpm` ➞ [*VSCode*](https://code.visualstudio.com) ➞ [*Git*](https://learn.microsoft.com/en-us/devops/develop/git/install-and-set-up-git) ➞ *GitHub Desktop* ([Windows/macOS](https://desktop.github.com) | [Linux](https://dev.to/rahedmir/is-github-desktop-available-for-gnu-linux-4a69)) ➞ [Stripe CLI](https://docs.stripe.com/stripe-cli). Windows only: [PowerShell 7.4+](https://learn.microsoft.com/en-us/powershell/scripting/install/installing-powershell-on-windows?view=powershell-7.4#installing-the-msi-package).
-3. **[Fork the repo](https://github.com/blefnk/relivator-nextjs-template/fork)**: Download your fork using GitHub Desktop.
-4. **Setup**: `pnpm install && install:global && pnpm reli:setup` ➞ `pnpm reli:vscode` ➞ `cp .env.example .env` ➞ fill in the values inside of `.env` ➞ `pnpm db:push` ➞ `reliverse.config.ts`.
-5. **Run, Build, Deploy**: Use `pnpm dev` to run the app. Stop with `Ctrl+C`. Build with `pnpm build`. Run `pnpm appts` to check the code. Upload to GitHub with GitHub Desktop. Deploy on [Vercel](https://vercel.com/new).
-
-### Manual Installation: Detailed Method (recommended)
-
-**🔥 Important Note:** Relivator currently requires specifying Clerk environment variable keys, as its API has changed. We are working on making Clerk optional again. However, all other environment variables are optional. If this statement is incorrect and something is broken, please let us know.
-
-▲ Hotline: [Email](mailto:blefnk@gmail.com) | [Discord](https://discord.gg/Pb8uKbwpsJ) | [Slack](https://join.slack.com/t/reliverse/shared_invite/zt-2mq703yro-hKnLmsgbIQul0wX~gLxRPA) | [Cal.com](https://cal.com/blefnk/reliverse)
-
-> I'm ([blefnk](https://github.com/blefnk)) working to automate the Relivator's installation process as much as possible. The upcoming version 1.3.0 will feature a significant automated installation. If you wish to try the alpha version of one of my many automation scripts, use the `pnpm deps:install` (or `pnpm deps:install-all`) command. However, before running this script, you should manually install the essentials (edit 'pnpm dlx jsr' if needed): `npx nypm add typescript tsx @clack/prompts @mnrendra/read-package nypm ora fs-extra pathe fast-npm-meta semver @types/semver redrun && pnpm dlx jsr add @reliverse/core`.
-
-**Please note**: As of version 1.2.6 and 1.3.0 (dev and canary), it is recommended to use Clerk as the authProvider (specified in the `reliverse.config.ts` file) since this version has been more thoroughly tested with Clerk. We are working on fixing and improving the stability of Auth.js (next-auth@beta/NextAuth.js) as an authentication provider.
-
-1. **Node.js LTS**: Ensure you have *Node.js LTS* installed using: **(a)** classical method - [Windows/macOS](https://nodejs.org) | [Linux](https://youtu.be/NS3aTgKztis); **(b)** nvm - [Windows](https://github.com/coreybutler/nvm-windows?tab=readme-ov-file#install-nvm-windows) | [macOS/Linux](https://github.com/nvm-sh/nvm?tab=readme-ov-file#installing-and-updating); **(c)** [fnm](https://github.com/Schniz/fnm#readme).
-2. **Essential Tools**: Then, run `corepack enable pnpm` to install [*pnpm*](https://pnpm.io/installation). Also, install [*VSCode*](https://code.visualstudio.com), [Git](https://learn.microsoft.com/en-us/devops/develop/git/install-and-set-up-git), *GitHub Desktop* ([Windows/macOS](https://desktop.github.com) | [Linux](https://dev.to/rahedmir/is-github-desktop-available-for-gnu-linux-4a69)), and [Stripe CLI](https://docs.stripe.com/stripe-cli). If you're a Windows user: install [PowerShell 7.4+](https://learn.microsoft.com/en-us/powershell/scripting/install/installing-powershell-on-windows?view=powershell-7.4#installing-the-msi-package) as well.
-3. **Project Cloning**: [*Fork the repository*](https://github.com/blefnk/relivator-nextjs-template/fork) or click on the `Use this template` button. Use GitHub Desktop to download it to your device. The project size is about 12MB, but ensure you have at least 7GB of disk space for comfortable work, as the `node_modules` and `.next` folders require it.
-4. **Configuration**: Open the project folder in VSCode. Install the recommended extensions from [.vscode/extensions.json](.vscode/extensions.json) and/or install the advanced VSCode configurations by using `pnpm reli:vscode` (choose the `default` preset for the best experience or the `ultimate` preset for the best experience). You can also refer to the [⚙️ Scripts](#scripts) and [🤔 FAQ](#faq) *RQ19* below to learn more about this script and its configurations. You can press `Cmd/Ctrl+F` and search for "`Q19`/`Q20`" if you want to install more extensions and settings (remember, more extensions mean slower VSCode). Then click `File > Exit` (VSCode will save all your open windows). Open VSCode again. Press `Ctrl+Shift+P` (or just `F1`) and search for `>Create New Terminal`, or just press **Cmd/Ctrl+Shift+~** *(on Windows make sure that it uses PowerShell 7.4+, click the arrow next to + ➞ Select Default Profile ➞ PowerShell)*. If VSCode prompts you to allow the usage of the project's TypeScript version, allow it if you're a Windows user. On other operating systems, you may or may not encounter path issues.
-5. **Environment**: Run `pnpm install` (or `npx nypm install`) and/or, optionally, `install:global` to install the required packages. It is also recommended to configure `reliverse.config.ts` file. Then, optionally, you can use `pnpm deps:install-all`—especially `pnpm deps:install-all` (*this is currently an alpha script*)—to unlock some additional features, like the `eslint.config.ultimate.ts` preset (which will have a `.txt` extension by default starting with Relivator v1.3.0). (NOTE: As of Relivator v1.2.6, the `ultimate` preset is configured by default, so no action is required). Next, configure Relivator to meet your needs using the `pnpm reli:setup` and/or `pnpm reli:vscode` commands, and relaunch VSCode. You have two options: deploy with zero values in the `.env` file (resulting in just the frontend without features related to auth, database, pricing, etc.), or copy the `.env.example` file to a new `.env` file and fill in the values you want (everything is optional starting with Relivator v1.2.6). It is highly recommended to fill in the `DATABASE_URL` field. Then, set the database provider in `drizzle.config.ts` and make changes in related files if needed. Finally, send the database schema to the database using `pnpm db:push`. You can learn more about databases below in the current `README.md` file.
-6. **Run, Stop, Build**: Run the app with `pnpm dev` or `pnpm turbo:dev` (interactive but unstable). Visit <http://localhost:3000> to check it out. Stop it by focusing on the console and pressing `Ctrl+C`. After making changes, build the app using `pnpm build` or `pnpm turbo:build`. *Don't worry if you see warnings related to Clerk, React Compiler, Babel, next-auth, etc. when running the build; these are known issues not related to Relivator.* Note that when using the pnpm [turbo:build](https://turbo.build) command, the VSCode terminal may not exit automatically. If this happens, press Cmd/Ctrl+C to close the process manually.
-7. **Check, Commit, Deploy**: To check if the current codebase meets [@reliverse/standard](https://github.com/reliverse/standard), run `pnpm appts` (or `pnpm appts:noputout`, or `pnpm turbo:appts`, or `pnpm appts:nobuild`). Learn more about project scripts in the next section. If everything is fine, upload the project to your GitHub profile using GitHub Desktop. Finally, deploy it by importing the project into [Vercel](https://vercel.com/new), making the website publicly accessible on the internet. Alternatively, you can use `pnpm deploy` or just `vercel` to preview and inspect the local deployment without committing to GitHub every time.
-
-**It is recommended:** From time to time, run `pnpm reli:prepare`. This script executes `pnpm install`, which checks for issues or installs/removes manually added/removed dependencies in your `package.json` file. It also executes `pnpm latest`, which installs the latest versions of project dependencies. Finally, it runs `pnpm appts`, which will do its best to improve your code and check for any errors. **Note:** Since `pnpm latest` updates all packages to their latest versions, be aware that something in the code might break, especially if considerable time has passed since the last version of Relivator was released. Therefore, you can use, for example, the VSCode extension `Open Multiple Files` to easily find and fix broken code, or reach out to the [Relivator Discord server](https://discord.gg/Pb8uKbwpsJ) for assistance, or create a [GitHub Issue](https://github.com/blefnk/relivator-nextjs-template/issues). You can learn more about those scripts and the mentioned extension below in the current `README.md` file.
-
-**If you'd like** to share your work, get/provide feedback, or ask for help, feel free to do so either [in our Discord server](https://discord.gg/Pb8uKbwpsJ) or [via GitHub discussions](https://github.com/blefnk/relivator-nextjs-template/discussions). **Note:** Currently, the instructions above may be outdated. Please contact us if something goes wrong; everything will be updated in Relivator 1.3.0.
-
-## 🎶 Recommendation
-
-> Coding becomes a whole new experience with the right music, doesn't it? Enhance your workflow with Relivator and enjoy the soothing melodies from the [MF Piano YouTube channel](https://youtube.com/@mfpiano). This channel, run by my brother, offers beautiful piano covers that are perfect for background music. Your subscriptions, views, likes, and comments would mean the world to us and help his channel grow. Thank you for your support!
-
-## Scripts
-
-The project includes various scripts designed to enhance your developer experience. You can run any script using your terminal. Please note that some CLI scripts may require you to adjust the height of your terminal window to avoid UI anomalies. The Relivator allows you to use the following:
-
-1. **💪 Native Scripts**: These are commands configured in [package.json](package.json) and run by the package manager like [pnpm](https://pnpm.io), [bun](https://bun.sh), [yarn](https://yarnpkg.com), or [npm](https://nodejs.org/en/learn/getting-started/an-introduction-to-the-npm-package-manager). You can run these "native" scripts using commands like `pnpm [dev|build]` and `pnpm db:[push|studio]`.
-2. **⚙️ Custom-Built Scripts**: These scripts are written in TypeScript and Python by Reliverse and the community and are mostly located in the `addons` folder. 🔥 *Please be cautious when using transformation scripts, as they are all in their initial versions. Ensure you commit your changes to your [version control provider](https://about.gitlab.com/topics/version-control) (such as [GitHub](https://github.com)) before using any of them.* They can be executed via the command line using `[appts|addons|reli|lint|fix]:*` or manually via `pnpm tsx path/to/file` or `py path/to/file` (e.g., `py addons/scripts/reliverse/relimter/python/tasks/math-to-mathjs.py`).
-3. **🐍 Python Script Manager**: Can be executed using `reli:manager` or `py addons/scripts/reliverse/relimter/python/index.py`. Before running it, please read the [🐍 Python](#python) section below to learn how to prepare your workspace to run this manager.
-
-### package.json
-
-Below are some scripts configured in the `scripts` section of the `package.json` file (*the following text may be outdated in some places, please let us know if you find any inaccuracies*):
-
-- **`pnpm appts` / `pnpm appts:putout` / `pnpm appts:verbose` / `pnpm appts:nobuild`**: These commands perform a comprehensive codebase check. They sequentially run `pnpm knip` for various codebase checks, `pnpm format` to format code with Biome (or Prettier, coming soon), and `pnpm lint` for linting with Biome and ESLint (`pnpm lint:eslint`). **Linting may take some time, so please be patient.** The `pnpm appts:putout` command also runs `pnpm lint:putout`. Using `pnpm appts:verbose` displays detailed ESLint progress, useful if you suspect ESLint is stuck (it may be slow, not stuck). You can manually resolve issues by pressing `Ctrl+S` multiple times in VSCode until there are no issues in the "Problems" tab. Usually, issues are resolved by the second or third run. If some specific issues persist, it may mean they are not automatically fixed. Please try to fix them manually, contact us, or disable the rule. Many rules in `eslint.config.js` are disabled by default; enable only what you need. You may also want to run `pnpm reli:setup` to choose the RulesDisabled preset if you want to disable all "error" and "warning" rules at once. `pnpm appts` then runs `pnpm typecheck` for remaining TypeScript errors and `pnpm build`, but you may try `pnpm turbo:appts`, which runs `pnpm turbo:build` to speed up builds using Turborepo v2. Note that **`pnpm turbo:appts`** is a faster, interactive version of `appts` but may not work well with the VSCode terminal. Alternatively, you can use `pnpm appts:nobuild`, which performs only checking, linting, formatting, and fixing, without building.
-- **`pnpm fix:putout-unstable`**: [Putout](https://github.com/coderaiser/putout) is a linter and formatter. While the formatter fixes issues reported by the linter, the `fix:putout-unstable` command also makes changes not flagged by the linter. Ensure you commit your code before running this command, as it might cause unexpected changes. After running it, review and adjust the changes in your codebase using VSCode Source Control (Cmd/Ctrl+Shift+G) or GitHub Desktop.
-- **`pnpm db:[push|studio|generate|migrate]`**: `push` converts the TypeScript Drizzle schema to SQL and sends it to the DATABASE_URL; `studio` runs Drizzle Studio on <https://local.drizzle.studio>; `migrate` applies migrations generated by the `generate` command (you may not need this command anymore), based on the `drizzle.config.ts` file.
-- **`pnpm stripe:listen`**: Runs the Stripe webhook listener and helps set up Stripe environment variables. The [Stripe CLI](https://docs.stripe.com/stripe-cli) must be installed for this command to work.
-- **`pnpm addons`**: This command allows you to headlessly run some of the scripts located in the `addons` folder. Many scripts are still not added there, so please check the `addons` folder and run them manually using `pnpm tsx path/to/file` or `py path/to/file`. This also includes the game @reliverse/academy. In the future, it will have many different interesting features. Currently, it is a quiz with a leaderboard and achievements where you can test your knowledge of Relivator, JavaScript, TypeScript, React, and even ESLint.
-- **`reli:manager`**: Learn more in the [🐍 Python](#python) section below. This is the alias for the `py addons/scripts/reliverse/relimter/python/index.py` command.
-- **`pnpm latest`**: Updates all project packages to their latest stable versions, including some specific packages to their latest versions on rc/beta/alpha/next/canary branches.
-- **`pnpm reli:vscode [nothing|minimal|default|ultimate]`**: Enhances VSCode settings with presets by Reliverse. This script adjusts your `settings.json`, `extensions.json`, and `launch.json` files. It will prompt for confirmation before overriding current files. Use `RQ20` to learn more about `.vscode` presets and font installation for the `ultimate` preset, or use the `default` preset (which doesn't contain custom fonts and themes). Choose `default`, `minimal`, or `nothing` if your PC or virtual machine is very slow.
-- **`pnpm reli:help`**: Displays useful information about Relivator and Reliverse.
-- **`pnpm lint:compiler`**: Runs the React Compiler health check. Note that React Compiler is disabled by default; see the FAQ section for more details.
-- **`pnpm tw:[v4|v3]`**: Switches between [Tailwind CSS](https://tailwindcss.com/) v3 and the alpha v4 version. **Important**: After using this command, adjust comments in `postcss.config.cjs`. **Also**: When using Tailwind CSS v4, remove or comment out `tailwindPlugin` from `eslint.config.js` as it doesn't support v4. Some additional changes in the codebase may be required.
-- **`pnpm reli:prepare`**: Learn more about this script in the previous section (Cmd/Ctrl+F "It is recommended").
-
-```bash
-# pnpm tsx reliverse.config.ts --details
-ℹ ▲ Framework: Relivator v1.2.6 ▲ Engine: Reliverse v0.4.0 ▲ Hotline: https://discord.gg/Pb8uKbwpsJ
-ℹ Relivator v1.2.6 Release Blog Post 👉 https://reliverse.org/relivator/v126
-ℹ Help Relivator become even better! Please star the repo – https://github.com/blefnk/relivator
-ℹ For experienced users: run 'pnpm reli:prepare' to update all dependencies to the latest versions and check if the code requires any adjustments.
-ℹ Meet quality standards: run 'pnpm appts' and 'pnpm fix:putout-unstable' to get linting, formatting, and more.
-ℹ Unstable: try 'pnpm turbo:dev' and faster build with 'pnpm turbo:build': https://turbo.build/repo
-ℹ The reactCompiler is enabled in next.config.js - it uses webpack now, so builds take longer.
-ℹ Clerk: make sure to connect the domain in the Clerk dashboard so services like PageSpeed will work.
-ℹ Please find Q21 in the FAQ of README.md. Copy the adapted bun scripts and replace the current ones in package.json - scripts for other package managers coming soon.
-```
-
-### Python
-
-👋 Hello, dear friend! Nice to see you here! I (@blefnk Nazar Kornienko) have a dream of making the open-source world better and of higher quality. I aspire to leave my mark in history by ensuring people genuinely enjoy programming and create quality products. I'm particularly passionate about clean code. The book "Clean Code" by Robert Martin is a must-have!
-
-That's why I've developed numerous tools in Relivator. Over the past few months leading up to Relivator 1.2.6, I've learned a lot. To avoid manually rewriting code, I've developed a unified script manager. The current version of the manager is still very unstable. You can visit the `addons/scripts/reliverse/relimter/python/index.py` file to learn more about how this script manager works.
-
-If you want to use this `Python Script Manager` (refer to [⚙️ Script](#scripts) to read the introduction), then please ensure your workspace is properly prepared for it. Please note that most scripts are largely untested. Commit your code before running any script. Increase your VSCode terminal window size to avoid UI glitches. Need help? Visit our [Discord](https://discord.gg/Pb8uKbwpsJ). Follow the steps below to get started (scroll down to learn even more Python commands):
-
-✅ After following the instructions above, you can safely run the script manager.
-
-1. Install [Python](https://python.org/downloads) and [Ruff](https://docs.astral.sh/ruff/installation). Install the following VSCode extensions: [Python](https://marketplace.visualstudio.com/items?itemName=ms-python.python) and [Ruff](https://marketplace.visualstudio.com/items?itemName=charliermarsh.ruff).
-2. Create a new `.venv` folder by pressing `Cmd/Ctrl+Shift+P` and running `>Python: Create Environment...` (VSCode will prompt you to choose the Python interpreter; choose the one installed in step 1). Then, choose `requirements.txt` as the package dependencies file.
-3. Please note, VSCode's terminal automatically activates the environment after each launch. You can verify this by hovering over a [pwsh|bash|cmd] button in VSCode's terminal and looking for something like "`Python`: Activated environment for `.\.venv\Scripts\python.exe`". However, if you are using another IDE or an external terminal, you may need to activate the virtual environment manually: [Windows] `.venv/Scripts/activate`; [macOS/Linux] `source .venv/bin/activate`.
-4. Ensure all requirement are installed correctly, just run `pip install -r requirements.txt`.
-
-🐍 Everything ready? Nice! Congratulations! Try running the `Python Script Manager` now by executing: `reli:manager` or `py addons/scripts/reliverse/relimter/python/index.py`
-
-### Useful Python Commands
-
-*We are still working on this section. The following description may currently be slightly incorrect.*
-
-```bash
-# - Install the required dependencies:
-pip install -r requirements.txt
-
-# - Make sure you have `pip-tools` installed to use `pip-compile` and `pip-sync`:
-pip install pip-tools
-
-# - You can create/update a `requirements.txt` file:
-pip freeze > requirements.txt
-
-# - Sync the dependencies:
-pip-sync requirements.txt
-
-# - Remove a specific package (e.g., torch):
-pip uninstall torch
-pip freeze > requirements.txt
-```
-
-*Please note: If you have [UV](https://github.com/astral-sh/uv) installed and you've used a command like `uv pip install InquirerPy` and it shows an error like "The wheel is invalid", the easiest solution is to just use regular pip commands like `pip install InquirerPy`.*
-
-## FAQ
-
-**This is not only a Reliverse-specific FAQ but also a developers' FAQ for Next.js and the React ecosystem in general.**
-
-- **RQ1:** How do I enable the brand new React 19's React Compiler? **RA1:** Please visit the `next.config.js` file, and inside the `experimental` section, find `reactCompiler` and set it to `true`. Additionally, it's recommended to install `pnpm -D babel-plugin-react-compiler`. There are great ESLint rules, but they are uninstalled by default because they enable Babel/Webpack, which may slow down the build. If you just installed this plugin, then open `eslint.config.js`, find, and uncomment things related to it (use `Cmd/Ctrl+F` and search for `compiler`).
-
-- **RQ2:** How do I ensure my code is fully auto-fixed? **RA2:** Please note that you may need to press Cmd/Ctrl+S a few times to have the code fully fixed by various tools.
-
-- **RQ3:** How can I check the project's health? **RA3:** Run `pnpm appts` or `pnpm turbo:appts` (unstable but interactive and faster) to check the project's health.
-
-- **RQ4:** How can I update all packages to the latest version? **RA4:** For experienced developers, run `pnpm latest` to update all packages to the latest version. Alternatively, use 'pnpm reli:prepare' to update all dependencies and check if the code requires any adjustments.
-
-- **RQ5:** Why do I sometimes see the notification `Invalid JSON. JSON5: invalid character '#'`? **RA5:** No worries, looks like you've `thinker.sort-json` VSCode extension installed, and it seems to be an incorrect error thrown by this extension. But it's not recommended to use external sort-json-like extensions, because we've configured `eslint-plugin-jsonc`, which already does sorting in the more predicted way. If you still need `thinker.sort-json`, looks like it can't sort JSON files in rare random cases, but it works fine on the next file save (if your file doesn't have issues, of course). If this error is causing significant problems, such as preventing you from adding a word to CSpell, you can set `source.fixAll.sort-json` to `never` in `editor.codeActionsOnSave` of `.vscode/settings.json`.
-
-- **RQ6:** What should I do if I notice outdated information or other issues in the README.md or other files? **RA6:** In an effort to be as helpful as possible, this README contains a wealth of information. Some text may be outdated and will be updated as we grow. Please let us know on the [discussion page](https://github.com/blefnk/relivator-nextjs-template/discussions/6) if you notice any small issues like outdated info, broken links, or grammatical/spelling errors in README.md or other files.
-
-- **RQ6:** What versions of React and Next.js does the project currently use? **RA6:** The project currently uses `react@canary`, `react-dom@canary`, and `next@canary`. If React 19 and/or Next.js 15 have already been fully released, please remove them from the `latest` script and run, for example, `npx nypm add react@latest react-dom@latest next@latest` in the terminal. You can do the same with any other rc-alpha-beta-next-canary-dev-experimental-etc dependencies, on your choice, if their stable version has already been released.
-
-- **RQ7:** Where should I store project-specific files, and how do I handle ESLint issues? **RA7:** You can use the `src/cluster` folder to store project-specific files. This makes it easy to update Relivator to new versions. Learn more by visiting the Dashboard's main page on the development environment. After doing this, be prepared to see many issues pointed out by the ESLint config. Run `pnpm lint` to apply auto-fixes; **linting can take some time, so please be patient**. You may need to run `lint` or `lint:eslint` again if some issues are not fixed automatically. You can also open those files manually and press `Ctrl+S` multiple times until there are no issues in the VSCode "Problems" tab. Typically, by using the CLI, the issues will be resolved by the second or third run. Next, install the `Open Multiple Files` extension in VSCode; right-click on the `src/cluster` folder, select `Open Multiple Files`, and press Enter. Fix all issues. If you are proceeding incrementally, you can suppress certain ESLint/Biome rules (`// eslint-disable-next-line ...`, `// biome-ignore ...`, or completely disable the rule in the relevant config) or TypeScript errors (`@ts-expect-error`), though this is not recommended.
-
-- **RQ8:** Weird things happening when formatting code? The code looks one way, and then the next second, it looks different? For example, you see the number of code lines increasing and then decreasing at the same time upon file saving? Without changing the code, does Biome notify you e.g. "Fixed 6 files" instead of "No fixes needed" when you rerun `pnpm appts`? **RA8:** Congrats! You've encountered a conflict between linters or formatters. First, we recommend opening the `.vscode/settings.json` file, finding the `eslint.rules.customizations` section, and changing the `severity` from `"off"` to `"info"` (if `"off"` is present). Setting it to `"info"` will help you realize that one of the conflicting parties is potentially a rule in that `eslint.rules.customizations`. Next, you can try to correct files like `eslint.config.js` (e.g., disable that conflicting rule), `biome.json`, `.vscode/settings.json`, etc. You can also try to disable Biome or ESLint formatters completely, by setting `biome.enabled` or `eslint.enable` (or `eslint.format.enable`) to "false" in the `.vscode/settings.json` file. What about that "Fixed 6 files" example? It means Biome changed code in some files in the way which is different from ESLint.
-
-- **RQ9:** What should I do if I get a Babel warning about code generator deoptimization? **RA9:** This is a known issue and can be ignored. One of the reason occurs because the React Compiler is not yet fully natively supported by Next.js, it temporarily enables Babel to make the Compiler work. Also, don't worry if you see warnings thrown by Clerk, next-auth, or others when running `pnpm build` (mainly on Windows and Node.js); it's okay, this is a known issue not related to Relivator. It is also okay if pnpm tells you `Issues with peer dependencies found`; you can hide this warning by editing `pnpm.overrides` in the `package.json` file. **P.S.** Ignore the `Unexpected value or character.` error from Biome if you see it in the `globals.css` file. This is a false error, which you can hide by filtering `!globals.css` or just `!**.css` in the VSCode's Problems tab (use `!**.css, !**/node_modules/**` there if VSCode's Biome extension parses node_modules for some unknown reason).
-
-- **RQ10:** Can I open multiple files in my VSCode? **RA10:** We recommend the `Open Multiple Files` extension. Just right-click on the desired folder, e.g., `src`, and choose "Open Multiple Files".
-
-- **RQ11:** I have a strange `Each child in a list should have a unique "key" prop`. Any tips? **RA11:** If you see something like `at meta / at head` below this error, or `<locals>, but the module factory is not available. It might have been deleted in an HMR update.`, first try disabling `experimental.instrumentationHook`, if you have it, in `next.config.js`. You can also try deleting the `.next` folder. Please contact us if the problem persists.
-
-- **RQ12:** Million Lint reports `Attempted import error: '__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' is not exported from 'react' (imported as 'L').` during the A12#12 What should I do? **RA12:** The easiest solution is to copy the path to the component file that appears under this error and add it to `filter.exclude` in the `next.config.js` file. Generally, the key word is `use`. Click on the component path below this error. It seems Million has not listed every possible external `useSomething`. Many `useSomething` hooks work fine, but some may cause issues. This error is also triggered if you use `"use client";` but no client-specific features are utilized. In this case, remove this directive. Additionally, Million.js sometimes doesn't recognize the `import * as React from "react";` statement – so you need to remove it and explicitly import each React hook, type, etc. This line was removed from over 80 files in Relivator v1.2.6 for this reason.
-
-- **RQ13:** Why do I see a warning in the terminal containing the message `terminating connection due to immediate shutdown command`? **RA13:** This warning occurs because providers like Neon disconnect users from `localhost` if they are inactive for about 5 minutes. Simply refresh the page to restore the connection.
-
-- **RQ14:** How do I remove unused keys from JSON files? **RA14:** Install the `i18n Ally` VSCode extension, open its tab, click on refresh in the `usage report`, right-click on the found unused keys, and select remove.
-
-- **RQ15:** How can I grant admin rights to myself or another user? **RA15:** Run `pnpm db:studio`, navigate to the `${databasePrefix}_user` table, and set `role: admin` for the desired user. In the future, if you have admin rights, you will be able to change user privileges directly from the frontend admin page.
-
-- **RQ16:** What does the `DEMO_NOTES_ENABLED` environment variable mean? **RA16:** Do not use it. It is only used on the official [Relivator demo website](https://relivator.com) to showcase certain features that are not needed in real-world applications.
-
-- **RQ17:** I'm using PlanetScale as my database provider. After taking a break from the project, I'm now encountering an "unable to connect to branch" error. How can I fix this? **RA17:** Go to the PlanetScale dashboard and click on the `wake up` button. Please contact us if the database is not asleep and the problem persists.
-
-- **RQ18:** I have build/runtime errors indicating that Node.js utilities like `net`, `tls`, `perf_hooks`, and `fs` are not found. What should I do? **RA18:** Do not install these utilities; it won't fix the issue. Remember, never keep code in the `utils` folder that *can only run on the server*. Otherwise, you will encounter anomalies during the project build. For example, an error like `node:` and `file:` not found, or the package `fs`, `crypto`, etc. not found. Want to see the error for yourself? Move the file `src/server/react.ts` to `src/utils`, import it in this file, run `pnpm build`, get scared, remove the import, and move the file back to its place. You may find on the web the solutions suggesting to add configurations like `"node": { "net": "empty", "tls": "empty", "perf_hooks": "empty", "fs": "empty" }` or `"browser": { "net": false, "tls": false, "perf_hooks": false, "fs": false }` into `package.json` or to the webpack config, but these may not help you. **The main issue likely lies in the following:** You've triggered client-side code. For example, you might have a hook file in the `utils` folder with a corresponding `useEffect` React hook. To debug, try using the global search functionality in the IDE. Note that commenting out the lines may not be the quickest solution in this case, unlike in other debugging scenarios.
-
-- **RQ19:** I love all kinds of interesting things! Can you recommend any cool VSCode extensions? **RA19:** Of course! Just replace the current code in `.vscode/extensions.json` with the one from `addons/scripts/reliverse/presets/vscode/[default|minimal|ultimate]/extensions.json`. Remember, performance issues are possible, so you can just install what you want. Alternatively, you can just run the `pnpm reli:vscode` command to switch easily, and use `Cmd/Ctrl+Shift+P` ➞ `>Extensions: Show Recommended Extensions`.
-
-  The best way to install this opinionated list of extensions, which are in the `ultimate` preset (although `default` is recommended by us), is to open the project folder in VSCode. Then, install them by using `Ctrl+Shift+P` (or just `F1`) and typing `>Extensions: Show Recommended Extensions`. Click on the cloud icon (`Install Workspace Recommended Extensions`). Wait for the completion. Click `File > Exit` (this will save all your open windows). Open VSCode again, and you are ready to go. The configuration for these extensions is already prepared for you. You can learn more about these extensions, which the `ultimate` preset contains, on the corresponding pages.
-
-  *And, remember! If you have something broken, you always can find the default files content of `.vscode` folder in the `.vscode/presets/default` folder.*
-
-  <details>
-    <summary>[Reveal the spoiler]</summary>
-
-  This list may be outdated, and will be updated in Relivator v1.3.x.
-
-  1. [aaron-bond.better-comments](https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments)
-  2. [adpyke.codesnap](https://marketplace.visualstudio.com/items?itemName=adpyke.codesnap)
-  3. [astro-build.houston](https://marketplace.visualstudio.com/items?itemName=astro-build.houston)
-  4. [biomejs.biome](https://marketplace.visualstudio.com/items?itemName=biomejs.biome)
-  5. [bradlc.vscode-tailwindcss](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss) // tw v3 == release version | tw v4 == pre-release version
-  6. [chunsen.bracket-select](https://marketplace.visualstudio.com/items?itemName=chunsen.bracket-select)
-  7. [davidanson.vscode-markdownlint](https://marketplace.visualstudio.com/items?itemName=davidanson.vscode-markdownlint)
-  8. [dbaeumer.vscode-eslint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
-  9. [evondev.indent-rainbow-palettes](https://marketplace.visualstudio.com/items?itemName=evondev.indent-rainbow-palettes)
-  10. [fabiospampinato.vscode-open-multiple-files](https://marketplace.visualstudio.com/items?itemName=fabiospampinato.vscode-open-multiple-files)
-  11. [github.copilot-chat](https://marketplace.visualstudio.com/items?itemName=github.copilot-chat)
-  12. [github.github-vscode-theme](https://marketplace.visualstudio.com/items?itemName=github.github-vscode-theme)
-  13. [lokalise.i18n-ally](https://marketplace.visualstudio.com/items?itemName=lokalise.i18n-ally)
-  14. [mattpocock.ts-error-translator](https://marketplace.visualstudio.com/items?itemName=mattpocock.ts-error-translator)
-  15. [mikekscholz.pop-icon-theme](https://marketplace.visualstudio.com/items?itemName=mikekscholz.pop-icon-theme)
-  16. [mylesmurphy.prettify-ts](https://marketplace.visualstudio.com/items?itemName=mylesmurphy.prettify-ts)
-  17. [neptunedesign.vs-sequential-number](https://marketplace.visualstudio.com/items?itemName=neptunedesign.vs-sequential-number)
-  18. [oderwat.indent-rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow)
-  19. [streetsidesoftware.code-spell-checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)
-  20. [unifiedjs.vscode-mdx](https://marketplace.visualstudio.com/items?itemName=unifiedjs.vscode-mdx)
-  21. [usernamehw.errorlens](https://marketplace.visualstudio.com/items?itemName=usernamehw.errorlens)
-  22. [usernamehw.remove-empty-lines](https://marketplace.visualstudio.com/items?itemName=usernamehw.remove-empty-lines)
-  23. [yoavbls.pretty-ts-errors](https://marketplace.visualstudio.com/items?itemName=yoavbls.pretty-ts-errors)
-  24. [yzhang.markdown-all-in-one](https://marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one)
-  25. [zardoy.ts-essential-plugins](https://marketplace.visualstudio.com/items?itemName=zardoy.ts-essential-plugins)
-
-  **"TypeScript Essential Plugins" Extension Notes**: You can configure extension settings by opening VSCode Settings UI and searching for `@ext:zardoy.ts-essential-plugins` there. The quote from [VSCode Extension Repository](https://github.com/zardoy/typescript-vscode-plugins#readme): «Feature-complete TypeScript plugin that improves every single builtin feature such as completions, definitions, references and so on, and also adds even new TypeScript killer features, so you can work with large codebases faster! We make completions more informative. Definitions, references (and sometimes even completions) less noisy. And finally our main goal is to provide most customizable TypeScript experience for IDE features.»
-
-  </details>
-
-- **RQ20:** *[Related to the previous question]* How can I improve my visual experience with VSCode? **RA20:** The project already has a well-configured `.vscode/settings.json`, but we recommend using our very opinionated configs presets. You have choice to install `default` or `ultimate` (`default` is recommended). **To activate the preset run `pnpm reli:vscode`.** For `ultimate` preset don't forget to install the required stuff: the static, means not variable, versions of [JetBrains Mono](https://jetbrains.com/lp/mono) (recommended) and/or [Geist Mono](https://vercel.com/font) and/or [Monaspace](https://monaspace.githubnext.com) (small manual configuration not or may be needed if you don't want to use `JetBrains Mono` on `ultimate` preset). Next, for `ultimate`, install the recommended `pop-icon-theme` VSCode icons pack extension. Finally, make sure to install the extensions from `Q19`, especially, install the recommended by us `GitHub Light` and `Houston` (by Astro developers) themes. Please note that after installing the Houston theme, you will find a new corresponding tab on the sidebar (🧑‍🚀 there is your new friend, which reacts while you've code issues!), you can of course remove this tab by right-clicking, but we recommend simply dragging this panel to the bottom of the Folders tab.
-
-  - TODO: Fix 'Geist Mono' and 'Monaspace Argon Var', which looks like use Medium/Bold variation instead of Regular (`"editor.fontWeight": "normal"` doesn't help here). 'JetBrains Mono' works fine.*
-  - TODO: Do we really need to duplicate fonts for every single thing?* 🤔
-
-<!--
-  - **RQ??:** [Related to the previous question] Why did you switch the behavior of the `Cmd/Ctrl` and `alt/opt` keys?
-    **RA??:** Please note that you may need to press Cmd/Ctrl+S a few times to have the code fully fixed by various tools.
--->
-
-<!--
-  - **RQ??:** [Relivator 1.3.0] How can I improve the experience with the CSpell (Code Spell Checker) extension?
-    **RA??:** Install the [CSpell VSCode extension](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker), install the CSpell npm package as a dev dependency if it's not installed (check your `package.json` file), install the necessary packages using your package manager (by using `npx nypm add -D @cspell/dict-companies @cspell/dict-de-de @cspell/dict-es-es @cspell/dict-fr-fr @cspell/dict-fullstack @cspell/dict-it-it @cspell/dict-markdown @cspell/dict-npm @cspell/dict-pl_pl @cspell/dict-tr-tr @cspell/dict-typescript @cspell/dict-uk-ua cspell`), and add these lines to the `cspell.json` file:
-
-    ```json
-    {
-      "import": [
-        "@cspell/dict-typescript/cspell-ext.json",
-        "@cspell/dict-companies/cspell-ext.json",
-        "@cspell/dict-fullstack/cspell-ext.json",
-        "@cspell/dict-markdown/cspell-ext.json",
-        "@cspell/dict-npm/cspell-ext.json",
-        "@cspell/dict-de-de/cspell-ext.json",
-        "@cspell/dict-es-es/cspell-ext.json",
-        "@cspell/dict-fr-fr/cspell-ext.json",
-        "@cspell/dict-it-it/cspell-ext.json",
-        "@cspell/dict-pl_pl/cspell-ext.json",
-        "@cspell/dict-tr-tr/cspell-ext.json",
-        "@cspell/dict-uk-ua/cspell-ext.json"
-      ]
-    }
-    ```
--->
-
-- **RQ21:** How do I switch the package manager from `pnpm` to bun, yarn, or npm? **RA21:** Here's a variant of `scripts` for `bun`, but it not tested too much by us. Scripts presets for other package managers coming with Relivator 1.3.0. Just replace it in `package.json` (and make sure it don't miss anything).
-
-  <details>
-    <summary>[Reveal the spoiler]</summary>
-
-  Just find and remove `packageManager` key, if present, and then replace only these specific lines by bun's alternatives:
-
-  ```json
-  {
-    "scripts": {
-      "check:compiler": "bunx react-compiler-healthcheck@latest",
-      "fix:codemod-next-community": "bunx @next/codemod --dry --print",
-      "fix:codemod-react": "bunx codemod react/19/replace-use-form-state --target src",
-      "install:global": "bun add -g vercel@latest codemod@latest eslint_d@latest",
-      "latest:all": "bun update --latest",
-      "putout:dont-run-manually": "bun lint:putout . --fix",
-      "reli:prepare": "bun install && bun latest && bun appts",
-      "rm:other": "bun fse remove .million && bun fse remove .eslintcache && bun fse remove tsconfig.tsbuildinfo"
-    }
-  }
-  ```
-
-  </details>
-
-  After you have replaced the scripts, open the project folder and close VSCode. Delete `node_modules` and `pnpm-lock.yaml`. Open the project in a terminal and run `npx nypm install`. After that, you can reopen VSCode. You're done!
-
-- **RQ22:** I applied the `default`/`ultimate` preset settings in VSCode, and now my IDE is slow when I save a file. **RA22:** Go to the keybindings in VSCode, set `Save without Formatting` to `Ctrl+S` (`Cmd+S`), and `File: Save` to `Ctrl+Shift+S` (`Cmd+Shift+S`). Don't worry if the code might be messy when saving without formatting. Just run pnpm appts and everything will be improved and formatted. You're welcome! P.S. You can also read the VSCode's [Performance Issues](https://github.com/microsoft/vscode/wiki/Performance-Issues) article.
-
-  <details>
-    <summary>[Reveal the spoiler]</summary>
-
-  **keybindings.json** (`F1`->`>Preferences: Open Keyboard Shortcuts (JSON)`):
-
-  ```json
-  [{
-    "command": "workbench.action.files.save",
-    "key": "ctrl+shift+s"
-  }, {
-    "command": "workbench.action.files.saveWithoutFormatting",
-    "key": "ctrl+s"
-  }, {
-    "command": "workbench.action.nextEditor",
-    "key": "ctrl+tab"
-  }, {
-    "command": "workbench.action.previousEditor",
-    "key": "ctrl+shift+tab"
-  }]
-  ```
-
-  </details>
-
-- **RQ23:** What does index.ts do in the server and utils folders? **RA23:** These are called barrel files. You can make imports more convenient in your project by using the barrel approach. To do this, use index.ts files to re-export items from other files. Please note: keep code that can only run on the server in the server folder. Code that can run on both the server and client sides should be kept in the utils folder. Relivator 1.2.6 currently violates this description, so we should fix it in v1.3.0. Typically, server functions look like getDoSomething. Additionally, do not import code from the server folder into .tsx files that use React Hooks (useHookName), except when the component has useTransition or similar, which allows you to perform a server action from within the client component.
-
-- **RQ24:** Why do I see console.[log|info|warn|error|...] only in the browser console and not in the terminal from which the application was launched? **RA24:** If I (@blefnk) researched correctly, it is because you are calling console() in a client-side component (which has the "use client" directive at the top of the file or uses React Hooks). It looks like the terminal works as a server environment. Try calling console() in a file that does not have that directive and hooks. Or just use toasts which works nice with both on the client and the server side.
-
-- **RQ25:** I'm getting strange VSCode extension errors, what should I do? **RA25:** Don't worry, these are just editor anomalies. **Just restart your VSCode, and you're done.** Sometimes, due to insufficient RAM, internal extension failures, or other reasons, a particular extension might crash. Especially anomalous is the notification from TypeScript ESLint stating that it can have no more than 8 entry files (we will try to fix this in 1.3.0). Or Biome might start linting `node_modules` for some reason, which is also strange to us; our attempts to fix this so far have been unsuccessful, but we will try again in 13.0. Besides this, an extension crash might also happen if you just used `pnpm reli:setup` and didn't restart the editor. Or if you manually edited a configuration file and since autosave was enabled, the editor managed to send the configuration with syntax errors to the extension, causing everything to crash. So, restart VSCode, and everything will be fixed! If that doesn't help, check if your configuration files have any issues.
-
-- **RQ26:** How do I change VSCode's panel position? **RA26:** Just right-click on the panel, select `Panel Position`, and choose the desired position, e.g., `Bottom`.
-
-- **RQ27:** I have the correct data (key-value) specified in the `.env` file, but a certain library, for example, Clerk, does not see this data or sees outdated data. What can I do? **RA27:** The simplest solution is to just rename your project folder, run `pnpm install`, and check if the issue is resolved. Otherwise, contact the technical support and community of the respective library.
-
-- **RQ28:** How can I configure `pnpm` or `bun` (as package manager) for my needs? **RA28:** You can visit [this `pnpm` page](https://pnpm.io/package_json) or [this `bun` page](https://bun.sh/docs/runtime/bunfig#package-manager) in the official docs to learn more.
-
-**RQ29:** Should I modify the components by [shadcn/ui](https://ui.shadcn.com) (as of Relivator 1.2.6, they are located in the `"addons/components/ui"` folder)? **RA29:** You may lose your changes if @shadcn or [Reliverse](https://github.com/orgs/reliverse/repositories) updates any of these components in the release of Relivator 1.3.x+. Therefore, the best option currently is to use, for example, the `"addons/cluster/reliverse/shadcn/ui"` folder, where you can have files that you can safely overwrite the original files with, ensuring you do not lose your changes. As an example, this folder already contains a `cluster-readme.tsx` file, which only re-exports the original `button.tsx` file. So, you can create a `button.tsx` file here and copy and paste that line into your newly created file. Alternatively, you can duplicate the code from the original file and make any modifications you want. Use `Cmd/Ctrl+Shift+H` and simply replace `addons/components/ui` with `addons/cluster/reliverse/shadcn/ui` (the difference is only in the words `"browser"` and `"cluster"`). `addons/cluster` is your house; feel free to do anything you want here, mess it up or tidy it up as you wish. This is your own house, and no one has the right to take it away from you.
-
-- **RQ30:** Which command allows me to easily manage the installation of dependencies in a project? **RA30:** `pnpm deps:install`. However, before running this script, you should manually install the essentials:
-
-  - npx nypm add typescript tsx nypm @mnrendra/read-package @clack/prompts
-  - npx nypm add fs-extra pathe fast-npm-meta semver @types/semver redrun axios
-  - bun|yarn|pnpm dlx jsr add @reliverse/core (or: npx jsr add @reliverse/core)
-
-- **RQ31:** I noticed a [Turborepo](https://turbo.build) file named `turbo.disabled.json`. How can I reactivate `turbo`? **RA31:** Simply remove the `.disabled` from the filename. You can also add the `"scripts"` from the `turbo.scripts.json` file to the `package.json` file (if they are not already there).
-
-- **RQ32:** Where can I find out more details about the Relivator and Reliverse? **RA32:** Read the current README.md file to learn more about each specific aspect of the project. You can also find more information on the project's [Discord](https://discord.gg/Pb8uKbwpsJ) server and on the [GitHub Issues](https://github.com/blefnk/relivator-nextjs-template/issues) page.
-
-## Details
-
-🌐 <https://relivator.com>
-
-<img src="/public/screenshot-dark.png" width="600" alt="Screenshot showing the main page of the Relivator project">
-
-We've laid the groundwork—now it's time to dive in and accelerate development. And yeah, have fun! Think of Relivator and Reliverse as a sandbox! It's like Minecraft; with Relivator, you can build anything, as creativity knows no bounds! Explore all the new features of Next.js 13-15 and many other web technologies right here, right now—with Relivator.
-
-> ~~Minecraft~~ Reliverse is to a large degree about having unique experiences that nobody else has had. The ~~levels~~ website templates are ~~randomly~~ elegantly ~~generated~~ bootstrapped, and you can build anything you want to build yourself. © ~~Markus Persson~~ [@blefnk](https://github.com/blefnk)
-
-For real, if you've been exploring which Next.js starter to select for your next project–the search can end here. **If you want a POWERHOUSE**—Relivator is suitable for every scenario—then **Relivator is definitely the starter you need**. Fork it right now! Relivator incorporates numerous features found in other templates and strives to push the limits of Next.js and React capabilities. With Relivator, the opportunities are boundless!
-
-You can even think of Relivator as a Next.js framework! So grab it and enjoy! And don't forget: feedback and stars mean the world to us. Hit that star button! Fork it! Your involvement propels the project to new heights! If you have coding skills, contributions are always welcome!
-
-If you run into issues, join our repository discussions, open an issue, or DM us on: [Discord](https://discord.gg/Pb8uKbwpsJ), [Twitter/X](https://x.com/blefnk), [Fiverr](https://fiverr.com/blefnk), [LinkedIn](https://linkedin.com/in/blefnk), or [Facebook](https://facebook.com/blefnk).
-
-This project has big plans, and we appreciate all the help we can get! If you're eager to contribute, check out the Project Roadmap above to see potential improvements for the project. Also, use `Cmd/Ctrl+Shift+F` in VSCode and search for `TODO:` to find areas that need attention. Please visit the **[Issues](https://github.com/blefnk/relivator-nextjs-template/issues)** tab for more opportunities to help out.
-
-## Project Structure
-
-**Only a few of the files are listed here.** This section will be updated in the future versions.
-
-- [.vscode](https://code.visualstudio.com)
-  - presets
-  - [extensions.json](https://code.visualstudio.com/docs/editor/extension-marketplace)
-  - [launch.json](https://code.visualstudio.com/docs/nodejs/nodejs-debugging#_launch-configuration-attributes)
-  - [settings.json](https://code.visualstudio.com/docs/getstarted/settings)
-- src
-  - [env.js](https://create.t3.gg/en/usage/env-variables)
-  - [middleware.ts](https://nextjs.org/docs/app/building-your-application/routing/middleware)
-  - ...
-- [biome.json](https://biomejs.dev/reference/configuration)
-- [cspell.json](https://cspell.org/configuration)
-- [eslint.config.js](https://eslint.org/docs/latest/use/configure/configuration-files)
-- [knip.json](https://knip.dev/reference/configuration)
-- [next.config.js](https://nextjs.org/docs/app/api-reference/next-config-js)
-- [package.json](https://docs.npmjs.com/cli/v10/configuring-npm/package-json)
-- [README.md](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax)
-- [reliverse.config.ts](https://github.com/blefnk/reliverse)
-- [reset.d.ts](https://totaltypescript.com/ts-reset)
-- [tsconfig.json](https://typescriptlang.org/docs/handbook/tsconfig-json.html)
-- [typestat.json](https://github.com/JoshuaKGoldberg/TypeStat#readme)
-- ...
-
-## Configuration
-
-**First thing first, refer to the [`.env.example`](.env.example) file as the guide. Simply copy data from it to a new `.env` file.**
-
-*The instructions below may be outdated, so please double-check them! We will fully update this README.md with the Relivator 1.3.0 release.*
-
-🎉 Everything is optional in `.env` file starting from Relivator 1.2.6! You can deploy Relivator without a .env file! But ensure you verify what's necessary. Though the application will run without certain variables, missing ones may deactivate specific features.
-
-Ensure that default values are defined for essential environment variables. Never store secrets in the `.env.example` file. For newcomers or repo cloners, use `.env.example` as a template to create the `.env` file, ensuring it's never committed. Update the schema in `/src/env.js` when adding new variables.
-
-Further [information about environment variables is available here](https://nextjs.org/docs/app/building-the-application/configuring/environment-variables).
-
-*A cleaner and improved version of this section is coming soon. Stay tuned!*
-
-In the 1.1.0 Relivator release, the `.env.example` file was greatly simplified and will be streamlined even further in upcoming versions. We aim to ensure that unspecified values will simply deactivate related functionality without halting app compilation.
-
-## Payments
-
-Refer to the [`.env.example`](.env.example) file as the guide for where and how to get all the important environment variable keys for Stripe, including webhooks for both localhost and deployment.
-
-Locally, install the [Stripe CLI](https://stripe.com/docs/stripe-cli) and run the command `pnpm stripe:listen` to initiate the Stripe webhook listener. This action connects Stripe to the account and generates a webhook key, which you can then set as an environment variable in Stripe's settings.
-
-When testing Stripe, you can use its test data: `4242424242424242` | `12/34` | `567` | `Random Name` | `Random Country`.
-
-Please refer to the [src/app/api/webhooks/stripe/route.ts](src/app/api/webhooks/stripe/route.ts) file for more details on how Stripe works in the app. You can also visit the [official Stripe repository](https://github.com/stripe/stripe-node#readme), where you'll find a lot of useful information.
-
-## Database
-
-Relivator uses [Drizzle ORM](https://orm.drizzle.team) for database management. By default, the project uses [Neon](https://neon.tech) (Serverless) with [PostgreSQL](https://neon.tech/docs/postgresql/introduction) as the database provider. The project has already followed [Drizzle's guide](https://orm.drizzle.team/learn/tutorials/drizzle-with-neon) on how to set up Drizzle with Neon Postgres.
-
-**August 4, 2024: Hot Update**:
-
-If you use `neon` as your database provider, you no longer need `pnpm db:studio`; simply use Drizzle Studio on [Neon's website](https://neon.tech) 🎉
-
-For development databases without important data, you can use `pnpm db:push`. For production databases containing important data, it is recommended to use `pnpm db:generate` followed by `pnpm db:migrate`.
-
-> Drizzle Kit lets you alter you database schema and rapidly move forward with a [pnpm db:push](https://orm.drizzle.team/kit-docs/overview#prototyping-with-db-push) command. That’s very handy when you have remote databases like Neon, Planetscale or Turso. The 'push' command is ideal for quickly testing new schema designs or changes in a local development environment, allowing fast iterations without the overhead of managing migration files. © [Drizzle Team](https://orm.drizzle.team/learn/tutorials/drizzle-with-neon)
-
-**Drizzle Team**: If you want to iterate quickly during local development or if your project doesn’t require migration files, Drizzle offers a useful command called drizzle-kit push. **When do you need to use the ‘push’ command?** **1.** During the prototyping and experimentation phase of your schema on a local environment. **2.** When you are utilizing an external provider that manages migrations and schema changes for you (e.g., PlanetScale). **3.** If you are comfortable modifying the database schema before your code changes can be deployed.
-
-**Note**: NEXT_PUBLIC_DB_PROVIDER was removed in Relivator v1.2.6. To switch the provider from Neon, modify `drizzle.config.ts`. To use MySQL or LibSQL providers, update the files inside `src/db`. An automatic switcher is coming in Relivator version 1.3.x.
-
-*The instructions below may be outdated, so please double-check them! We will fully update this README.md with the Relivator 1.3.0 release.*
-
-Relivator is designed to effortlessly support both MySQL and PostgreSQL databases. While PostgreSQL and [Neon](https://neon.tech) are the default configurations, switching to MySQL provided by [Railway](https://railway.app?referralCode=sATgpf) or [PlanetScale](https://planetscale.com), or to PostgreSQL provided by [Railway](https://railway.app?referralCode=sATgpf) or [Vercel](https://vercel.com/storage/postgres) is straightforward. Adjust the database configuration inside [drizzle.config.ts](./drizzle.config.ts) and the `src/db/*` files accordingly. Although Relivator is optimized for these providers, other providers compatible with Drizzle and Auth.js (next-auth@beta/NextAuth.js) might also work with some additional setup. Full SQLite support is coming soon.
-
-To set up the `DATABASE_URL` in the `.env` file, refer to `.env.example`. Initiate a new database or propagate schema changes by executing the `pnpm db:push` command. This ensures that all changes made to the schema files in `src/db/*` are mirrored in the selected database provider.
-
-For database migrations, use the `pnpm db:generate` command, review the `drizzle` folder to ensure everything is correct, and run the `pnpm db:migrate` command when ready. If necessary, use `pnpm db:drop` to manage reversals in a controlled way.
-
-If you used Relivator before v1.2.6, you may remove the `drizzle` folder inside the root directory. **Possible outdated information:** Do not manually delete files from the `drizzle` directory. Instead, use the [`pnpm db:drop` command](https://orm.drizzle.team/kit-docs/commands#drop-migration) if a migration needs to be reversed.
-
-We ensure consistent database configuration by using the setup inside `drizzle.config.ts` and exporting configurations in `src/db/index.ts` and `src/db/schema/index.ts`. When selecting a database provider, comment out or remove unneeded providers in the `switch-case` of these files and remove related schema files as necessary. Additional adjustments in other files may also be required. An automatic switcher is coming soon in the Relivator v1.3.0 release.
-
-**Historical context**: In Relivator v1.1.0, we aimed to provide simultaneous support for both MySQL and PostgreSQL for Drizzle ORM. In future releases, we plan to integrate Prisma ORM, making the project even more inclusive.
-
-## Product Categories and Subcategories
-
-To edit product categories, please refer to the `MySQL`, `PostgreSQL`, or `LibSQL` corresponding schema file in the `src/db/schema` folder.
-
-After editing these files, don't forget to run `pnpm db:push` to apply the changes. Or run `pnpm generate` to create a sharable SQL, which another developers may apply with `pnpm migrate` to edit theirs database tables easily.
-
-Then, simply update the category names and subcategories in the [products file](src/constants/products.ts) accordingly.
-
-## Additional Notes About Stripe
-
-*The instructions below may be outdated, so please double-check them! We will fully update this README.md with the Relivator 1.3.0 release.*
-
-The Stripe webhook API route does not need to be invoked explicitly within the application, such as after a user selects a subscription plan or makes a purchase. Webhooks operate independently of user actions on the frontend and serve as a means for Stripe to relay events directly to the server.
-
-When an event occurs on Stripe's end, such as a successful payment, Stripe generates an event object. This object is then automatically sent to the endpoint you've specified, either in the Stripe Dashboard or, for testing purposes, in the `package.json` via the Stripe CLI. Finally, the server's API route receives the event and processes it accordingly.
-
-For example, when a user selects a subscription plan, you would typically first use Stripe's API to create either a `Payment Intent` or `Setup Intent` object. This action can be executed either on the client-side or the server-side. The frontend then confirms the payment using Stripe.js, thereby completing the payment or subscription setup process.
-
-The webhook is automatically triggered based on these events. There's no need to manually "call" the webhook route; Stripe manages this for you according to the settings in the Stripe Dashboard or in the `package.json` for local testing.
-
-After deploying the app, don't forget to specify the webhook URL in the Stripe Dashboard. Navigate to the Webhooks section and enter the following URL: `https://thedomain.com/api/webhooks/stripe`.
-
-In summary, there's no need to specify the path to the Stripe API route where the user selects a subscription plan. The webhook mechanism operates independently and is triggered automatically by Stripe.
-
-## Internationalization
-
-*Stay tuned for further expansions to this section in the future.*
-
-*The instructions below may be outdated, so please double-check them! We will fully update this README.md with the Relivator 1.3.0 release.*
-
-Multilingualism at Bleverse Reliverse vision is revered. We adore discussing it and plan to delve into the topic of Next.js 15 App Router internationalization in future writings.
-
-Presently, all languages are machine-translated. Future revisions by native speakers are planned.
-
-useTranslations works both on the server and client; we only need the getTranslations on async components.
-
-*Currently not available.* Use `pnpm lint:i18n` to verify the i18n files. The tool attempts to rectify issues when possible, offering features like ascending sort. No output means everything is in order.
-
-We are using *next-intl* for internationalization. Sometime we can use beta/rc versions as needed. Find more information about it [here](https://next-intl-docs.vercel.app/blog/next-intl-3-0) and [here](https://github.com/amannn/next-intl/pull/149).
-
-### How to add a new language
-
-*The process described below will be simplified and automated in the future. Please let us know if you have any further questions regarding the current process for adding languages.*
-
-1. We will need an [i18n code](https://saimana.com/list-of-country-locale-code/) (in the format `language-country`; the language code alone is sufficient, but it's not optimal for SEO). For example, let's take Chinese, for which I know the codes *zh-cn/zh-tw/zh-hk* are used.
-2. Open the `messages` folder and create a `zh-cn.json` file with the example content: `{ "metadata": { "description": "建立更高效、更吸引人且更有利可图的在线商店：使用 Relivator" } }`.
-3. Now open `src/i18n.ts` and add `"zh-cn": zh_cn` with the appropriate `import` at the top.
-4. In the file `src/navigation.ts`, add the corresponding values to `locales` and `labels`.
-5. Run `pnpm dev` and review the landing page header. If it appears correctly, you're ready to go.
-6. Optionally, I recommend using the VSCode extension [i18n Ally](https://marketplace.visualstudio.com/items?itemName=Lokalise.i18n-ally), which makes machine translation easy.
-7. Also optionally, install [specific CSpell language](https://github.com/streetsidesoftware/cspell-dicts#language-dictionaries) for full support of this language in VSCode (when using the "[Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)" extension). If the language is not available, try to find a word dictionary file on the web or make a new one (see CSpell docs).
-
-By the way, **if the country flag is not displayed**: open `src/localization-main.tsx`, go to *LocaleFlagIcon* and add the `else if`. Please visit the [flag-icons library website](https://flagicons.lipis.dev/) to see the code for the missing icon. The example for *zh-cn* will be: `} else if (baseLocale === "zh") { return <span aria-hidden="true" className="fi fi-cn mr-2" />; }`
-
-Please be aware that both the "i18n Ally" VSCode extension and manual systems like "Google Translate" may incorrectly translate variables. If you encounter an error like this:
-Original Message: 'The intl string context variable "类别" was not provided to the string "购买最好的{类别}"'.
-This error occurs because we have {类别}, but it should be {category}. To verify the correct variable, refer to the en-us.json file.Certainly! So the correct version for this specific case will be:
-
-```json
-{
-  "categories": {
-    "buyFromCategories": "从最好的商店购买 {category}",
-    "buyProducts": "购买 ${category} 类别的产品",
-    "buyTheBest": "购买最好的 {category}"
-  }
-}
-```
-
-**Currently supported locales (you can add the own manually):**
-
-- de, en, es, ms, fr, hi, it, pl, tr, uk, zh.
-- de-DE, en-US, es-ES, ms-MY, fr-FR, hi-IN, it-IT, pl-PL, tr-TR, uk-UA, zh-CN.
-
-## Principles, Design Decisions, Code Insights, Recommendations
-
-> «There are a lot of impractical things about owning a ~~Porsche~~ Relivator. But they're all offset by the driving experience. It really is unique. ~~Lamborghinis~~ create-t3-app and ~~Ferraris~~ Vercel Store come close. And they are more powerful in specific cases, but they don't handle like a ~~Porsche~~ Relivator.» © ~~Kevin O'Leary~~ [@blefnk](https://github.com/blefnk)
-
-*We're continuously improving this section. Contributions are welcomed!*
-
-Our starter aims to be a rich resource for developers at all stages of their journey. Within the comment blocks and dedicated sections at the end of select files, you'll find valuable insights and clarifications on a wide array of topics. Contributions to enhancing these educational nuggets are highly encouraged!
-
-**Principles (W.I.P):**
-
-- [ ] Prettier's principle over linters related to developer experience ([source](https://prettier.io/docs/en/integrating-with-linters.html#notes)): "You end up with a lot of red squiggly lines in the editor, which gets annoying. Prettier is supposed to make you forget about formatting – and not be in the face about it!"
-- [ ] Every file and component should be built consciously, using [KISS/DRY/SOLID/YAGNI principles](https://blog.openreplay.com/applying-design-principles-in-react) with a certain sense of intelligence, and with performance in mind.
-- [ ] We need to think of the project as if it were a planet with its own continents, countries, cities, rooms, individuals, entities, etc.
-
-**Advanced Environment Variables:**
-
-The `.env.example` file covers all the essential variables for a fully functional website, tailored for beginners. However, if you require advanced configurations, you can modify any value in the `.env` file as needed.
-
-**About the Plugins Folder:**
-
-This folder contains optional plugins for Relivator. Developed by @blefnk and other contributors, these plugins extend functionality and provide additional features. If you find that certain plugins are not beneficial for the project, feel free to remove their corresponding folders.
-
-**Function Over Const for Components:**
-
-We advocate the use of the `function` keyword instead of `const` when defining React components. Using `function` often improves stack traces, making debugging easier. Additionally, it makes code semantics more explicit, thereby making it easier for other developers to understand the intentions.
-
-**Personal Recommendations:**
-
-We advise regularly clearing the browser cache and deleting the `.next` folder to ensure optimal performance and functionality.
-
-Currently, we don’t utilize Contentlayer due to its instability with Windows. Therefore, we're exploring options for its usage in the `.env` configuration file. Future plans might involve developing our own solution for content writing. Integration with external providers, such as Sanity, may also be a future feature, with corresponding enable/disable options.
-
-NOTE from the [Contentlayer Issues Page](https://github.com/contentlayerdev/contentlayer/issues/313#issuecomment-1305424923): Contentlayer doesn't work well with `next.config.mjs`, so you need to have `next.config.js`. Other libraries may also require this. If you're sure you need `.mjs` and don't plan to use Contentlayer, rename it.
-
-**Project Configuration:**
-
-The `src/app.ts` file hosts main configurations to modify website contents and settings, enabling you to:
-
-- Control the content presented on the website.
-- Adjust various settings, such as deactivating the theme toggle.
-- Manage generic site-wide information.
-
-Customize this file as per the requirements.
-
-**Authentication:**
-
-Setting up authentication is straightforward.
-
-You can configure available sign-in providers for Clerk in the `src/app.ts` file.
-
-Please remember that Clerk fully works with third-party services like "Google PageSpeed Insight" only when domain and live keys are used.
-
-*This section will be implemented soon.*
-
-**TypeScript Config:**
-
-In the `tsconfig.json` file you can set the options for the TypeScript compiler. You can hover over on each option to get more information about. Hint: You can also press Shift+Space to get auto-completion. Learn more by checking the official TypeScript documentation: @see <https://typescriptlang.org/docs/handbook/tsconfig-json> @see <https://totaltypescript.com/tsconfig-cheat-sheet>.
-
-Next.js has built-in support for TypeScript, using plugin below. But while you use `pnpm build`, it stops on the first type errors. So you can use `pnpm typecheck` to check all type warns/errors at once.
-
-Config includes Atomic CSS plugin in the style attribute. Type-safe static styles with theming, responsive variant support, and no bundler integration. @see <https://github.com/tokenami/tokenami#readme>.
-
-You can enable strict type checking in MDX files by setting `mdx.checkMdx` to true.
-
-These options below can be dangerously set to false, while you're incrementally move to full type-safety.
-
-```json
-{
-  "alwaysStrict": true,
-  "noImplicitAny": false,
-  "strict": true,
-  "strictNullChecks": true,
-  "strictPropertyInitialization": true,
-  "verbatimModuleSyntax": true
-}
-```
-
-**How to Deploy the Project:**
-
-Please check the *How to Install and Get Started* section before making the initial deployment.
-
-Consult the deployment guides for [Vercel](https://create.t3.gg/en/deployment/vercel), [Netlify](https://create.t3.gg/en/deployment/netlify), and [Docker](https://create.t3.gg/en/deployment/docker) for further details. The project has only been tested on Vercel; please inform us if you encounter issues with other deployment services.
-
-**Styling, Design System, UI Components:**
-
-TODO: Implement design system and style guide.
-
-By default, this project includes components from various libraries, as well as unstyled [shadcn/ui](https://ui.shadcn.com) components. Shadcn/ui even allows you to generate new UI components using its CLI (where "button" can be any Shadcn UI element): `pnpm dlx shadcn-ui@latest add button`.
-
-W.I.P. — Use `pnpm css` to watch for [CSS tokens](https://blog.devgenius.io/link-figma-and-react-using-figma-tokens-89e6cc874b4d) in accordance with the project's design system. [Tokenami](https://github.com/tokenami/tokenami#readme) and Figma are anticipated to be utilized for this concept. For additional information, refer to points #33 and #90 in the Relivator's Roadmap.
-
-**Package Manager Compatibility:**
-
-`Relivator` can already harness some fantastic **[`Bun`](https://bun.sh)** features. For this starter, we currently recommend using `pnpm`. Full pnpm support and compatibility will be shipped as soon as [Reliverse](https://github.com/blefnk/reliverse)'s [Relivator](https://github.com/blefnk/relivator) achieves full similarity with Relivator. *Section expansion coming soon.*
-
-**Recommended Things to Learn:**
-
-1. [The Detailed Git Guide](https://github.com/blefnk/relivator-nextjs-template/blob/main/.github/GITGUIDE.md) by [Nazar Kornienko @Blefnk](https://github.com/blefnk)
-2. [Introduction to Next.js and React](https://youtube.com/watch?v=h2BcitZPMn4) by [Lee Robinson](https://x.com/leeerob)
-3. [Relivator: Next.js 15 Starter (Release Announce of Relivator on Medium)](https://cutt.ly/awf6fScS) by [Nazar Kornienko @Blefnk](https://github.com/blefnk)
-4. [Welcome to the Wild World of TypeScript, Mate! Is it scary?](https://cutt.ly/CwjVPUNu) by [Nazar Kornienko @Blefnk](https://github.com/blefnk)
-5. [React: Common Mistakes in 2023](https://docs.google.com/presentation/d/1kuBeSh-yTrL031IlmuwrZ8LvavOGzSbo) by [Cory House](https://x.com/housecor)
-6. [Thoughts on Next.js 13, Server Actions, Drizzle, Neon, Clerk, and More](https://github.com/Apestein/nextflix/blob/main/README.md#overall-thoughts) by [@Apestein](https://github.com/Apestein)
-7. [Huge Next-Multilingual Readme About i18n](https://github.com/Avansai/next-multilingual#readme) by [@Avansai](https://github.com/Avansai)
-8. [Applying Design Principles in React](https://blog.openreplay.com/applying-design-principles-in-react) by [Jeremiah (Jerry) Ezekwu](https://blog.openreplay.com/authors/jeremiah-\(jerry\)-ezekwu/)
-9. [The Power of Prototyping Code](https://medium.com/@joomiguelcunha/the-power-of-prototyping-code-55f4ed485a30) by [João Miguel Cunha](https://medium.com/@joomiguelcunha)
-10. [Software Prototyping](https://en.wikipedia.org/wiki/Software_prototyping) on Wikipedia
-11. [TDD: Test-driven development](https://en.wikipedia.org/wiki/Test-driven_development) on Wikipedia
-12. [React 19 RC Announcement](https://react.dev/blog/2024/04/25/react-19) by [React](https://react.dev)
-
-*More learning resources can be found within the files of this repository.*
-
-## Contributing
-
-*This section will be enhanced soon with simpler steps to get everything ready.*
-
-Contributions are warmly welcomed! We express our gratitude to everyone who has contributed to this repository. the contributions will be recognized. If you have any questions or suggestions, please open an issue. For more information, see the [contributing guide](.github/CONTRIBUTING.md).
-
-Please visit [this special wiki page](https://github.com/blefnk/relivator-nextjs-template/wiki/Project-Credits-&-Contributors) to view the full list of credits and contributors. To contribute to Relivator, follow these steps:
-
-1. Begin by reading the "How to Install and Get Started" section on the top of this repository, and by reading [CONTRIBUTING.md](.github/CONTRIBUTING.md) page.
-2. Create a branch: `git checkout -b <branch_name>`.
-3. Make and commit the changes: `git commit -m '<commit_message>'`
-4. Push to the original branch: `git push origin <branch_name>`
-5. Submit the pull request.
-
-Alternatively, check the GitHub docs on [how to create a pull request](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/creating-a-pull-request).
-
-## Roadmap
-
-*The roadmap below may be outdated. We will fully update this README.md with the Relivator 1.3.0 release.*
-
-*The roadmap below outlines the key features and improvements planned for this Next.js Reliverse starter and for Reliverse CLI. `Items not marked may already be configured` but might not have been thoroughly tested. If you spot any issues, please open an issue.*
-
-- [x] 1. Build on [Next.js 15](https://nextjs.org) [App Router](https://nextjs.org/docs/app) & [Route Handlers](https://nextjs.org/docs/app/building-the-application/routing/route-handlers), with [Million Lint](https://million.dev) and [Turbopack](https://turbo.build/pack) support (with optional [Turborepo v2](https://turbo.build/blog/turbo-2-0) for faster builds). Utilize [React 19](https://react.dev) (with the new [React Compiler](https://react.dev/learn/react-compiler) and [eslint-plugin-react-compiler](https://react.dev/learn/react-compiler#installing-eslint-plugin-react-compiler)), [TailwindCSS](https://tailwindcss.com), and [TypeScript 5](https://typescriptlang.org) as core technologies.
-- [x] 2. Implement [Drizzle ORM](https://orm.drizzle.team) to support **both MySQL and PostgreSQL** databases, and integrate with [Neon](https://neon.tech), [Railway](https://railway.app?referralCode=sATgpf), [PlanetScale](https://planetscale.com), and [Vercel](https://vercel.com) services.
-- [x] 3. Configure `next.config.js` with i18n, MDX, with both [Million.js Compiler & Million Lint](https://million.dev/blog/lint-rc) support. Enable these cool experiments: after, forceSwcTransforms, instrumentationHook (disabled by default), mdxRs, optimisticClientCache, [optimizePackageImports](https://nextjs.org/docs/app/api-reference/next-config-js/optimizePackageImports), optimizeServerReact, [ppr (Partial Prerendering)](https://nextjs.org/docs/app/api-reference/next-config-js/partial-prerendering), reactCompiler (disabled by default), serverMinification, turbo.
-- [x] 4. Aim for thorough documentation and a beginner-friendly approach throughout the project.
-- [x] 5. Configure and comment on `middleware.ts` for i18n and next-auth.
-- [x] 6. Set up a Content-Security-Policy (CSP) system to prevent XSS attacks (disabled by default).
-- [x] 7. Provide well-configured VSCode settings and recommended extensions (set `"extensions.ignoreRecommendations"` to `true` if you don't want to see the recommendations).
-- [x] 8. Optimize the [Next.js Metadata API](https://nextjs.org/docs/app/building-the-application/optimizing/metadata) for SEO, integrating file-system handlers.
-- [x] 9. Integrate a TailwindCSS screen size indicator for local project runs.
-- [x] 10. Implement extensive internationalization in 11 languages (English, German, Spanish, Persian, French, Hindi, Italian, Polish, Turkish, Ukrainian, Chinese) using the [next-intl](https://next-intl-docs.vercel.app) library, which works on both server and client, and include support for `next dev --turbo`.
-- [x] 11. Implement authentication through **both [Clerk](https://clerk.com) and [Auth.js (next-auth@beta/NextAuth.js)](https://authjs.dev)**.
-- [x] 12. Implement [tRPC](https://trpc.io) and [TanStack Query](https://tanstack.com/query) (with [React Normy](https://github.com/klis87/normy#readme)) for advanced server and client data fetching.
-- [x] 13. Establish a user subscription and checkout system using [Stripe](https://github.com/stripe/stripe-node#readme).
-- [x] 14. Ensure type-safety validations for project schemas and UI fields using the [zod](https://zod.dev) library.
-- [x] 15. Employ [ESLint v9](https://eslint.org) with [TypeScript-ESLint v8](https://typescript-eslint.io) and configure `eslint.config.js` (**Linting can take some time, so please be patient**) to work with both [Biome](https://biomejs.dev) ~~and [Prettier](https://prettier.io) (including the Sort Imports Prettier plugin)~~ for readable, clean, and safe code. **Currently not available | TODO:** use `pnpm ui:eslint` to open the [ESLint Flat Config Viewer](https://github.com/antfu/eslint-flat-config-viewer#eslint-flat-config-viewer) UI tool. **Note:** Starting Relivator 1.3.0 Prettier can be added manually by running `reliverse` command (read [the announcement](https://github.com/blefnk/relivator-nextjs-starter/issues/36)).
-- [x] 16. Elegantly implement the font system, utilizing [Inter](https://rsms.me/inter) and additional typefaces.
-- [x] 17. Develop a storefront, incorporating product, category, and subcategory functionality.
-- [x] 18. Design a modern, cleanly composed UI using [Radix](https://radix-ui.com), with attractive UI components from [shadcn/ui](https://ui.shadcn.com).
-- [x] 19. Compose a comprehensive, beginner-friendly `README.md`, including descriptions of [environment variables](https://nextjs.org/docs/basic-features/environment-variables).
-- [ ] 20. Realize blog functionality through the use of MDX files.
-- [ ] 21. Use absolute paths everywhere where applied in the project. The project has a predictable and consistent import logic, no unnecessary use of things like `import * as React`.
-- [ ] 22. Use [Kysely](https://kysely.dev) with Drizzle to achieve full TypeScript SQL query builder type-safety.
-- [ ] 23. Translate README.md and related files into more languages.
-- [ ] 24. Transform beyond a simple e-commerce store to become a universal website starter.
-- [ ] 25. Tidy up `package.json` with correctly installed and orderly sorted packages in `dependencies` and `devDependencies`.
-- [ ] 26. The project author should publish a series of detailed videos on how to use this project. There should also be some enthusiasts willing to publish their own videos about the project on their resources.
-- [ ] 27. Reduce the number of project packages, config files, and etc., as much as possible.
-- [ ] 28. Reduce HTML tag nesting and ensure correct usage of HTML tags whenever possible.
-- [ ] 29. Prioritize accessibility throughout, for both app user UI (User Interface) and UX (User Experience), as well as developers' DX (Developer Experience). Maintain usability without compromising aesthetics.
-- [ ] 30. Prefer using [const-arrow](https://freecodecamp.org/news/when-and-why-you-should-use-es6-arrow-functions-and-when-you-shouldnt-3d851d7f0b26) and [type](https://million.dev/docs/manual-mode/block) over [function](https://freecodecamp.org/news/the-difference-between-arrow-functions-and-normal-functions) and [interface](https://totaltypescript.com/type-vs-interface-which-should-you-use) where applicable, and vice versa where applicable correspondingly, with using helpful ESLint [arrow-functions](https://github.com/JamieMason/eslint-plugin-prefer-arrow-functions#readme) plugin, to maintain readable and clean code by adhering to specific [recommendations](https://youtu.be/nuML9SmdbJ4) for [functional programming](https://toptal.com/javascript/functional-programming-javascript).
-- [ ] 31. Optimize all app elements to improve dev cold start and build speeds.
-- [ ] 32. Move each related system to its special folder (into the `src/core` folder), so any system can be easily removed from the project as needed.
-- [ ] 33. Move component styles to .css or .scss files, or use packages that provide "syntactic sugar" for styles in .tsx files by using [tokenami](https://github.com/tokenami/tokenami#readme) CSS library. Implement possibility to implement [Figma Tokens System](https://blog.devgenius.io/link-figma-and-react-using-figma-tokens-89e6cc874b4d) to work seamlessly with the project. Tip: go to point #90 of this roadmap to learn more about new ways to use CSS-in-JS.
-- [ ] 34. Migrate to Auth.js (next-auth@beta/NextAuth.js)' [next-auth@beta](https://npmjs.com/package/next-auth?activeTab=versions) ([discussions](https://github.com/nextauthjs/next-auth/releases/tag/next-auth%405.0.0-beta.4)), and to [React 19](https://19.react.dev/blog/2024/04/25/react-19).
-- [ ] 35. Manage email verification, newsletter sign-ups, and email marketing via [Resend](https://resend.com) and [React Email](https://react.email).
-- [ ] 36. Make sure each page and the middleware are green or yellow, but not red, upon build in the development terminal.
-- [ ] 37. Make each environment variable optional, allowing the app to operate without anything configured, simply omitting specific code sections as necessary.
-- [ ] 38. Keep the project on the best possible way of writing good and clean code, by following guidelines like [Airbnb JavaScript Style Guide](https://github.com/airbnb/javascript/tree/master/react) / [Airbnb React/JSX Style Guide](https://github.com/airbnb/javascript/tree/master/react). Use `??` (nullish coalescing) everywhere instead of `||` (logical OR) (unless there's a good reason to use it in the specific cases) – [why we should use nullish coalescing](https://stackoverflow.com/questions/61480993/when-should-i-use-nullish-coalescing-vs-logical-or); (Is there any ESLint rule/plugin for that?).
-- [ ] 39. Keep the project free from things like `@ts-expect-error`, `eslint-disable`, `biome-ignore`, and others related not very safety things.
-- [ ] 40. Keep the cookie count as low as possible, prepare for a cookie-free future, implement cookie management and notifications.
-- [ ] 41. Introduce a comment system for products, including Review and Question types.
-- [ ] 42. Integrate valuable things from [Next.js' Examples](https://github.com/vercel/next.js/tree/canary/examples) into this project.
-- [ ] 43. Integrate valuable insights from [Next.js Weekly](https://nextjsweekly.com/issues) into this starter.
-- [ ] 44. Implement type-safe [GraphQL](https://hygraph.com/learn/graphql) support by using [Fuse.js](https://fusejs.org) framework.
-- [ ] 45. Implement the best things from [Payload CMS](https://github.com/payloadcms/payload) with Relivator's improvements.
-- [ ] 46. Implement Storybook 8.x support (read the "[Storybook for React Server Components](https://storybook.js.org/blog/storybook-react-server-components)" announcement).
-- [ ] 47. Implement smart and unified log system, both for development and production, both for console and writing to specific files.
-- [ ] 48. Implement Sentry to handle errors and CSP reports for the application.
-- [ ] 49. Implement Relivator's/Reliverse's own version of [Saas UI](https://saas-ui.dev) to be fully compatible with our project with only needed functionality, with using Tailwind and Shadcn instead of Chakra.
-- [ ] 50. Implement our own fork of [Radix Themes](https://radix-ui.com) library with set up `<main>` as wrapper instead of its current `<section>`; OR implement our very own solution which generates Tailwind instead of Radix's classes.
-- [ ] 51. Implement full [Million.js](https://million.dev) support (read [Million 3.0 Announcement](https://million.dev/blog/million-3) to learn more).
-- [ ] 52. Implement file uploads using [UploadThing](https://uploadthing.com) and [Cloudinary](https://cloudinary.com) (NOTE: "res.cloudinary.com" and "utfs.io" should be added to `nextConfig.images.remotePatterns`).
-- [ ] 53. Implement dynamic switching between app features, like database provider, by making corresponding checks for environment variables.
-- [ ] 54. Implement docs to the project and move each explanation from the code into that docs.
-- [ ] 55. Implement deep feature-parity and easy-migration compatibility with Reliverse.
-- [ ] 56. Implement cooperation possibilities by using things like [liveblocks](https://liveblocks.io).
-- [ ] 57. Implement CLI to quickly get Relivator with selected options only; try to use [Charm](https://charm.sh) things to build the Reliverse CLI.
-- [ ] 58. Implement AI like GPT chat features by using [Vercel AI SDK](https://sdk.vercel.ai/docs) (see: [Introducing the Vercel AI SDK](https://vercel.com/blog/introducing-the-vercel-ai-sdk)).
-- [ ] 59. Implement advanced theme switching without flashing, utilizing Tailwind Dark Mode with [React Server Side support](https://michaelangelo.io/blog/darkmode-rsc) and dynamic cookies.
-- [ ] 60. Implement [Jest](https://jestjs.io) testing, optimized for Next.js.
-- [ ] 61. Guarantee that every possible page is enveloped using predefined shell wrappers.
-- [ ] 62. Generously write comment only if it really is needed. Rewrite all code in the way to eliminate need in describing code in comments (read more in "Clean Code" book by Robert Cecil Martin). Consider using `/** block comment */` only in the `.mjs` and `.js` files.
-- [ ] 63. Fully develop advanced sign-up and sign-in pages, integrating both social media and classic form methods.
-- [ ] 64. Follow the best practices from the articles and videos like "[10 React Antipatterns to Avoid](https://youtube.com/watch?v=b0IZo2Aho9Y)" (check theirs comment section as well).
-- [ ] 65. Follow recommendations from [Material Design 3](https://m3.material.io) and other design systems when relevant.
-- [ ] 66. Establish, document, and adhere to conventions, such as maintaining a single naming case style for files and variables.
-- [ ] 67. Establish a comprehensive i18n, using country and locale codes, and support even more languages. Ensure native speakers verify each language following machine translation. Consider to use the [next-international](https://github.com/QuiiBz/next-international) library.
-- [ ] 68. Ensure ultimate type-safety using strict mode in [TypeScript](https://typescriptlang.org) including ["Do's and Don'ts"](https://typescriptlang.org/docs/handbook/declaration-files/do-s-and-don-ts.html) recommendations (without using [dangerous type assertions](https://youtube.com/watch?v=K9pMxqb5IAk), and with [optional types correct usage](https://youtube.com/watch?v=qy6IBZggXSQ), by also using `pnpm typestat` — once you run that, [TypeStat](https://github.com/JoshuaKGoldberg/TypeStat) will start auto-fixing TS typings); And also ensure type-safety with typedRoutes, zod, middleware, etc.
-- [ ] 69. Ensure the project lacks any unused items, such as packages, libraries, and variables. Also, make sure the project's code adheres to the [Never Nester principles](https://youtube.com/watch?v=CFRhGnuXG-4). Because, as Linus Torvalds once said, *If you need more than 3 levels of indentation, you're screwed anyway, and should fix the program*.
-- [ ] 70. Ensure project has full support for [GSAP](https://gsap.com) (GreenSock Animation Platform) library, with convenient ways to use @gsap/react [useGSAP() hook](https://gsap.com/docs/v3/React/tools/useGSAP).
-- [ ] 71. Ensure full Next.js Edge support and compatibility.
-- [ ] 72. Ensure full [Biome](https://biomejs.dev), [Bun](https://bun.sh), and [Docker](https://docker.com) support and compatibility.
-- [ ] 73. Ensure all website languages are grammatically correct and adhere to the latest rules for each language.
-- [ ] 74. Ensure all items in the project are sorted in ascending order unless different sorting is required elsewhere.
-- [ ] 75. Ensure the project avoids using redundant imports, such as importing everything from React, when it's sufficient to import only the necessary hooks, for example. The project doesn't use things that are automatically handled by the React Compiler (only where it fails), making the code much more readable. Million Lint must work seamlessly with React Compiler.
-- [ ] 76. Ensure accessibility for **users**, **developers** (both beginners and experts), **bots** (like [Googlebot](https://developers.google.com/search/docs/crawling-indexing/googlebot) or [PageSpeed Insights Crawler](https://pagespeed.web.dev)), for **everyone**.
-- [ ] 77. Enhance `middleware.ts` configuration with multi-middleware implementation.
-- [ ] 78. Employ all relevant [TanStack](https://tanstack.com) libraries.
-- [ ] 79. Eliminate each disabling in the `eslint.config.js` file, configure config to strict, but to be still beginner-friendly.
-- [ ] 80. Elegantly configure `app.ts`, offering a single config to replace all possible others.
-- [ ] 81. Develop workflows for both sellers and customers.
-- [ ] 82. Develop an even more sophisticated implementation of user subscriptions and the checkout system via Stripe; and also write Jest/Ava tests for Stripe and use `.thing/hooks/stripe_*.json` [webhookthing](https://docs.webhookthing.com) data files for these tests.
-- [ ] 83. Develop an advanced storefront featuring products, categories, and subcategories.
-- [ ] 84. Develop an advanced 404 Not Found page with full internationalization support.
-- [ ] 85. Develop advanced sign-up, sign-in, and restoration using email-password and magic links.
-- [ ] 86. Decrease file count by merging similar items, etc.
-- [ ] 87. Create the most beginner-friendly and aesthetically pleasing starter possible.
-- [ ] 88. Create an advanced notification system, inclusive of toasters, pop-ups, and pages.
-- [ ] 89. Create a new landing page with a distinctive design and update components, plus fully redesign all other pages and components.
-- [ ] 90. Consider adding Facebook's [StyleX](https://stylexjs.com/blog/introducing-stylex). However, StyleX currently requires setting up Babel/Webpack in the project, which we avoid to maintain full Turbopack support. As a suitable alternative, consider jjenzz's [Tokenami](https://github.com/tokenami/tokenami#readme) or [Panda CSS](https://panda-css.com) by Chakra. Possibly, we can make a choice between them all while bootstrapping the project with Reliverse CLI. These libraries help with avoiding the deprecated [initial idea](https://stylexjs.com/blog/introducing-stylex/#the-origins-of-stylex) for [CSS-in-JS](https://medium.com/dailyjs/what-is-actually-css-in-js-f2f529a2757). Learn more [here](https://github.com/reactwg/react-18/discussions/110) and in [Next.js docs](https://nextjs.org/docs/app/building-the-application/styling/css-in-js).
-- [ ] 91. Confirm the project is free from duplicates, like files, components, etc.
-- [ ] 92. Conduct useful tests, including possible stress tests, to simulate and assess app performance under high-traffic conditions.
-- [ ] 93. Comprehensively configure RSCs and all other new Next.js 13-15 features. Seamlessly move data fetching between both client-side and server-side by using [useSWR](https://x.com/shuding_/status/1794461568505352693).
-- [ ] 94. Complete the BA11YC (Bleverse Accessibility Convention) checklist; which may relay on the following principle in the future: [DesignPrototype](https://uiprep.com/blog/ultimate-guide-to-prototyping-in-figma)-[CodePrototype](https://medium.com/@joomiguelcunha/the-power-of-prototyping-code-55f4ed485a30)-CodeTests-HqDesign-[TDD](https://en.wikipedia.org/wiki/Test-driven_development)-HqCode-[CI](https://en.wikipedia.org/wiki/CI/CD).
-- [ ] 95. Complete parts of the [BA11YC (Bleverse Accessibility Convention) checklist](https://github.com/bs-oss/BA11YC). This includes using software [Design Patterns](https://refactoring.guru/design-patterns/what-is-pattern) for code refactoring.
-- [ ] 96. Check all components with side-effects for re-rendering, it is recommended to re-render each component a maximum of 2 times ([good video about it (in Ukrainian)](https://youtu.be/uH9uMH2e5Ts)).
-- [ ] 97. Boost app performance scores on platforms like Google PageSpeed Insights. Ensure the app passes all rigorous tests.
-- [ ] 98. Apply the [nuqs](https://nuqs.47ng.com) library where appropriate; for older "next-usequerystate" (the old package's name) versions [read the article](https://francoisbest.com/posts/2023/storing-react-state-in-the-url-with-nextjs).
-- [ ] 99. All third-party libraries and React components should be appropriately isolated. This includes verifying data from these libraries, such as Clerk, and wrapping the components with the "use client" directive as necessary.
-- [ ] 100. Add a reviews section to the landing page. Obtain feedback on Relivator from five widely recognized individuals on the web.
-- [ ] 101. Add an admin dashboard that includes stores, products, orders, subscriptions, and payments.
-- [ ] 102. Add global color variables to all places where they are applied, instead of having hardcoded colors.
-- [ ] 103. Add pop-ups for cookies/GDPR notifications (with a respective management settings page), and Google floating notifications for quick login, etc.
-- [ ] 104. Add some interesting and useful types to the project, for example, using the [type-fest](https://github.com/sindresorhus/type-fest) library.
-- [ ] 105. Add the integration of a smart git-hooks system with various additional useful functionality.
-- [ ] 106. Add the most valuable and useful ESLint things from [awesome-eslint](https://github.com/dustinspecker/awesome-eslint) collection.
-
-[![Join the Relivator Discord](https://discordapp.com/api/guilds/1075533942096150598/widget.png?style=banner2)][badge-discord]
-
-## License
-
-This project is licensed under [the MIT License](https://choosealicense.com/licenses/mit) and is free to use and modify for your own projects. Please visit the [license](LICENSE) file for details. Since this project is under a free license, the author reserves the right to include referral links. The author may receive compensation from these links if users follow them and, for example, pay their first bill. Thank you all for your understanding!
-
-🌐 <https://relivator.com>
-
-## Changelog
-
-*a.k.a. What's Happening?!*
-
-### 1.2.6 - August 4, 2024 – The Resurrection Update
-
-Below you can see a small copy of [the article from Reliverse Docs](https://reliverse.org/relivator/v126), which is possibly outdated. Please refer to [1.2.6 Release Notes Page on GitHub](https://github.com/blefnk/relivator-nextjs-template/releases/tag/1.2.6) or to [this blog post](https://reliverse.org/relivator/v126) to read the most recent version. Reliverse Docs also has translations of the article into other languages; and will contain even more information about Relivator than this README.md, including notes from all past and future releases.
-
-**Relivator is Back with Version 1.2.6!** 🥳
-
-We are excited to announce the release of Relivator 1.2.6! This version marks the end of the "all-in-one" approach as we prepare for a more modular future with Reliverse CLI starting from version 1.3.0. The 1.2.6 release includes significant updates, especially in the database logic. The README.md has been significantly updated. Moving forward, we will introduce Canary, Release Candidate (RC), and General Availability (GA) branches for better version management. 1.2.6 will serve as a foundation, helping us transition more smoothly to the release of those 1.3.0's branches.
-
-### Major Changes and Improvements
-
-- **Database Updates**: This is the last release that simultaneously supports PostgreSQL/MySQL and Auth.js (next-auth@beta/NextAuth.js)/Clerk integrations.
-- **React 19 Preparation**: Work has commenced on upgrading from React 18 to React 19.
-- **Updated Libraries**: The project now uses next-auth v5, clerk v5 and optionally supports tailwindcss v4. Refer to the updated README.md for more details.
-
-### Migration Guidance
-
-Starting from version 1.3.1, we will provide comprehensive guides for migrating from older versions. The usual migration process involves reviewing commit changes and integrating necessary updates into your custom code. However, due to the extensive changes in versions 1.2.6 and 1.3.0, this method is not feasible. We recommend reinstalling the project and transferring your custom features from the previous version to the new version of starter. Thank you for your understanding!
-
-To make the migration as smooth as possible, it's recommended to create a "`cluster`" folder in "`src`" and moving all your custom code there. If needed, you can adjust the paths using the [Find and Replace](https://code.visualstudio.com/docs/editor/codebasics#_search-and-replace) feature in VSCode. This will make it much easier to save and transfer your custom code to Relivator 1.2.6.
-
-### Default Database Change
-
-Neon PostgreSQL is now the default database instead of PlanetScale MySQL, as the latter no longer offers a free tier. If you require MySQL, [Railway](https://railway.app?referralCode=sATgpf) offers a more affordable alternative with a $5 credit without requiring a credit card. Note that this version has been primarily tested with Neon PostgreSQL.
-
-### Security and Code Improvements
-
-- **Type Safety and Editor Autocomplete**: This update enhances type safety and editor autocomplete for Drizzle ORM libraries.
-- **Prettier Replaced by Biome**: Prettier has been removed in favor of Biome. The Prettier config will be removed in the next version from the `addons\scripts\reliverse\relimter\core\temp` folder. You can re-add it by running the `reliverse` command starting from Relivator 1.3.0.
-
-### Reliverse Scripts Transition
-
-Reliverse scripts have moved from the "unknown viability" stage to the "unstable" stage. As always, use them at your own risk and make backups. These scripts are now located in the `addons/relimter/[core|python]` folder. Most scripts require Python to be installed.
-
-For more details on this update, you can read my detailed posts in the Relivator thread on Discord. Start with [this message](https://discord.com/channels/1075533942096150598/1155482425862922370/1241995095125786624).
-
-### Thank You So Much
-
-If anyone have any questions or issues, don't hesitate to contact me, means @blefnk, on Discord or GitHub. For more information about 1.2.6 and 1.3.0, please visit `#⭐-relivator` chat on the project's Discord server and the [GitHub Issues](https://github.com/blefnk/relivator-nextjs-template/issues) page.
-
-Thank you for your continued support and happy coding with [Reliverse Website Builder v0.4.0](https://github.com/blefnk/reliverse-website-builder) and [Relivator Next.js Template v1.2.6](https://github.com/blefnk/relivator-nextjs-template)!
-
-### Release Notes 1.2.5-1.0.0
-
-**This is what happened before 1.2.6 version:**
-
-<details>
-  <summary>v1.2.5 — 27.02.2024</summary>
-
-Hello! I, @blefnk Nazar Kornienko, finally have the opportunity to get back to working on Relivator after a month of exams at university. Thanks to all the new starter users! The project already has over 520 stars, 110 forks, 20 repository watchers, and 45 users in Discord - that's really cool and exciting!
-
-I also want to thank the active Discord users of the project: *codingisfun, el_ade, righthill, nyquanh, spacecoder315, adelinb*. Thank you to everyone who creates PR/Issues and everyone else who actively uses the starter, whose nicknames I don't know. Your feedback and contributions are incredibly valuable for the development of the project!
-
-Since there hasn't been an update in over a month, I'm going to make the transition to the next major version smoother. Therefore, version 1.2.5 has been released to simply refresh the dependencies and other minor details and README a bit. This small update will also allow me to check if certain users continue to have the individual strange problems they reported.
-
-If everything goes well, the next update will already be version 1.3.0. By the way, I'm working on 1.2.x and 1.3.0 in parallel, like in big studios, haha. But please note: some files and lines of code was disabled by default for this version to fix and check some things. By the way, the third digit means that this update is not mandatory, but still recommended. And Relivator 1.3.0 may or may not come with a canary version of React/Next.js to start preparing for the upcoming release of React 19.
-
-Well, that's all for today, all the best to everyone, and may your `pnpm latest` and `pnpm appts` always be successful! As usual, I try to write a short announcement, but it turns out a few paragraphs, that's how we live! 😄
-
-P.S. And, please, don't pay attention that so many files have been "changed" in the latest commit, looks like it's because of Prettier I think, I only updated a few files, and if it's important to someone, please let me know in Discord's DM and I'll list you these files.
-
-[Read more about v1.2.5](https://github.com/blefnk/relivator-nextjs-template/releases/edit/1.2.5)
-
-</details>
-
-<details>
-  <summary>v1.2.4 — 13.01.2024</summary>
-
-Just a small hotfix to improve the developer experience.
-
-[Read more about 1.2.4](https://github.com/blefnk/relivator-nextjs-template/releases/edit/1.2.4)
-
-</details>
-
-<details>
-  <summary>v1.2.3 — 12.01.2024</summary>
-
-Just a small hotfix to improve the developer experience.
-
-[Read more about 1.2.3](https://github.com/blefnk/relivator-nextjs-template/releases/edit/1.2.3)
-
-</details>
-
-<details>
-  <summary>1.2.2 — 03.01.2024</summary>
-
-1.2.2 brings ESLint Stylistic Plugin into the life. This will make the work with the project even more enjoyable.
-
-Remember, Relivator is designed to be beginner-friendly, so quite a lot of ESLint options are turned off, just turn on what you need.
-
-These turn-offs will be gradually eliminated as we move towards the massive 2.0.0, which will significantly raise the project's standards, being professional, will be even more convenient for beginners.
-
-[Read more about v1.2.2](https://github.com/blefnk/relivator-nextjs-template/releases/edit/1.2.2)
-
-</details>
-
-<details>
-  <summary>1.2.1 — 02.01.2024</summary>
-
-This is quite a small update compared to all the past ones, but this one also deserves the attention. Now, updates will generally be smaller but will appear more frequently. Thanks to this, it will be possible to easily update forks and independent projects that use Relivator as their base.
-
-Update v1.2.1 adds Chinese localization, and among other things, work has begun on the so-called token system, which will allow future versions to work with Figma design systems in an automated way. It will also help to make the styles in the project cleaner by significantly reducing the number of Tailwind classes. For this, Relivator now installs the wonderful package @tokenami, developed by @jjenzz; Jenna, thank you so much for this library!
-
-p.s. 1.2.1 is the first commit to the Relivator repository that no longer contains an emoji at the beginning of its name. Thanks to this, contributors to Relivator/Reliverse will no longer have to spend time inventing a suitable emoji.
-
-[Read more about v1.2.1](https://github.com/blefnk/relivator-nextjs-template/releases/edit/1.2.1)
-
-</details>
-
-<details>
-  <summary>1.2.0 — [27.12.2023] 🎄 Relivator v1.2.0 is here! 🥳 Click to see the announcement 🎁</summary>
-
-*Relivator 1.2.0 is already here! I, [@blefnk Nazar Kornienko](https://github.com/blefnk), am thrilled to wrap up this year 2023, proudly presenting this release to the OSS community! So, the result of over two months of hard work is finally here!*
-
-In this version, significant attention was focused on stability, security, performance optimization, and a substantial improvements in design—both visually, UX, and the logic of how the app works. A lot was really done, too much to list everything! Be sure to install it and check it out!
-
-By the way, you can now enjoy a finely-tuned ESLint Flat Config! Also, it's worth noting that Clerk, since version 1.1.0, is no longer considered deprecated in the Relivator project. Thanks to 1.2.0, Clerk now works seamlessly with an easy switch to Auth.js (next-auth@beta/NextAuth.js) when needed, all on the fly. Plus, full support for Turbopack (next dev --turbo) is finally here, even for next-intl!
-
-As for next-intl, finally, we can now enjoy internationalization that works not only on the client-side but also on the server! Only the 404 page has client-side i18n messages, all other pages and components use i18n as server-first. And this is really cool!
-
-Many unique solutions have been implemented in this new version. Moreover, using Relivator from this version, you have the opportunity to try out the alpha version of our unique Code-First/No-Code Builder system for React pages and components (which will appear in Reliverse CMS in the future). Just visit the Admin page while in the development environment and enjoy.
-
-If you have already used Relivator before, please pay attention, this is very important! Be sure to check the updated .env.example file and update the .env file accordingly.
-
-As a small teaser/spoiler, for Relivator 1.3.0, even more improvements in visual design and UX are planned; 1.4.0 will come with a magical CLI implementation, allowing you to quickly obtain only the necessary features and dependencies for the app (even automated updates and the ability to add other functions and packages to an already installed app); 1.5.0 will undergo a full code refactoring that will meet all the best standards and practices; 1.6.0-2.0.0+ versions, apart from many other things, will receive most of the items currently unchecked in the Roadmap (located in the project's README.md). It's going to be incredible!
-
-So, install this new version of Relivator 1.2.0 and appreciate the multitude of incredible features, and freely use it in the own projects today. Please use the preferred feedback channels to share the thoughts on Relivator 1.2.0 and what you would like to see in future releases.
-
-Don't forget to also check out the significantly updated README.md, it's worth it.
-
-Enjoy! ❄️☃️ Merry Christmas and Happy New Year 2024! 🎇🥳
-
-</details>
-
-<details>
-  <summary>1.1.0 — 🔥 The Most Feature-Rich Next.js 15 Starter</summary>
-
-Here it is! Relivator has been updated to version 1.1.0!
-
-**Now it's even more feature-rich, with cleaner code, and a more stable Next.js starter.**
-
-Ever dreamed of having both MySQL/PostgreSQL and Clerk/Auth.js (next-auth@beta/NextAuth.js) in one project with the ability to switch on the fly? And even if you hadn't thought about it – now it's possible. Mix and match at will – even more possibilities for on-the-fly switching are coming soon in the next releases of Relivator.
-
-Among many other new and fixed things, Stripe is now fully functional and comes with extensive docs in the form of comments within the relevant files.
-
-`Please star this repository` to show the support! Thank you to everyone who has shown interest in this project!
-
-Please check out the updated list of project features in the project's README. Enjoy and please share the feedback!
-
-[Read more about v1.1.0](https://github.com/blefnk/relivator-nextjs-template/releases/edit/1.1.0)
-
-</details>
-
-<details>
-  <summary>1.0.0 — 🎉 Relivator Release</summary>
-
-How to Install and Get Started? Please refer to the [🏗️ Installation](#installation) section, where you can always find information about the project and how to install it easily.
-
-[Read more about v1.0.0](https://github.com/blefnk/relivator-nextjs-template/releases/tag/1.0.0)
-
-</details>
-
-Please visit the [CHANGELOG.md](.github/CHANGELOG.md) or [Reliverse Docs](https://reliverse.org/relivator) to read the release notes for older versions.
-
-## The Final Words
-
-This Next.js 15 starter — Relivator — was crafted with love by [@blefnk Nazar Kornienko](https://github.com/blefnk) and the incredible [Bleverse OSS community](https://github.com/blefnk/relivator-nextjs-template/wiki/Project-Credits-&-Contributors). We are deeply grateful for all your contributions and support for this project.
-
-Happy coding! Embark on the coding adventure, learn, iterate, and most importantly – enjoy the process! Remember – this is a space of learning and experimentation. Dive in and savor the journey! 🚀🌌
-
-Check out [our other free Next.js 15 starter](https://github.com/blefnk/reliverse). This monorepo provides the tech used in the current starter and adds: Turborepo/Turbopack, Prisma, Valibot, Lucia, Clerk, and much more, as we experimentally attempt to combine all vital and widely-used tech. Think of it as: Reliverse (WordPress) + Relivator (WooCommerce) = 😍. So, start right now! Start today with Relivator!
-
-<p>
-  <span>
-    <a href="https://github.com/blefnk/relivator-nextjs-template/blob/main/public/reliverse.png">
-      <picture>
-          <source media="(prefers-color-scheme: dark)" srcset="public/reliverse.png" />
-          <source media="(prefers-color-scheme: light)" srcset="public/reliverse.png" />
-          <img alt="Reliverse" src="/public/reliverse.png" width="35%" />
-      </picture>
-    </a>
-  </span>
-</p>
-
-> 🚀 **Ready to launch?** Start building your project with Relivator and Reliverse as soon as possible! With one-click deploy on Vercel:
-
-[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fblefnk%2Frelivator-nextjs-template&project-name=relivator&repository-name=my-new-repository-name)
-
-> 💻 **Prefer manual installation?** Refer to the [🏗️ Installation](#installation) section or just clone the project using the most classical way:
-
-```bash
-git clone https://github.com/blefnk/relivator.git
-```
-
-[2023-2024 © Nazar Kornienko / Nazar Kornienko / blefnk](https://github.com/blefnk) (<https://relivator.com>)
-
-<p>
-  <span>
-    <a href="https://github.com/blefnk/relivator-nextjs-template/blob/main/public/og.png">
-      <picture>
-          <source media="(prefers-color-scheme: dark)" srcset="public/og.png" />
-          <source media="(prefers-color-scheme: light)" srcset="public/og.png" />
-          <img alt="Relivator OG Image" src="/public/og.png" width="35%" />
-      </picture>
-    </a>
-  </span>
-</p>
-
-[![Join the Relivator Discord](https://discordapp.com/api/guilds/1075533942096150598/widget.png?style=banner2)][badge-discord]
-
-[🌐 Demo](https://relivator.com) | [👋 Introduction](#introduction) | [🏗️ Installation](#installation) | [🤔 FAQ](#faq) | [🔍 Details](#details) | [✅ Roadmap](#roadmap) | [📖 Changelog](#changelog)
-
-**Follow Us Everywhere:** [𝕏](https://x.com/blefnk) | [GitHub](https://github.com/blefnk) | [LinkedIn](https://linkedin.com/in/blefnk) | [Facebook](https://facebook.com/blefnk) | [Discord](https://discord.gg/Pb8uKbwpsJ) | [Fiverr](https://fiverr.com/blefnk)
-
-[badge-discord]: https://badgen.net/discord/members/Pb8uKbwpsJ?icon=discord&label=discord&color=purple
-[badge-npm]: https://badgen.net/npm/v/reliverse?icon=npm&color=green&label=%40blefnk%2Freliverse
-[link-discord]: https://discord.gg/Pb8uKbwpsJ
-[link-npm]: https://npmjs.com/package/reliverse/v/latest
+1. `bun i -g @reliverse/cli@latest`
+2. `reliverse`
+3. Select _Build a brand new thing from scratch_
+4. Provide details about your new project
+5. Select the technologies you want to use
+6. No more steps! It's ready! 😊🎉
diff --git a/biome.json b/biome.jsonc
similarity index 98%
rename from biome.json
rename to biome.jsonc
index 2a7368af..446d6564 100644
--- a/biome.json
+++ b/biome.jsonc
@@ -1,5 +1,5 @@
 {
-  "$schema": "https://biomejs.dev/schemas/1.9.3/schema.json",
+  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
   "css": {
     "formatter": {
       "enabled": false,
diff --git a/bun.lockb b/bun.lockb
index 17664764..8294ede3 100644
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/components.json b/components.json
index b40d2035..8b4ee3d7 100644
--- a/components.json
+++ b/components.json
@@ -2,14 +2,20 @@
   "$schema": "https://ui.shadcn.com/schema.json",
   "style": "new-york",
   "rsc": true,
+  "tsx": true,
   "tailwind": {
-    "config": "tailwind.config.js",
-    "css": "./src/styles/globals.css",
+    "config": "tailwind.config.ts",
+    "css": "src/assets/globals.css",
     "baseColor": "zinc",
-    "cssVariables": true
+    "cssVariables": true,
+    "prefix": ""
   },
   "aliases": {
-    "components": "@/components",
-    "utils": "@/lib/utils"
-  }
+    "components": "~/components",
+    "utils": "~/utils",
+    "ui": "~/components/ui",
+    "lib": "~/server",
+    "hooks": "~/hooks"
+  },
+  "iconLibrary": "lucide"
 }
diff --git a/cspell.json b/cspell.json
new file mode 100644
index 00000000..9e52928b
--- /dev/null
+++ b/cspell.json
@@ -0,0 +1,3637 @@
+{
+  "version": "0.2",
+  "language": "en,uk",
+  "import": [
+    "@cspell/dict-npm/cspell-ext.json",
+    "@cspell/dict-uk-ua/cspell-ext.json"
+  ],
+  "ignorePaths": ["**/*.lock", "**/*.txt", "pnpm-lock.yaml"],
+  "words": [
+    "abajo",
+    "abbiamo",
+    "Abbonamenti",
+    "abbonamento",
+    "Abgemeldet",
+    "ablegen",
+    "abmelden",
+    "Abmelden",
+    "Aboneliği",
+    "abonelik",
+    "Abonelik",
+    "Abonelikleri",
+    "Abonnement",
+    "Abonnementpläne",
+    "Abonnements",
+    "Abonnementsystem",
+    "Abonnieren",
+    "Abrechnung",
+    "Acara",
+    "Accedi",
+    "accelerare",
+    "accélérer",
+    "acceptez",
+    "Accès",
+    "Acceso",
+    "accesso",
+    "Accesso",
+    "accettare",
+    "accetti",
+    "acciones",
+    "Accueil",
+    "acelerar",
+    "aceptar",
+    "aceptas",
+    "Acerca",
+    "achats",
+    "Achats",
+    "Achetez",
+    "Açıklama",
+    "Açılır",
+    "açma",
+    "Acquista",
+    "acquisti",
+    "Acquisti",
+    "Actualizaciones",
+    "actualizada",
+    "Actualizando",
+    "Actualizar",
+    "actuel",
+    "Adakah",
+    "adalah",
+    "adicionales",
+    "adlandırılmış",
+    "adları",
+    "administración",
+    "Administración",
+    "Administrar",
+    "Administrateur",
+    "administratora",
+    "adminpage",
+    "adres",
+    "Adressleiste",
+    "adresu",
+    "Afficher",
+    "Aggiorna",
+    "Aggiornamenti",
+    "Aggiungi",
+    "aggiuntive",
+    "agradecidos",
+    "Agrega",
+    "Agregar",
+    "ahora",
+    "Ajouter",
+    "Ajoutez",
+    "Ajustes",
+    "Akar",
+    "akaun",
+    "Akaun",
+    "akceptować",
+    "akceptujesz",
+    "akcjami",
+    "Akses",
+    "aktualisieren",
+    "Aktualisieren",
+    "Aktualisierung",
+    "Aktualizacja",
+    "aktualizacje",
+    "Aktualne",
+    "Aktuelle",
+    "Aktuelles",
+    "akzeptieren",
+    "alacritty",
+    "alamat",
+    "Alanı",
+    "Alanını",
+    "alanları",
+    "alat",
+    "alemán",
+    "Alemania",
+    "aligné",
+    "alignée",
+    "alineada",
+    "alineado",
+    "Alineado",
+    "alın",
+    "Alışverişe",
+    "alla",
+    "Allemagne",
+    "allemand",
+    "Alles",
+    "allineata",
+    "allineati",
+    "allineato",
+    "almalar",
+    "Almanca",
+    "Almanya",
+    "Altbilgi",
+    "alternar",
+    "altri",
+    "altro",
+    "Altro",
+    "Améliorée",
+    "Améliorez",
+    "Ammin",
+    "amministrazione",
+    "amusante",
+    "Añadir",
+    "anahtarı",
+    "Anasayfa",
+    "Anbieter",
+    "ancora",
+    "anda",
+    "Anda",
+    "andato",
+    "anderen",
+    "anderes",
+    "ändern",
+    "Änderungen",
+    "angezeigt",
+    "angielski",
+    "angielskiego",
+    "Anglais",
+    "anında",
+    "Anında",
+    "anmelden",
+    "Anmelden",
+    "ansehen",
+    "antemano",
+    "anticipato",
+    "anticipé",
+    "anticipo",
+    "Anwendung",
+    "anykey",
+    "anzeigen",
+    "Apilados",
+    "Aplicación",
+    "aplicaciones",
+    "Aplikacja",
+    "aplikacją",
+    "aplikacji",
+    "aplikasi",
+    "Aplikasi",
+    "apoyar",
+    "apoyo",
+    "Applicazione",
+    "Approximative",
+    "appts",
+    "aquí",
+    "AQUÍ",
+    "araçlar",
+    "arahan",
+    "archivo",
+    "archivos",
+    "arethetypeswrong",
+    "areyousueyouwanttosignout",
+    "arka",
+    "Armaturenbrett",
+    "Arryn",
+    "Artboard",
+    "articoli",
+    "artículo",
+    "artículos",
+    "Artikel",
+    "aşağıya",
+    "asal",
+    "astro",
+    "astrowind",
+    "atas",
+    "atau",
+    "Atau",
+    "Atrás",
+    "Attendere",
+    "Attiva",
+    "attuale",
+    "attw",
+    "Aucun",
+    "aufgetreten",
+    "Aufzeichnen",
+    "aufzubauen",
+    "ausgewählt",
+    "Ausgewählte",
+    "autenticación",
+    "Autenticación",
+    "autenticazione",
+    "Autenticazione",
+    "Authentification",
+    "Authentifizierungssystem",
+    "authjs",
+    "avancés",
+    "Avant",
+    "avanzados",
+    "avanzati",
+    "avec",
+    "Avec",
+    "avez",
+    "avons",
+    "awal",
+    "Awal",
+    "ayarı",
+    "Ayarlar",
+    "Aydınlık",
+    "ayıklama",
+    "ayırtın",
+    "Ayrıcalıklarını",
+    "azioni",
+    "Azletmek",
+    "backendem",
+    "Bagaimana",
+    "bağış",
+    "Bağış",
+    "bağışlar",
+    "Bağışlar",
+    "Bağlantısı",
+    "bağlayın",
+    "bağlı",
+    "Baharu",
+    "bahasa",
+    "Bahasa",
+    "Bajo",
+    "bakın",
+    "Bana",
+    "Banery",
+    "Bannières",
+    "banyak",
+    "barang",
+    "Barang",
+    "Baratheon",
+    "bardzo",
+    "Baris",
+    "barra",
+    "Barra",
+    "Baru",
+    "Basculer",
+    "basit",
+    "başına",
+    "Başlamak",
+    "başlayabilirim",
+    "Başlıklar",
+    "Başlıklı",
+    "Baue",
+    "bawah",
+    "Bayar",
+    "Bazy",
+    "bearbeiten",
+    "będzie",
+    "beeindruckende",
+    "beibehalten",
+    "Beispiel",
+    "Beitrag",
+    "Beiträge",
+    "bekleyin",
+    "belah",
+    "Beli",
+    "Belirlenecek",
+    "Belirli",
+    "Belum",
+    "Bentornato",
+    "bentuk",
+    "Benutzer",
+    "Benutzerauthentifizierung",
+    "Benutzername",
+    "Benutzerrechte",
+    "Benutzerrolle",
+    "berbayar",
+    "berechnet",
+    "bereit",
+    "Bereit",
+    "Bereitstellung",
+    "Berfungsi",
+    "Berhenti",
+    "Berita",
+    "beritahu",
+    "Berjajar",
+    "berkuasa",
+    "Berkuasa",
+    "berlaku",
+    "Bermula",
+    "Bersedia",
+    "bersetuju",
+    "berterima",
+    "berubah",
+    "Berulang",
+    "beschleunigen",
+    "beschleunigt",
+    "Beschreibung",
+    "bestätigen",
+    "Beste",
+    "Bestellung",
+    "Besuchen",
+    "besuchte",
+    "Bezahlen",
+    "Bezpieczne",
+    "Bezpośrednie",
+    "bientôt",
+    "Bienvenido",
+    "bietet",
+    "Bieżące",
+    "Bild",
+    "Bilder",
+    "bildirimi",
+    "bildirirseniz",
+    "Bileşen",
+    "Bileşenler",
+    "bileşenleri",
+    "bilgiler",
+    "bilgisi",
+    "Bina",
+    "birimleri",
+    "biuletyn",
+    "biuletynami",
+    "biuletynu",
+    "bizimle",
+    "bırak",
+    "bırakın",
+    "błąd",
+    "błędzie",
+    "blefnk",
+    "bleverse",
+    "Bloga",
+    "Blogbeitrag",
+    "blogu",
+    "Blogue",
+    "Boad",
+    "bocznego",
+    "boczny",
+    "boleh",
+    "Bolehkah",
+    "boletín",
+    "Boletín",
+    "boletines",
+    "bootstrapper",
+    "bootstrappers",
+    "bord",
+    "botones",
+    "boutons",
+    "Brak",
+    "breathability",
+    "browserlist",
+    "browserlistrc",
+    "Brun",
+    "Buang",
+    "budowie",
+    "Buduj",
+    "Buio",
+    "Bülten",
+    "Bülteni",
+    "Bültenine",
+    "bulunamadı",
+    "bumpp",
+    "bundan",
+    "bunp",
+    "bunx",
+    "Burada",
+    "BURADA",
+    "Buradan",
+    "buraya",
+    "burayı",
+    "Buscar",
+    "butang",
+    "butiran",
+    "Butiran",
+    "bylibyśmy",
+    "Bytest",
+    "caffè",
+    "caisse",
+    "Calcolato",
+    "Calculado",
+    "Calculé",
+    "całego",
+    "całym",
+    "cambi",
+    "cambiado",
+    "cambiando",
+    "Cambiar",
+    "cambiare",
+    "cambiato",
+    "cambios",
+    "canggih",
+    "Cantidad",
+    "çapında",
+    "características",
+    "caratteristiche",
+    "Cargando",
+    "Cari",
+    "Carian",
+    "Carica",
+    "Caricamento",
+    "CARMO",
+    "carrello",
+    "Carrello",
+    "carrito",
+    "Carrito",
+    "Catalogo",
+    "Catálogo",
+    "catatan",
+    "Categoria",
+    "Categoría",
+    "catégorie",
+    "Catégorie",
+    "Cekap",
+    "Cela",
+    "Cena",
+    "Cengkerang",
+    "cepat",
+    "Cepat",
+    "Cerca",
+    "cerrar",
+    "Cerrar",
+    "cette",
+    "çevrimiçi",
+    "changé",
+    "Chargement",
+    "chcesz",
+    "Chiaro",
+    "Chiave",
+    "Childrens",
+    "choisi",
+    "choisir",
+    "Ciemny",
+    "Cipta",
+    "ciri",
+    "Ciri",
+    "çıkan",
+    "Çıkış",
+    "clic",
+    "Clicca",
+    "Cliente",
+    "Clientseitiges",
+    "clientside",
+    "Cliquez",
+    "Clooney",
+    "cmder",
+    "cmdk",
+    "Codemod",
+    "codice",
+    "Codice",
+    "código",
+    "Código",
+    "Coffe",
+    "Collega",
+    "colonne",
+    "colonnes",
+    "columnas",
+    "comercio",
+    "commande",
+    "commencer",
+    "communauté",
+    "Cómo",
+    "comparsa",
+    "compila",
+    "componente",
+    "componentes",
+    "Componentes",
+    "componenti",
+    "Componenti",
+    "composant",
+    "composants",
+    "Composants",
+    "Compra",
+    "Cómprame",
+    "Comprami",
+    "comprando",
+    "compras",
+    "Compras",
+    "comprend",
+    "comunidad",
+    "comunità",
+    "Conecta",
+    "conectada",
+    "Conectado",
+    "confermare",
+    "confidentialité",
+    "Confidentialité",
+    "configuración",
+    "confirmar",
+    "confirmer",
+    "confirmtoggle",
+    "Congedare",
+    "Connecté",
+    "connectée",
+    "Connectez",
+    "connesso",
+    "Connesso",
+    "Connexion",
+    "consecuencia",
+    "consegna",
+    "conseguenza",
+    "conséquence",
+    "consigliato",
+    "construcción",
+    "construir",
+    "Construir",
+    "Construire",
+    "Construya",
+    "Consulta",
+    "consultar",
+    "Consultez",
+    "contactarnos",
+    "contacter",
+    "contattarci",
+    "contenidos",
+    "contenu",
+    "contenuti",
+    "continuación",
+    "continuar",
+    "Contoh",
+    "contraseña",
+    "Contraseña",
+    "controllo",
+    "COPPA",
+    "corrente",
+    "correo",
+    "Correo",
+    "Correos",
+    "cosa",
+    "costi",
+    "costruire",
+    "Costruisci",
+    "costruzione",
+    "côté",
+    "cottonbro",
+    "cotygodniowego",
+    "Cotygodniowy",
+    "courrier",
+    "cours",
+    "Crea",
+    "Crear",
+    "créer",
+    "Créer",
+    "Créez",
+    "cristal",
+    "cronvel",
+    "Çubuğu",
+    "çubuğunda",
+    "cuenta",
+    "Cuenta",
+    "Cukai",
+    "Curseur",
+    "Cursore",
+    "cykliczne",
+    "Czas",
+    "czekać",
+    "Często",
+    "d'abonnement",
+    "d'accès",
+    "d'adresse",
+    "d'authentification",
+    "d'avance",
+    "d'origine",
+    "d'utilisateur",
+    "d'utilisation",
+    "d'utiliser",
+    "daftar",
+    "Daftar",
+    "dağıtım",
+    "dağıtın",
+    "daha",
+    "dahulu",
+    "dakika",
+    "dalam",
+    "Dalam",
+    "dalej",
+    "dankbar",
+    "Danke",
+    "dans",
+    "danych",
+    "Danych",
+    "dari",
+    "daripada",
+    "Darmowy",
+    "darmowymi",
+    "darowizn",
+    "darowizny",
+    "Darowizny",
+    "Dasar",
+    "dass",
+    "Datei",
+    "Dateien",
+    "Datenbankintegration",
+    "Datenschutzhinweis",
+    "Datenschutzrichtlinien",
+    "datepart",
+    "dateparts",
+    "dati",
+    "Dati",
+    "datos",
+    "Datos",
+    "Dazu",
+    "deafult",
+    "débogage",
+    "debugowanie",
+    "Déconnecté",
+    "déconnecter",
+    "Déconnexion",
+    "Découvrez",
+    "défaut",
+    "definicja",
+    "definiert",
+    "definire",
+    "defu",
+    "değil",
+    "Değişiklikleri",
+    "değiştiğini",
+    "değiştir",
+    "Değiştir",
+    "değiştirin",
+    "değiştirirseniz",
+    "degli",
+    "dell'evento",
+    "delle",
+    "Demnächst",
+    "denaro",
+    "deneyebilirsiniz",
+    "Deneyim",
+    "deneyin",
+    "dengan",
+    "Dengan",
+    "deno",
+    "déplacée",
+    "Déployez",
+    "Déposez",
+    "deposundaki",
+    "depuración",
+    "Depuración",
+    "derecha",
+    "derechos",
+    "derhuerst",
+    "dernières",
+    "Ders",
+    "Desafortunadamente",
+    "desarrolladores",
+    "desarrollo",
+    "Desarrollo",
+    "Desconectado",
+    "Desconectar",
+    "descripción",
+    "Descripción",
+    "descrizione",
+    "Descrizione",
+    "deseas",
+    "Despedir",
+    "desplegables",
+    "Despliega",
+    "dessous",
+    "destacadas",
+    "destacados",
+    "destek",
+    "Destek",
+    "Desteklemenin",
+    "destra",
+    "détails",
+    "Détails",
+    "Detale",
+    "detalles",
+    "Detalles",
+    "Detaylar",
+    "Detayları",
+    "determinar",
+    "déterminer",
+    "dettagli",
+    "Dettagli",
+    "Deutsch",
+    "devam",
+    "développement",
+    "Développement",
+    "développeurs",
+    "dflt",
+    "diakses",
+    "diapositiva",
+    "Diapositiva",
+    "Dibelanjakan",
+    "Didefinisi",
+    "diesen",
+    "dieser",
+    "digayakan",
+    "diinternasionalkan",
+    "diketengahkan",
+    "Dikey",
+    "Dikira",
+    "dilaksanakan",
+    "Dili",
+    "Diller",
+    "dilokalkan",
+    "dinamakan",
+    "dinero",
+    "dipercepatkan",
+    "diperlukan",
+    "Dipertingkatkan",
+    "dipindahkan",
+    "direcciones",
+    "directe",
+    "directo",
+    "Direkte",
+    "diretto",
+    "diritti",
+    "Disambungkan",
+    "disattiva",
+    "disconnessione",
+    "Disconnesso",
+    "Disconnetti",
+    "Discorda",
+    "diseñados",
+    "Diseños",
+    "disponibile",
+    "Disponibile",
+    "disponible",
+    "Disponible",
+    "Distribuisci",
+    "Disusun",
+    "disyorkan",
+    "ditemui",
+    "Ditemui",
+    "Ditentukan",
+    "divertente",
+    "divertida",
+    "Dlaczego",
+    "Documentazione",
+    "Dodaj",
+    "dodatkową",
+    "dodatkowe",
+    "Doesnt",
+    "Doğrudan",
+    "doğrula",
+    "doğrulama",
+    "Doğrulama",
+    "doğrulamak",
+    "Dołącz",
+    "Domande",
+    "domyślnego",
+    "donación",
+    "donaciones",
+    "Donaciones",
+    "donare",
+    "donazione",
+    "donazioni",
+    "Donazioni",
+    "Döndürücü",
+    "données",
+    "Données",
+    "Dont",
+    "dopo",
+    "dört",
+    "dostarczanie",
+    "Dostawca",
+    "dostawcy",
+    "dostawy",
+    "dostęp",
+    "Dostęp",
+    "Dostępne",
+    "Doświadczenie",
+    "Dosyaları",
+    "dosyasını",
+    "Dosyayı",
+    "dotyczącymi",
+    "Downey",
+    "Drittanbietern",
+    "droite",
+    "düğmeleri",
+    "dunia",
+    "Dunia",
+    "Dunkel",
+    "Dünya",
+    "Dünyanın",
+    "durch",
+    "Durch",
+    "Düzenle",
+    "Düzenleri",
+    "dzięki",
+    "Dziękuję",
+    "Dziękujemy",
+    "ecommerce",
+    "ederim",
+    "ederiz",
+    "edersiniz",
+    "edin",
+    "Edin",
+    "Editar",
+    "Edytuj",
+    "eğlenceli",
+    "eine",
+    "einen",
+    "einer",
+    "Einfache",
+    "Einfacher",
+    "Eingeloggt",
+    "Einkauf",
+    "Einkäufe",
+    "Einkaufstabelle",
+    "einmal",
+    "einmalige",
+    "Einmalige",
+    "Einreichen",
+    "Einstellungen",
+    "Einzelheiten",
+    "Ejemplo",
+    "ekle",
+    "Ekle",
+    "ekleme",
+    "ekleyin",
+    "Eksklusif",
+    "Ekskluzywne",
+    "Elastyczne",
+    "electrónico",
+    "electrónicos",
+    "électronique",
+    "Elegan",
+    "Eleganckie",
+    "Elegantes",
+    "Eleganti",
+    "Élégants",
+    "elegir",
+    "Elemen",
+    "élément",
+    "Elemente",
+    "Elementi",
+    "elemento",
+    "Elementos",
+    "Éléments",
+    "Elementy",
+    "elettronica",
+    "Elimina",
+    "Eliminar",
+    "Elipssis",
+    "embla",
+    "Embla",
+    "Emel",
+    "emin",
+    "emojify",
+    "empezar",
+    "empfohlen",
+    "Empilés",
+    "encabezado",
+    "Encabezados",
+    "encontrada",
+    "encontrado",
+    "encontraron",
+    "Englisch",
+    "Enregistrer",
+    "Entdecken",
+    "entegrasyonu",
+    "Entegrasyonu",
+    "entfernen",
+    "Entfernen",
+    "entgehen",
+    "entier",
+    "entrega",
+    "entsprechend",
+    "Entwickler",
+    "Entwicklung",
+    "Envanter",
+    "Enviar",
+    "Envío",
+    "envjs",
+    "Ereigniszeit",
+    "Erfahrung",
+    "erfolgt",
+    "erforderlichen",
+    "Ergebnisse",
+    "erişim",
+    "erken",
+    "erkunden",
+    "erneut",
+    "erreur",
+    "errore",
+    "erstellen",
+    "Erstellen",
+    "Erweiterte",
+    "Esci",
+    "esclusivi",
+    "esempio",
+    "esistere",
+    "eslintcache",
+    "Esnek",
+    "Espagnol",
+    "Español",
+    "específico",
+    "Espere",
+    "Esperienza",
+    "Esplora",
+    "Essayez",
+    "essere",
+    "esta",
+    "está",
+    "estabas",
+    "Estable",
+    "están",
+    "estaríamos",
+    "estás",
+    "Estás",
+    "Esto",
+    "estos",
+    "Êtes",
+    "Etkinlik",
+    "etmek",
+    "être",
+    "ettiğiniz",
+    "Etwas",
+    "evenodd",
+    "evento",
+    "evidenza",
+    "exclusifs",
+    "exclusivos",
+    "Exemple",
+    "existiert",
+    "existir",
+    "Exklusive",
+    "Expérience",
+    "experiencia",
+    "Experiencia",
+    "Explora",
+    "Explorez",
+    "eylemleriyle",
+    "Facebooka",
+    "fácil",
+    "facilement",
+    "facilmente",
+    "Façons",
+    "facturación",
+    "Facturación",
+    "facturation",
+    "Facturation",
+    "Farklı",
+    "fastly",
+    "fatturazione",
+    "Fatturazione",
+    "Faturalandırma",
+    "faturalandırması",
+    "favourite",
+    "fazie",
+    "fazla",
+    "fazlası",
+    "Fecha",
+    "Fehler",
+    "Felder",
+    "Fermer",
+    "festzulegen",
+    "fichier",
+    "fichiers",
+    "figliolia",
+    "Filas",
+    "Filatore",
+    "Fileur",
+    "Filtreler",
+    "Filtres",
+    "Filtri",
+    "Filtros",
+    "Filtry",
+    "Finalizar",
+    "financials",
+    "Fireship",
+    "Fiyat",
+    "Fiyatlandırma",
+    "Fırsatı",
+    "Fleksibel",
+    "Flessibile",
+    "Flessibili",
+    "Flexibel",
+    "Flexibles",
+    "fluida",
+    "fluide",
+    "fluido",
+    "Flyknit",
+    "Flywire",
+    "Focusable",
+    "Foire",
+    "fonctionnalités",
+    "Fonctionnels",
+    "fondo",
+    "forgetme",
+    "Formas",
+    "fornitore",
+    "fortsetzen",
+    "fournisseur",
+    "Fournisseur",
+    "Fragen",
+    "frais",
+    "Français",
+    "frecuentes",
+    "frequenti",
+    "frontends",
+    "Frontside",
+    "früher",
+    "Frühzeitiger",
+    "Fügen",
+    "Funcionales",
+    "funciones",
+    "funkcje",
+    "funkcji",
+    "Funkcjonalne",
+    "funkcjonalny",
+    "Funktional",
+    "Funktionen",
+    "funktionsreichste",
+    "Funzionali",
+    "funzionalità",
+    "funzioni",
+    "Fußzeilenaktionen",
+    "ganzen",
+    "gdybyś",
+    "geändert",
+    "Gebietsschema",
+    "Gebühren",
+    "geçin",
+    "geçip",
+    "Geçiş",
+    "gefunden",
+    "Gehe",
+    "gehen",
+    "gehört",
+    "Gelap",
+    "geleceğini",
+    "Gelişmiş",
+    "Geliştirici",
+    "geliştiricileri",
+    "geliştirin",
+    "geliştirme",
+    "Geliştirme",
+    "genellikle",
+    "Geralt",
+    "gerekli",
+    "Gérer",
+    "Gérez",
+    "geri",
+    "Geri",
+    "Germania",
+    "Gesamt",
+    "Geschäfte",
+    "Geschäften",
+    "gestaltet",
+    "gestapelt",
+    "gestellte",
+    "Gestiona",
+    "Gestisci",
+    "getirilebilir",
+    "gezinme",
+    "Gezinme",
+    "giget",
+    "giochi",
+    "giriş",
+    "Giriş",
+    "gitti",
+    "Gizlilik",
+    "globale",
+    "globalny",
+    "globalste",
+    "Główna",
+    "Głównej",
+    "głównie",
+    "Gönder",
+    "Gönderi",
+    "gönderileri",
+    "gönderisini",
+    "Göre",
+    "göreceksiniz",
+    "görmek",
+    "goroutines",
+    "Görseller",
+    "görün",
+    "görüntüle",
+    "Görüntüle",
+    "Görüş",
+    "góry",
+    "gösterin",
+    "gotowy",
+    "Gotowy",
+    "gotowymi",
+    "Gracias",
+    "grati",
+    "Gratuit",
+    "gratuiti",
+    "gratuitos",
+    "gratuits",
+    "Grazie",
+    "Greyjoy",
+    "Griptape",
+    "Guardar",
+    "Guardare",
+    "Güçlü",
+    "gücü",
+    "Guna",
+    "gunakan",
+    "Gunakan",
+    "güncel",
+    "güncelle",
+    "Güncelleme",
+    "güncellemeler",
+    "güncellenmesi",
+    "Güvenli",
+    "Gyllenhaal",
+    "haben",
+    "hacer",
+    "Haftalık",
+    "Haha",
+    "hakkı",
+    "hakkında",
+    "Hakkında",
+    "halaman",
+    "Halaman",
+    "halen",
+    "halfpipes",
+    "halinde",
+    "handplants",
+    "Hantar",
+    "hantarkan",
+    "hanya",
+    "Hanya",
+    "Hardflip",
+    "Harga",
+    "harika",
+    "hasil",
+    "hasło",
+    "Hasło",
+    "hata",
+    "hatayı",
+    "hatayla",
+    "Häufig",
+    "hauptsächlich",
+    "Hauptschlüssel",
+    "hazır",
+    "headlessly",
+    "hebdomadaire",
+    "hedefi",
+    "Heelflip",
+    "Heim",
+    "hemen",
+    "hemos",
+    "Henüz",
+    "herramientas",
+    "Hesaba",
+    "hesabınız",
+    "Hesabınız",
+    "hesabınızla",
+    "Hesap",
+    "hesapla",
+    "hesaplanır",
+    "Heure",
+    "hier",
+    "Hier",
+    "HIER",
+    "Hilandero",
+    "hinzu",
+    "hinzufügen",
+    "hiszpański",
+    "hizalanmış",
+    "Hizalanmış",
+    "Hızla",
+    "hızlandırabilir",
+    "hızlandırmak",
+    "hızlı",
+    "hochladen",
+    "Hogar",
+    "hoşgeldiniz",
+    "houndstooth",
+    "Houndstooth",
+    "hoverable",
+    "Huba",
+    "Hubie",
+    "hubungi",
+    "içerik",
+    "içerir",
+    "için",
+    "icone",
+    "Icone",
+    "icônes",
+    "Icônes",
+    "iconos",
+    "identidad",
+    "Identität",
+    "identiti",
+    "idioma",
+    "Idiomas",
+    "ifadesini",
+    "Ihnen",
+    "Ihre",
+    "Ihrem",
+    "Ihren",
+    "iife",
+    "İkincil",
+    "ikonami",
+    "Ikonami",
+    "iletişime",
+    "ilimitadas",
+    "illimitate",
+    "illimitées",
+    "Ilość",
+    "imagen",
+    "imágenes",
+    "Imágenes",
+    "Imej",
+    "Imleç",
+    "immagini",
+    "Immagini",
+    "Impilati",
+    "implementado",
+    "implementato",
+    "implementiert",
+    "imponujące",
+    "Impostazioni",
+    "impresionante",
+    "impressionanti",
+    "impressionnante",
+    "Impuestos",
+    "inceleyin",
+    "incluye",
+    "Indietro",
+    "indirizzi",
+    "Infantil",
+    "información",
+    "Informacja",
+    "informacje",
+    "informar",
+    "informare",
+    "Informationen",
+    "informations",
+    "Informativa",
+    "informazioni",
+    "informieren",
+    "Inggeris",
+    "İngilizce",
+    "İngilizce'yi",
+    "inglés",
+    "Inglés",
+    "Inglese",
+    "Inhalte",
+    "Inicia",
+    "iniciador",
+    "iniciar",
+    "Iniciar",
+    "Inicio",
+    "iniziare",
+    "innego",
+    "innych",
+    "innym",
+    "Inscrivez",
+    "instalación",
+    "instalacji",
+    "instalar",
+    "installare",
+    "Installationsanweisungen",
+    "installazione",
+    "installieren",
+    "instantáneas",
+    "instantanés",
+    "instrucciones",
+    "instrukcje",
+    "Integración",
+    "Integracja",
+    "Integrasi",
+    "Intégration",
+    "Integrazione",
+    "Intenta",
+    "Inténtalo",
+    "intentar",
+    "Intentar",
+    "internacionalizar",
+    "internationalisés",
+    "internationalisiert",
+    "internazionalizzati",
+    "internetowe",
+    "internetowej",
+    "interruzioni",
+    "Intertek",
+    "intestazione",
+    "Intestazioni",
+    "introuvable",
+    "Inventaire",
+    "Inventar",
+    "Inventario",
+    "Inventori",
+    "invertir",
+    "Invertocat",
+    "Invia",
+    "Iscriviti",
+    "İsim",
+    "Işık",
+    "işlemler",
+    "İşlevsel",
+    "İspanyol",
+    "istantanee",
+    "istediğinizden",
+    "istemci",
+    "Istemci",
+    "istemciyi",
+    "istnieje",
+    "istruzioni",
+    "Italiano",
+    "izquierda",
+    "Jadual",
+    "jako",
+    "Jamdat",
+    "janedoe",
+    "Jangan",
+    "Janji",
+    "Jasny",
+    "jeden",
+    "jednej",
+    "jednorazowe",
+    "Jerman",
+    "Jeśli",
+    "Jeszcze",
+    "jetbrains",
+    "jetzt",
+    "język",
+    "języka",
+    "Języki",
+    "jiejie",
+    "jika",
+    "Jika",
+    "johndoe",
+    "juegos",
+    "Jumlah",
+    "jumpstart",
+    "Kabukları",
+    "kaçırmayın",
+    "Kaffee",
+    "Kahve",
+    "kaldır",
+    "Kanan",
+    "kancalar",
+    "Kandungan",
+    "kann",
+    "Kann",
+    "Kapalı",
+    "kapat",
+    "Kapat",
+    "kapatmak",
+    "Karanlık",
+    "Kararlı",
+    "Kargo",
+    "karşılaştık",
+    "kasie",
+    "kasih",
+    "Kasse",
+    "Kata",
+    "Katalog",
+    "Kataloğu",
+    "kategori",
+    "Kategoria",
+    "Kategorie",
+    "katılın",
+    "Katılın",
+    "katmanları",
+    "kaufen",
+    "Kaufen",
+    "kawy",
+    "kaya",
+    "kaydet",
+    "kayıt",
+    "Kayıt",
+    "Kaynak",
+    "Kecil",
+    "kedai",
+    "Kedai",
+    "Kein",
+    "Keine",
+    "Keistimewaan",
+    "Kekalkan",
+    "keluar",
+    "Keluar",
+    "keluaran",
+    "Kemas",
+    "Kembali",
+    "kemudian",
+    "kemungkinan",
+    "kena",
+    "Kenar",
+    "kepada",
+    "kerelik",
+    "keşfedin",
+    "Ketiga",
+    "Keutamaan",
+    "keypresses",
+    "Khusus",
+    "Kickflip",
+    "kickflips",
+    "Kimliğinizi",
+    "kimlik",
+    "Kimlik",
+    "Kini",
+    "KINI",
+    "Kiri",
+    "kişi",
+    "kırp",
+    "Kleine",
+    "Klicken",
+    "Klient",
+    "klienta",
+    "Klik",
+    "Kliknij",
+    "Klucz",
+    "Koddan",
+    "kodu",
+    "Kolay",
+    "kolayca",
+    "kolumny",
+    "kommt",
+    "Kompak",
+    "komponen",
+    "Komponen",
+    "komponent",
+    "komponentami",
+    "Komponente",
+    "Komponenten",
+    "Komponenty",
+    "Komuniti",
+    "können",
+    "könnten",
+    "konta",
+    "kontaktieren",
+    "kontakty",
+    "Konteks",
+    "kontem",
+    "konto",
+    "kontrol",
+    "Kontrol",
+    "Kontynuuj",
+    "Konum",
+    "Konusu",
+    "Kopfzeile",
+    "Kopfzeilen",
+    "Kornienko",
+    "Korniienko",
+    "koruyun",
+    "Korzystając",
+    "korzystania",
+    "kosong",
+    "Kosong",
+    "Kostenlos",
+    "kostenlosen",
+    "kostenpflichtigen",
+    "koszyk",
+    "Koszyk",
+    "koszyka",
+    "koszyku",
+    "kraj",
+    "krajów",
+    "Kuantiti",
+    "kuasa",
+    "Kuasa",
+    "küçük",
+    "kullan",
+    "kullanarak",
+    "Kullanıcı",
+    "kullanılır",
+    "Kullanım",
+    "kullanın",
+    "kullanıyorsanız",
+    "Kullanmadan",
+    "Kunci",
+    "Kunde",
+    "Kupuj",
+    "kurabilir",
+    "Kursor",
+    "kurulum",
+    "l'abbonamento",
+    "l'abonnement",
+    "l'accueil",
+    "l'anglais",
+    "l'avance",
+    "l'élément",
+    "l'emploi",
+    "l'événement",
+    "l'identità",
+    "l'identité",
+    "l'immagine",
+    "l'inglese",
+    "l'ordine",
+    "lado",
+    "lagi",
+    "Lagi",
+    "Lajur",
+    "lalai",
+    "laluan",
+    "Laluan",
+    "laman",
+    "Laman",
+    "lancar",
+    "Länderdaten",
+    "langganan",
+    "Langganan",
+    "Langsung",
+    "lanjut",
+    "Lannister",
+    "lanzamiento",
+    "laterale",
+    "latérale",
+    "lato",
+    "Łatwy",
+    "lawati",
+    "Lawati",
+    "Lazim",
+    "lazyness",
+    "lebih",
+    "Lebih",
+    "Legen",
+    "Leggero",
+    "Leider",
+    "Leistung",
+    "Leistungsstark",
+    "Leistungsstarke",
+    "Lencana",
+    "lepaskan",
+    "Lepaskan",
+    "Lesen",
+    "Letak",
+    "lewej",
+    "Licence",
+    "ligne",
+    "Lignes",
+    "Lihat",
+    "línea",
+    "Lingue",
+    "linksbündiger",
+    "Lista",
+    "listas",
+    "Liste",
+    "Listesi",
+    "listo",
+    "Listo",
+    "Livelli",
+    "Llave",
+    "Loby",
+    "localisée",
+    "localizzato",
+    "lockb",
+    "LOGLIB",
+    "logosu",
+    "Logosu",
+    "logotipo",
+    "Logotipo",
+    "Logowanie",
+    "lokalisiert",
+    "Lokalizacja",
+    "lokalnego",
+    "Lokasi",
+    "löschen",
+    "loslegen",
+    "Lütfen",
+    "Maalesef",
+    "madrun",
+    "maestra",
+    "magasin",
+    "Magasin",
+    "magasins",
+    "Magasins",
+    "mağaza",
+    "Mağaza",
+    "mağazalar",
+    "Mağazalar",
+    "mağazalardan",
+    "mağazaları",
+    "Mağazalarımızdan",
+    "mağazanızı",
+    "maggiori",
+    "magicast",
+    "mahu",
+    "maile",
+    "mailem",
+    "maintenant",
+    "Maintenez",
+    "Maison",
+    "maklumat",
+    "Malangnya",
+    "Małe",
+    "Malheureusement",
+    "manière",
+    "Manipula",
+    "Manipulasi",
+    "manipulieren",
+    "Manipuluj",
+    "manquez",
+    "mantap",
+    "Mantap",
+    "Mantén",
+    "Mantieni",
+    "Marketingowe",
+    "Martell",
+    "Masa",
+    "masih",
+    "masuk",
+    "Masuk",
+    "Masz",
+    "Mata",
+    "Matlamat",
+    "mehr",
+    "Mehr",
+    "Meilleur",
+    "meilleurs",
+    "mejor",
+    "Mejora",
+    "Mejorada",
+    "mejores",
+    "Melalui",
+    "Melayu",
+    "Melden",
+    "melihat",
+    "melompat",
+    "memaklumkan",
+    "memasang",
+    "membantu",
+    "membeli",
+    "Membeli",
+    "memilih",
+    "mempercepatkan",
+    "mempunyai",
+    "Memuat",
+    "memulakan",
+    "menakjubkan",
+    "Menarik",
+    "menawarkan",
+    "mencipta",
+    "menderma",
+    "Menderma",
+    "mené",
+    "Menegak",
+    "menerima",
+    "Mengapa",
+    "Menge",
+    "Mengemas",
+    "mengenai",
+    "Mengenai",
+    "mengesahkan",
+    "mengetahui",
+    "Menggabungkan",
+    "menggunakan",
+    "Menggunakan",
+    "menghadapi",
+    "Mengikut",
+    "Menguntungkan",
+    "Meningkatkan",
+    "Mensaje",
+    "menú",
+    "Menü",
+    "menukar",
+    "Menüler",
+    "menunggu",
+    "Menús",
+    "Menüs",
+    "menüyü",
+    "Menüyü",
+    "Mesaj",
+    "Mesej",
+    "mesra",
+    "messagerie",
+    "messaggio",
+    "Messaggio",
+    "Mettre",
+    "Mevcut",
+    "mevcuttur",
+    "midsole",
+    "midsoles",
+    "miejsce",
+    "Miglior",
+    "Migliora",
+    "Migliorata",
+    "migliori",
+    "Mikey",
+    "Miktar",
+    "Mingguan",
+    "minit",
+    "minnettar",
+    "minut",
+    "Minuten",
+    "minuti",
+    "minutos",
+    "Mises",
+    "misiniz",
+    "Misrefactored",
+    "mısınız",
+    "mkdist",
+    "Mkey",
+    "möchten",
+    "Modèle",
+    "Modello",
+    "Moden",
+    "Moderno",
+    "Modifica",
+    "modifiche",
+    "modifiez",
+    "mogą",
+    "mogę",
+    "mógł",
+    "möglicherweise",
+    "Möglichkeiten",
+    "Monedas",
+    "montag",
+    "Mostra",
+    "Motyw",
+    "movido",
+    "Możesz",
+    "możliwości",
+    "można",
+    "muat",
+    "Muat",
+    "Mudah",
+    "Muestra",
+    "mümkün",
+    "mundo",
+    "mungkin",
+    "Müşteri",
+    "n'existe",
+    "nach",
+    "Nachricht",
+    "Nächste",
+    "Nächster",
+    "nächstes",
+    "Nächstes",
+    "nadal",
+    "Nagłówek",
+    "Nagłówki",
+    "nagłówkiem",
+    "Nagrywać",
+    "nahtlos",
+    "Nahtlose",
+    "Naik",
+    "Najbardziej",
+    "Najlepsze",
+    "najlepszych",
+    "najnowsze",
+    "Namen",
+    "nami",
+    "napotkaliśmy",
+    "narzędziami",
+    "nasıl",
+    "Nasıl",
+    "Następna",
+    "Następny",
+    "nasze",
+    "naszych",
+    "Natsume",
+    "Natychmiastowe",
+    "navegación",
+    "Navegación",
+    "navegador",
+    "navigasi",
+    "Navigasi",
+    "navigateur",
+    "navigazione",
+    "Navigazione",
+    "navwithcompactpageheader",
+    "nawiązać",
+    "nawigacja",
+    "Nawigacja",
+    "nawigacją",
+    "Nazar",
+    "Nazarii",
+    "Nazwa",
+    "nazwą",
+    "Nazwy",
+    "necesarias",
+    "necesarios",
+    "nécessaires",
+    "necessari",
+    "neden",
+    "Negara",
+    "negozi",
+    "Negozi",
+    "negozio",
+    "Negozio",
+    "nelerin",
+    "Nelerin",
+    "nella",
+    "nenc",
+    "neondatabase",
+    "Nessun",
+    "Nessuna",
+    "neue",
+    "Neue",
+    "neuen",
+    "Neuen",
+    "Neuer",
+    "Neues",
+    "neuesten",
+    "Neversoft",
+    "Niaga",
+    "nicht",
+    "Niemcy",
+    "niemieckie",
+    "nieograniczone",
+    "Niestety",
+    "niezbędne",
+    "Niveaux",
+    "Niveles",
+    "noch",
+    "Noch",
+    "nocheck",
+    "nodenext",
+    "nombre",
+    "Nombre",
+    "nombres",
+    "Nombres",
+    "nomi",
+    "Nomi",
+    "Noninteractive",
+    "Nosotros",
+    "nostre",
+    "nostri",
+    "notificarnos",
+    "Notis",
+    "notwendigen",
+    "nouvelles",
+    "novu",
+    "Novu",
+    "nowa",
+    "nową",
+    "Nowe",
+    "nowoczesne",
+    "Nowoczesny",
+    "nowy",
+    "Nowy",
+    "nowych",
+    "npmjs",
+    "ntqry",
+    "nuestra",
+    "nuestras",
+    "nuestros",
+    "nueva",
+    "Nueva",
+    "nuevas",
+    "nuevo",
+    "nums",
+    "nuova",
+    "Nuova",
+    "nuove",
+    "nuovo",
+    "Nuovo",
+    "nuqs",
+    "nutzen",
+    "Nutzung",
+    "Nutzungsbedingungen",
+    "nypm",
+    "Obejmuje",
+    "Obietnica",
+    "Obliczone",
+    "obraz",
+    "obrazy",
+    "Obrazy",
+    "ochronie",
+    "Ocurrió",
+    "ödeme",
+    "Ödeme",
+    "Ödemede",
+    "ödemeleri",
+    "odpowiednio",
+    "Odrzucać",
+    "Odśwież",
+    "Odwiedź",
+    "odwiedzaną",
+    "œuvre",
+    "oferuje",
+    "ofetch",
+    "offre",
+    "ofrece",
+    "Ögeler",
+    "ögeyi",
+    "Ögeyi",
+    "ohne",
+    "okazji",
+    "Określony",
+    "olabilir",
+    "olan",
+    "olarak",
+    "olasılıklar",
+    "Olay",
+    "oleh",
+    "ollies",
+    "olmak",
+    "olmamış",
+    "olun",
+    "oluruz",
+    "oluştu",
+    "Oluştur",
+    "oluşturma",
+    "Oluşturma",
+    "oluşturmaya",
+    "oluşturun",
+    "önce",
+    "Önceki",
+    "önerilir",
+    "onwidget",
+    "opengraph",
+    "Opis",
+    "opisu",
+    "opłat",
+    "optim",
+    "optionception",
+    "Orario",
+    "Ordenar",
+    "Ordina",
+    "originale",
+    "orijinal",
+    "örneği",
+    "Örnek",
+    "oryginalnym",
+    "Oscuro",
+    "osoby",
+    "otra",
+    "otro",
+    "oturum",
+    "Oturum",
+    "Oturumu",
+    "Oturumun",
+    "outils",
+    "outro",
+    "Oyun",
+    "Özel",
+    "özellikler",
+    "özelliklere",
+    "Özelliklerimizi",
+    "pada",
+    "Padam",
+    "Paese",
+    "paesi",
+    "Paga",
+    "pagamenti",
+    "pagamento",
+    "Pagamento",
+    "pagar",
+    "Pagar",
+    "pagare",
+    "pagedown",
+    "pageup",
+    "pagina",
+    "Pagina",
+    "Página",
+    "pago",
+    "pagos",
+    "Paiement",
+    "paiements",
+    "País",
+    "países",
+    "Pamerkan",
+    "Paneli",
+    "Pangkalan",
+    "Pannello",
+    "Pantas",
+    "Papan",
+    "parallelly",
+    "paramètres",
+    "Paramètres",
+    "Parkay",
+    "Parque",
+    "Partecipa",
+    "pasa",
+    "Pasek",
+    "paska",
+    "pasku",
+    "passando",
+    "Passwort",
+    "pasti",
+    "patrocinador",
+    "patrocinadores",
+    "Pautan",
+    "payants",
+    "Pazarlama",
+    "pedido",
+    "pelan",
+    "Pelan",
+    "Pelanggan",
+    "Pelayan",
+    "pelayar",
+    "peluang",
+    "pemasangan",
+    "Pemasaran",
+    "pembangun",
+    "Pembangun",
+    "pembangunan",
+    "Pembangunan",
+    "pembayaran",
+    "Pembelian",
+    "Pembinaan",
+    "Pemuka",
+    "pemula",
+    "Pemutar",
+    "Penaja",
+    "Penapis",
+    "penerangan",
+    "Penerangan",
+    "pengalaman",
+    "Pengalaman",
+    "Pengebilan",
+    "pengeluaran",
+    "pengesahan",
+    "Pengesahan",
+    "pengguna",
+    "Pengguna",
+    "Penghantaran",
+    "Pentadbir",
+    "Penyahpepijat",
+    "penyedia",
+    "Penyedia",
+    "Pequeñas",
+    "Peranan",
+    "Perché",
+    "percorsi",
+    "percorso",
+    "percuma",
+    "Percuma",
+    "perdertelo",
+    "perfil",
+    "performansı",
+    "Pergi",
+    "periksa",
+    "Periksa",
+    "Perkhidmatan",
+    "personne",
+    "Perubahan",
+    "pesanan",
+    "Pesanan",
+    "Peut",
+    "peuvent",
+    "pewno",
+    "pfadnamen",
+    "Pfadnamen",
+    "phares",
+    "piani",
+    "Piani",
+    "piattaforma",
+    "Piccole",
+    "picocolors",
+    "pieniądze",
+    "pierdas",
+    "Pihak",
+    "pilihan",
+    "pionowa",
+    "pixelperfektion",
+    "plac",
+    "placu",
+    "plakietkę",
+    "planami",
+    "Planen",
+    "Plänen",
+    "planetscale",
+    "Planı",
+    "planları",
+    "planlarla",
+    "Plantilla",
+    "Plany",
+    "plataforma",
+    "plateforme",
+    "platformunuzu",
+    "platformy",
+    "płatności",
+    "płatnymi",
+    "Plattform",
+    "Platz",
+    "playemnts",
+    "plik",
+    "pliki",
+    "Płynna",
+    "płynnego",
+    "pmndrs",
+    "pocztowy",
+    "poczty",
+    "Podatki",
+    "Poder",
+    "Podkategoria",
+    "Podłącz",
+    "podría",
+    "podróż",
+    "Pogląd",
+    "Pokaż",
+    "połączone",
+    "połączony",
+    "Polecane",
+    "Politica",
+    "Política",
+    "Politikası",
+    "Politique",
+    "Polityka",
+    "polski",
+    "Polyvalente",
+    "pomocą",
+    "ponctuels",
+    "poniżej",
+    "ponownie",
+    "Poprzedni",
+    "Poprzednia",
+    "poprzez",
+    "posibilidades",
+    "Posizione",
+    "Poskod",
+    "possibilità",
+    "possibilités",
+    "posso",
+    "possono",
+    "posta",
+    "postaları",
+    "postale",
+    "postayı",
+    "Postleitzahl",
+    "posto",
+    "postów",
+    "postthreadlist",
+    "posty",
+    "poszło",
+    "potentes",
+    "Potentes",
+    "potenti",
+    "Potenti",
+    "Potenza",
+    "potessi",
+    "Potężne",
+    "Potong",
+    "potrebbe",
+    "potwierdzić",
+    "Pourquoi",
+    "pourrait",
+    "pouvez",
+    "pouviez",
+    "powiadomić",
+    "Powłoki",
+    "powrotem",
+    "Poziomy",
+    "Poznaj",
+    "później",
+    "praca",
+    "Präferenzen",
+    "prawa",
+    "prawej",
+    "précédent",
+    "precedente",
+    "précédente",
+    "Precio",
+    "Precios",
+    "Preconfigured",
+    "predefinita",
+    "predeterminado",
+    "préférences",
+    "Préférences",
+    "preferencias",
+    "Preferencias",
+    "preferencjami",
+    "preferencje",
+    "Preferencje",
+    "preferenze",
+    "Preferenze",
+    "prego",
+    "Preguntas",
+    "Preis",
+    "Preise",
+    "prenota",
+    "prestasi",
+    "prestazioni",
+    "prêt",
+    "Prêt",
+    "prêts",
+    "Prezzi",
+    "Prezzo",
+    "principalement",
+    "principalmente",
+    "printj",
+    "privacidad",
+    "privacynoticerightaligned",
+    "privada",
+    "Privasi",
+    "privata",
+    "privaten",
+    "privée",
+    "privilèges",
+    "privilegi",
+    "privilegios",
+    "Probar",
+    "problemas",
+    "problemów",
+    "proces",
+    "proceso",
+    "Proceso",
+    "processo",
+    "Processo",
+    "processus",
+    "Processus",
+    "prodotti",
+    "Prodotti",
+    "prodotto",
+    "Prodotto",
+    "producción",
+    "producto",
+    "Producto",
+    "productos",
+    "Productos",
+    "productsctx",
+    "produit",
+    "Produit",
+    "produite",
+    "produits",
+    "Produits",
+    "produk",
+    "Produk",
+    "produkcji",
+    "produkt",
+    "Produktdetails",
+    "Produkte",
+    "Produktion",
+    "produktionsbereit",
+    "Produktkatalog",
+    "produktów",
+    "produktu",
+    "produkty",
+    "Produkty",
+    "produzione",
+    "profil",
+    "profilinizde",
+    "profilo",
+    "profilu",
+    "programistów",
+    "Proje",
+    "promesa",
+    "Promesa",
+    "Promessa",
+    "promesse",
+    "Promesse",
+    "pronti",
+    "propos",
+    "Prossimamente",
+    "prossimo",
+    "Prosty",
+    "Proszę",
+    "Prova",
+    "provare",
+    "proveedor",
+    "Próxima",
+    "próximamente",
+    "Prozess",
+    "prueba",
+    "prywatnej",
+    "prywatności",
+    "Prządka",
+    "przed",
+    "przegap",
+    "Przeglądaj",
+    "przeglądarki",
+    "przejść",
+    "Przekaż",
+    "przekazywania",
+    "Przełącz",
+    "przełączając",
+    "przeniesiony",
+    "Prześlij",
+    "przy",
+    "przycisków",
+    "przyjemny",
+    "przykład",
+    "przykładowy",
+    "przyspieszyć",
+    "Przytnij",
+    "publicación",
+    "publicaciones",
+    "Publicar",
+    "pudiera",
+    "puede",
+    "pueden",
+    "Puedes",
+    "puedo",
+    "puissantes",
+    "Puissants",
+    "pulsanti",
+    "Puoi",
+    "Purtroppo",
+    "pusty",
+    "pytania",
+    "Qualcosa",
+    "Quantità",
+    "Quantité",
+    "Quelque",
+    "questa",
+    "questi",
+    "questo",
+    "Quitar",
+    "radice",
+    "Raíz",
+    "ralat",
+    "rangkaian",
+    "rapidamente",
+    "rápidamente",
+    "rapide",
+    "rapidement",
+    "rápido",
+    "ratelimit",
+    "rawlist",
+    "Razem",
+    "Recadrer",
+    "recargar",
+    "Rechercher",
+    "Rechte",
+    "rechtsbündig",
+    "recomienda",
+    "recommandé",
+    "reconnaissants",
+    "Recortar",
+    "recurrentes",
+    "récurrents",
+    "recurso",
+    "redéfini",
+    "redefinido",
+    "Réessayez",
+    "référentiel",
+    "regionalne",
+    "régionaux",
+    "Regístrate",
+    "Registrati",
+    "Registrazione",
+    "registrieren",
+    "Registrieren",
+    "Registro",
+    "rehype",
+    "reibungslose",
+    "Reimposta",
+    "Réinitialiser",
+    "Reise",
+    "Rejeter",
+    "Rejoignez",
+    "reka",
+    "Rekod",
+    "reli",
+    "consola",
+    "Relivator",
+    "reliverse",
+    "rencontré",
+    "Renderowanie",
+    "rendimiento",
+    "Rendu",
+    "renombrado",
+    "renommée",
+    "repositori",
+    "repositorio",
+    "repozytorium",
+    "Representación",
+    "réseauter",
+    "reserva",
+    "Reservados",
+    "réservés",
+    "réservez",
+    "reservieren",
+    "Resimleri",
+    "Resmi",
+    "ressource",
+    "Restablecer",
+    "resultados",
+    "résultat",
+    "Retour",
+    "revenir",
+    "Revivez",
+    "ricaricare",
+    "ricco",
+    "Ricontrolla",
+    "ricorrenti",
+    "ridefinito",
+    "Righe",
+    "Rilascia",
+    "rilascio",
+    "Rimuovi",
+    "rinominata",
+    "ripercorribile",
+    "riprova",
+    "Riprova",
+    "riprovare",
+    "riscontrato",
+    "riservatezza",
+    "riservati",
+    "risorsa",
+    "risultato",
+    "Ritaglia",
+    "Rivia",
+    "rmiz",
+    "Robusta",
+    "robuste",
+    "Robuste",
+    "Robustes",
+    "robusto",
+    "rolę",
+    "rôle",
+    "Rolünü",
+    "Routen",
+    "Rozdzielczość",
+    "rozeti",
+    "Rozliczenia",
+    "Rozwój",
+    "rozwoju",
+    "ruolo",
+    "ruta",
+    "rutas",
+    "rxvt",
+    "Şablonu",
+    "sağa",
+    "Sağlam",
+    "sağlayıcı",
+    "Sağlayıcı",
+    "sahaja",
+    "sahip",
+    "Sahkan",
+    "saklıdır",
+    "salió",
+    "Salva",
+    "Sambungkan",
+    "sangat",
+    "saremmo",
+    "Şartları",
+    "satın",
+    "Satın",
+    "satır",
+    "satu",
+    "Satu",
+    "saya",
+    "sayfa",
+    "Sayfa",
+    "sayfadaki",
+    "sayfası",
+    "Sayfası",
+    "sayfasını",
+    "Sayfaya",
+    "sbuf",
+    "scegliere",
+    "Schaltflächen",
+    "schauen",
+    "Schauen",
+    "schiefgelaufen",
+    "Schließen",
+    "schnell",
+    "schneller",
+    "ścieżek",
+    "ścieżki",
+    "Scopri",
+    "Scuro",
+    "sebagai",
+    "Sebelum",
+    "Sebelumnya",
+    "secara",
+    "seçmeliyim",
+    "Secondaire",
+    "secondaria",
+    "secundaria",
+    "Sécurisée",
+    "sécurisées",
+    "sedia",
+    "seferlik",
+    "Segera",
+    "segnalarci",
+    "Seguir",
+    "Segura",
+    "seguras",
+    "seguro",
+    "sehen",
+    "Sehen",
+    "sehr",
+    "Seite",
+    "Seitenleiste",
+    "Seitenleisten",
+    "sekadar",
+    "Sekali",
+    "sekarang",
+    "Sekarang",
+    "şekilde",
+    "Sekunder",
+    "Selamat",
+    "selección",
+    "seleccionar",
+    "seluruh",
+    "Seluruh",
+    "Semak",
+    "semanal",
+    "Semanal",
+    "semasa",
+    "Semasa",
+    "semua",
+    "Semua",
+    "semula",
+    "Semula",
+    "Senarai",
+    "sencilla",
+    "sentencer",
+    "senza",
+    "Sepanduk",
+    "Sepanyol",
+    "Sepet",
+    "Sepete",
+    "Sepeti",
+    "Sepetiniz",
+    "Sepetle",
+    "serba",
+    "serions",
+    "Seronok",
+    "Sertai",
+    "serveur",
+    "Serveur",
+    "servicio",
+    "servidor",
+    "Servidor",
+    "servizio",
+    "Serwer",
+    "serwera",
+    "Sesi",
+    "sesión",
+    "sesiones",
+    "sesji",
+    "sessione",
+    "sessionprovider",
+    "Sesuatu",
+    "Seterusnya",
+    "settimanale",
+    "seule",
+    "sewajarnya",
+    "şeyler",
+    "shadcn",
+    "shiki",
+    "Siaran",
+    "sich",
+    "sicher",
+    "Sicher",
+    "Sichere",
+    "Sicht",
+    "Sicura",
+    "sicure",
+    "sicuro",
+    "sidebarwithheader",
+    "sido",
+    "siehe",
+    "Şifre",
+    "Şifreyi",
+    "sigin",
+    "signup",
+    "Siguiente",
+    "Sila",
+    "Silverhand",
+    "Şimdi",
+    "Şimdiden",
+    "Simgelerle",
+    "Simpan",
+    "sini",
+    "sinistra",
+    "Sipariş",
+    "Siparişi",
+    "sistem",
+    "Sistem",
+    "sistemi",
+    "sisteransi",
+    "sitesi",
+    "sitesinin",
+    "sitio",
+    "sito",
+    "Sitzung",
+    "Sitzungsdaten",
+    "sıfırla",
+    "Sıkça",
+    "sınırsız",
+    "sırala",
+    "sklep",
+    "Sklep",
+    "sklepach",
+    "sklepów",
+    "sklepu",
+    "sklepy",
+    "Sklepy",
+    "skontaktować",
+    "Slaid",
+    "slajd",
+    "slayt",
+    "Soalan",
+    "sobre",
+    "Sofortspenden",
+    "Soggetto",
+    "sokongan",
+    "Sokongan",
+    "Solidna",
+    "Solidny",
+    "sonner",
+    "sono",
+    "sonra",
+    "Sonraki",
+    "sont",
+    "Sonuç",
+    "soporte",
+    "Soporte",
+    "Sortieren",
+    "Sortuj",
+    "Sorulan",
+    "Sorular",
+    "sorunsuz",
+    "sostenere",
+    "sotto",
+    "Sottocategoria",
+    "Soumettre",
+    "soutenir",
+    "soutien",
+    "spagnolo",
+    "Spalten",
+    "Spanisch",
+    "später",
+    "specifico",
+    "spécifique",
+    "Spedizione",
+    "speichern",
+    "spenden",
+    "Spenden",
+    "Spendenstufen",
+    "Spezifisches",
+    "Spielplatz",
+    "Spis",
+    "społeczności",
+    "sponsora",
+    "Sponsoren",
+    "Sponsorenabzeichen",
+    "Sponsorlarımızı",
+    "Sponsorów",
+    "sposób",
+    "Sposoby",
+    "spostata",
+    "Sprache",
+    "Sprachen",
+    "Sprawdź",
+    "spróbować",
+    "Spróbuj",
+    "Stabil",
+    "Stabilny",
+    "stackedwithfooteractions",
+    "Standardsprache",
+    "starten",
+    "Startseite",
+    "stata",
+    "stavi",
+    "Steuern",
+    "stilizzati",
+    "stimmen",
+    "stopki",
+    "storto",
+    "Streakfly",
+    "Strona",
+    "stronę",
+    "stronie",
+    "strony",
+    "strumenti",
+    "stylisés",
+    "stylizowanymi",
+    "Subcategoría",
+    "subchoices",
+    "subcomponents",
+    "Subir",
+    "Subjek",
+    "Subkategori",
+    "subprocesos",
+    "subskrypcją",
+    "Subskrypcje",
+    "subskrypcji",
+    "subskrypcyjne",
+    "successiva",
+    "successivo",
+    "Suche",
+    "suchen",
+    "Suchen",
+    "Sudah",
+    "Suelta",
+    "suivant",
+    "Suivant",
+    "suivante",
+    "suivre",
+    "Sujet",
+    "Sujeto",
+    "sujets",
+    "Sumbangan",
+    "Sumber",
+    "sunar",
+    "şunları",
+    "Sunting",
+    "Sunucu",
+    "superapp",
+    "supplémentaires",
+    "supporto",
+    "Supporto",
+    "Supprimer",
+    "süreç",
+    "süreci",
+    "sürüm",
+    "survenue",
+    "suscripción",
+    "Suscripciones",
+    "Susun",
+    "Sütunları",
+    "sviluppatori",
+    "sviluppo",
+    "Sviluppo",
+    "svolto",
+    "Swasta",
+    "świata",
+    "Światło",
+    "świecie",
+    "swoim",
+    "swoimi",
+    "swój",
+    "Symbolen",
+    "système",
+    "Système",
+    "Szablon",
+    "Szczegóły",
+    "Szukaj",
+    "szybki",
+    "szybko",
+    "Szybko",
+    "Tabela",
+    "Tabella",
+    "tablero",
+    "tablicę",
+    "Tablosu",
+    "Tahap",
+    "Tahta",
+    "Tajuk",
+    "talian",
+    "Talian",
+    "talimatları",
+    "Taman",
+    "Tambah",
+    "tambahan",
+    "Tanım",
+    "Tanımlandı",
+    "tanpa",
+    "tant",
+    "tantum",
+    "taraf",
+    "Tarafında",
+    "tarafından",
+    "tarayıcı",
+    "tard",
+    "tardi",
+    "Targ",
+    "Targaryen",
+    "Tarifs",
+    "Tarih",
+    "Tarihi",
+    "Tarikh",
+    "taşınmış",
+    "tasuku",
+    "tavola",
+    "tedesco",
+    "teknologi",
+    "tekrar",
+    "Tekrar",
+    "tekrarlanan",
+    "Tekrarlanan",
+    "telah",
+    "Telah",
+    "Télécharger",
+    "tema",
+    "Tema",
+    "Temat",
+    "Temayı",
+    "tempah",
+    "tempat",
+    "Templat",
+    "temprano",
+    "Terang",
+    "Terap",
+    "teratas",
+    "teraz",
+    "Terbaik",
+    "terceros",
+    "Tercihler",
+    "Tercihleri",
+    "tercihlerinizi",
+    "Terdapat",
+    "terhad",
+    "Terima",
+    "terkelg",
+    "terkini",
+    "terlebih",
+    "Terma",
+    "termasuk",
+    "Términos",
+    "termkit",
+    "Terokai",
+    "Terpelihara",
+    "ters",
+    "tersedia",
+    "Tersedia",
+    "Teruskan",
+    "terutama",
+    "terze",
+    "teşekkür",
+    "teşekkürler",
+    "Teslimat",
+    "Teslimatını",
+    "Testdaten",
+    "Testen",
+    "testowych",
+    "Testuj",
+    "Tetapan",
+    "Tetapkan",
+    "tête",
+    "Tête",
+    "têtes",
+    "Thema",
+    "thème",
+    "Thème",
+    "THPS",
+    "Tiada",
+    "Ticaret",
+    "Ticaretinizi",
+    "tidak",
+    "Tidak",
+    "tienda",
+    "Tienda",
+    "tiendas",
+    "Tiendas",
+    "tienes",
+    "Tindakan",
+    "Tingkatkan",
+    "tıklayın",
+    "todas",
+    "todavía",
+    "Toplam",
+    "topluluğa",
+    "Torna",
+    "Totale",
+    "toujours",
+    "tous",
+    "Tous",
+    "tożsamość",
+    "tramite",
+    "Transacciones",
+    "transakcje",
+    "Transaktionen",
+    "Transazioni",
+    "transmettez",
+    "través",
+    "troli",
+    "Troli",
+    "trouvé",
+    "trouvée",
+    "trovata",
+    "trovato",
+    "tseslint",
+    "Tukar",
+    "Tully",
+    "Tümünü",
+    "tunggu",
+    "turbopack",
+    "Türkçe",
+    "turso",
+    "TUTAJ",
+    "tutto",
+    "Tutup",
+    "Twój",
+    "twórcy",
+    "Twórz",
+    "tych",
+    "tylko",
+    "typebox",
+    "typecheck",
+    "typesafe",
+    "typesafety",
+    "typestat",
+    "Tyrell",
+    "über",
+    "Übergeben",
+    "überprüfen",
+    "Ubicación",
+    "ucraino",
+    "Ucranio",
+    "ücretli",
+    "ücretsiz",
+    "Ücretsiz",
+    "Üçüncü",
+    "ujian",
+    "Układy",
+    "Ukrainien",
+    "Ukrainisch",
+    "ukraiński",
+    "Ukrayna",
+    "Ulepsz",
+    "Ulepszone",
+    "Ülke",
+    "ultime",
+    "uluslararası",
+    "umbenannt",
+    "umiędzynarodowić",
+    "umschalten",
+    "Únase",
+    "unbegrenzte",
+    "Uncaptioned",
+    "Únete",
+    "únicas",
+    "uniwersalny",
+    "unjs",
+    "unkey",
+    "unpub",
+    "unsere",
+    "unseren",
+    "unslugify",
+    "unstub",
+    "unten",
+    "unterhaltsame",
+    "Unterkategorie",
+    "unterstützen",
+    "Unterstützung",
+    "untuk",
+    "UPLOADTHING",
+    "uprawnienia",
+    "Upuść",
+    "üretimdedir",
+    "üretime",
+    "ursprünglichen",
+    "ürün",
+    "Ürün",
+    "ürünler",
+    "Ürünler",
+    "ürünleri",
+    "Ürünü",
+    "Usando",
+    "usar",
+    "uscire",
+    "usermenu",
+    "usesession",
+    "ustalenia",
+    "ustawienia",
+    "Ustawienia",
+    "usuario",
+    "Usuario",
+    "Usuń",
+    "Utama",
+    "utente",
+    "Utente",
+    "utilisant",
+    "utilisateur",
+    "Utilisateur",
+    "utilisé",
+    "utiliser",
+    "Utiliser",
+    "utilisez",
+    "Utilisez",
+    "utilizando",
+    "Utilizar",
+    "utilizzato",
+    "utilizzi",
+    "Utrzymaj",
+    "Utwórz",
+    "uwierzytelniania",
+    "Uwierzytelnianie",
+    "Uyarı",
+    "Uygulama",
+    "uygulamayı",
+    "uygulanmadı",
+    "uygun",
+    "użyciem",
+    "Użyj",
+    "uzyskać",
+    "użytkownika",
+    "Używaj",
+    "używasz",
+    "vacío",
+    "valign",
+    "Valute",
+    "Varial",
+    "Varsayılan",
+    "vaul",
+    "vedere",
+    "Vedi",
+    "vedrai",
+    "velocemente",
+    "venir",
+    "venv",
+    "Veranstaltungsdatum",
+    "Veranstaltungsdetails",
+    "Veranstaltungslink",
+    "verás",
+    "Verbessern",
+    "Verbesserte",
+    "Verbinden",
+    "verbunden",
+    "verfügbar",
+    "Vergiler",
+    "Verifica",
+    "Verificar",
+    "verificato",
+    "Vérifier",
+    "Vérifiez",
+    "verileri",
+    "Verileri",
+    "Veritabanı",
+    "vernetzen",
+    "Veröffentlichung",
+    "verrà",
+    "verrez",
+    "Versand",
+    "versátil",
+    "Versátil",
+    "relivator",
+    "verschoben",
+    "versi",
+    "Versprechen",
+    "versuchen",
+    "Versuchen",
+    "verticale",
+    "Vertikale",
+    "Verwalten",
+    "verwenden",
+    "Verwenden",
+    "verwendet",
+    "Verwendung",
+    "Veuillez",
+    "veya",
+    "viaggio",
+    "viaje",
+    "Vicino",
+    "Vielen",
+    "Vielseitig",
+    "vielseitiges",
+    "viene",
+    "Visita",
+    "visitando",
+    "Visite",
+    "Visitez",
+    "visitiez",
+    "Visualizza",
+    "Visualizzazione",
+    "Víveres",
+    "voir",
+    "Voir",
+    "volants",
+    "volée",
+    "voler",
+    "Volver",
+    "Voraus",
+    "vorbehalten",
+    "vorbei",
+    "vorhanden",
+    "Vorherige",
+    "Vorheriger",
+    "Vorheriges",
+    "votre",
+    "Votre",
+    "vouloir",
+    "Vous",
+    "vsprintf",
+    "Vuelve",
+    "vuoto",
+    "wählen",
+    "Währungen",
+    "Waluty",
+    "wären",
+    "Warenkorb",
+    "Warenkorbartikeln",
+    "warten",
+    "Warum",
+    "Warunki",
+    "WCAG",
+    "wcześniej",
+    "Wczesny",
+    "Wdróż",
+    "wdrożone",
+    "wdzięczni",
+    "wechseln",
+    "według",
+    "Weltweit",
+    "wenn",
+    "Wenn",
+    "werden",
+    "Werkzeugen",
+    "wersje",
+    "wesprzeć",
+    "Whoo",
+    "Wiadomość",
+    "wiadomości",
+    "więcej",
+    "Więcej",
+    "wiederkehrende",
+    "Wiederkehrende",
+    "Wiersze",
+    "Willkommen",
+    "wird",
+    "Witamy",
+    "withicons",
+    "withleftalignednav",
+    "withsecondarynavigation",
+    "wkrótce",
+    "wöchentlichen",
+    "Wöchentlicher",
+    "Wróć",
+    "wsparcie",
+    "Wsparcie",
+    "wspierania",
+    "Wszechstronna",
+    "wszechstronny",
+    "Wszelkie",
+    "wszystkie",
+    "wujud",
+    "wurde",
+    "wybrać",
+    "Wybrałeś",
+    "Wycena",
+    "wydajność",
+    "wydanie",
+    "wydarzenia",
+    "wykorzystywane",
+    "wylogować",
+    "Wylogowano",
+    "Wyloguj",
+    "Wymeldować",
+    "wyników",
+    "wyrównana",
+    "wyrównaną",
+    "Wyślij",
+    "Wystąpił",
+    "wysuwane",
+    "Wysyłka",
+    "XONE",
+    "Yadxh",
+    "yakında",
+    "yalnızca",
+    "Yalnızca",
+    "yanından",
+    "yanlış",
+    "yapıldı",
+    "yapılır",
+    "Yapım",
+    "yapın",
+    "yapma",
+    "yapmak",
+    "Yaşayın",
+    "yeni",
+    "Yeni",
+    "yeniden",
+    "Yeniden",
+    "Yerel",
+    "yerelleştirilir",
+    "yerinizi",
+    "yığılmış",
+    "yolculuk",
+    "yolları",
+    "yollarını",
+    "yolu",
+    "yoluyla",
+    "Yönet",
+    "Yönetici",
+    "yönetin",
+    "yönlü",
+    "Youness",
+    "ytrewq",
+    "Yükle",
+    "yüklemeyi",
+    "Yükleniyor",
+    "Yuran",
+    "zaawansowane",
+    "zabaw",
+    "zacząć",
+    "zadawane",
+    "żadnych",
+    "Zahlen",
+    "Zahlungen",
+    "zainstalować",
+    "Zajrzyj",
+    "Zaktualizuj",
+    "zakupów",
+    "zakupy",
+    "Zakupy",
+    "załadować",
+    "Załadunek",
+    "Zalecane",
+    "zalogować",
+    "Zalogować",
+    "Zalogowany",
+    "Zaloguj",
+    "Zaman",
+    "Zamanı",
+    "Zamknąć",
+    "zamówienie",
+    "Zapisz",
+    "Zapłać",
+    "zapłacić",
+    "Zarejestruj",
+    "zarezerwuj",
+    "Zarządzaj",
+    "Zasób",
+    "zastrzeżone",
+    "Zaten",
+    "zawartość",
+    "zbudowania",
+    "Zbuduj",
+    "Zeigen",
+    "Zeilen",
+    "zengin",
+    "zgłosić",
+    "ziyaret",
+    "Ziyaret",
+    "zlokalizowany",
+    "zmiany",
+    "Zmień",
+    "zmienić",
+    "zmieniło",
+    "zmieniony",
+    "zmienisz",
+    "znaleziona",
+    "znaleziono",
+    "znaleziony",
+    "Zobacz",
+    "zobaczyć",
+    "zobaczysz",
+    "zostać",
+    "zostanie",
+    "Zresetuj",
+    "źródło",
+    "Zugang",
+    "Zugriff",
+    "zurück",
+    "Zurück",
+    "zurücksetzen",
+    "Zurückweisen",
+    "zusätzliche",
+    "zuschneiden",
+    "Zustellung",
+    "Zweryfikuj",
+    "Адмінка",
+    "Дашборд",
+    "Доставка",
+    "доставки",
+    "доставку",
+    "обрали",
+    "Українська",
+    "українську",
+    "अक्सर",
+    "अगला",
+    "अगली",
+    "अग्रिम",
+    "अंग्रेज़",
+    "अंग्रेजी",
+    "अंतर्राष्ट्रीयकृत",
+    "अतिरिक्त",
+    "अद्यतन",
+    "अधिक",
+    "अँधेरा",
+    "अनुप्रयोग",
+    "अनुभव",
+    "अनुसार",
+    "अन्वेषण",
+    "अपडेट",
+    "अपना",
+    "अपनी",
+    "अपने",
+    "अपलोड",
+    "अभिलेख",
+    "असीमित",
+    "आइकन",
+    "आइटम",
+    "आज़माएं",
+    "आदेश",
+    "आधुनिक",
+    "आपका",
+    "आपको",
+    "आभारी",
+    "आरक्षित",
+    "आवर्ती",
+    "आवश्यक",
+    "आसान",
+    "आसानी",
+    "इनवर्टोकैट",
+    "इमेज",
+    "इमेजिस",
+    "इसके",
+    "इंस्टॉल",
+    "इंस्टॉलेशन",
+    "ईकॉमर्स",
+    "ईमेल",
+    "उत्पाद",
+    "उत्पादCtx",
+    "उत्पादन",
+    "उत्पादो",
+    "उदाहरण",
+    "उन्नत",
+    "उपकरण",
+    "उपयोग",
+    "उपयोगकर्ता",
+    "उपलब्ध",
+    "उपश्रेणी",
+    "एकमुश्त",
+    "एकीकरण",
+    "एडिटर",
+    "एड्रेस",
+    "एप्लिकेशन",
+    "ऑनलाइन",
+    "कनेक्ट",
+    "करके",
+    "करता",
+    "करना",
+    "करने",
+    "कर्सर",
+    "कार्ट",
+    "कार्यात्मक",
+    "किया",
+    "किसी",
+    "कीमत",
+    "कृपया",
+    "केवल",
+    "कैनरी",
+    "कैसे",
+    "कॉफ़",
+    "कॉमर्स",
+    "कॉलम",
+    "क्या",
+    "क्यो",
+    "क्रमबद्ध",
+    "क्रियाओं",
+    "क्रॉप",
+    "क्लाइंट",
+    "क्लिक",
+    "खरीद",
+    "खरीदारी",
+    "खरीदे",
+    "खाता",
+    "खाते",
+    "खाली",
+    "खोजना",
+    "खोजे",
+    "गणना",
+    "गूगल",
+    "गोपनीयता",
+    "ग्राहक",
+    "घटको",
+    "घटना",
+    "चुने",
+    "चूके",
+    "चेकआउट",
+    "छविया",
+    "छोटा",
+    "छोड़",
+    "जर्मन",
+    "जर्मनी",
+    "जल्द",
+    "जल्दी",
+    "जाएँ",
+    "जाएं",
+    "जाता",
+    "जाती",
+    "जानकारी",
+    "जाना",
+    "जाने",
+    "जारी",
+    "जुड़",
+    "जेएस",
+    "जोड़",
+    "टीबीडी",
+    "टेम्पलेट",
+    "टॉगल",
+    "डार्क",
+    "डिज़",
+    "डिफ़",
+    "डिबग",
+    "डिलिवरी",
+    "डिलीवरी",
+    "डिस्कोर्ड",
+    "डीबग",
+    "डेटा",
+    "डेटाबेस",
+    "डेवलपर",
+    "डेवलपर्स",
+    "डैशबोर्ड",
+    "तत्व",
+    "तदनुसार",
+    "तरीका",
+    "तरीके",
+    "तालिका",
+    "तिथि",
+    "तुरंत",
+    "तृतीय",
+    "तेज़",
+    "तैनात",
+    "तैयार",
+    "त्रुटि",
+    "त्वरित",
+    "दाएँ",
+    "दाखिल",
+    "दिखाई",
+    "दिखाएँ",
+    "दिना",
+    "दिया",
+    "दुकान",
+    "दुनिया",
+    "दुर्भाग्य",
+    "दूसरा",
+    "दूसरे",
+    "देखना",
+    "देखने",
+    "देखे",
+    "देगा",
+    "देते",
+    "देना",
+    "देशो",
+    "दोबारा",
+    "द्वारा",
+    "धन्यवाद",
+    "नकार",
+    "नवीनतम",
+    "निजी",
+    "निर्देश",
+    "निर्धारण",
+    "निर्धारित",
+    "निर्माणाधीन",
+    "नीचे",
+    "नीति",
+    "नेक्स्ट",
+    "नेटवर्क",
+    "नेविगेशन",
+    "नोवु",
+    "न्यूज़लैटर",
+    "पंक्तिया",
+    "पक्ष",
+    "पथनाम",
+    "पथनामो",
+    "परिणाम",
+    "परिभाषित",
+    "परिवर्तनो",
+    "परीक्षण",
+    "पहचान",
+    "पहले",
+    "पासवर्ड",
+    "पिछला",
+    "पिछली",
+    "पीछे",
+    "पुनः",
+    "पुष्टि",
+    "पूछे",
+    "पृष्ठ",
+    "पेपैल",
+    "पैट्रियन",
+    "पैसे",
+    "पोस्ट",
+    "पोस्टथ्रेडलिस्ट",
+    "प्रक्रिया",
+    "प्रणाली",
+    "प्रति",
+    "प्रतीक",
+    "प्रतीक्षा",
+    "प्रत्यक्ष",
+    "प्रदर्शन",
+    "प्रदर्शित",
+    "प्रदाता",
+    "प्रदान",
+    "प्रबंधित",
+    "प्रमाणीकरण",
+    "प्रयास",
+    "प्रश्नो",
+    "प्राइवेसीनोटिसराइटएलाइन्ड",
+    "प्राथमिकताएँ",
+    "प्राथमिकताएं",
+    "प्रायोजक",
+    "प्रोडक्टस",
+    "प्रोफ़",
+    "प्लेग्राउंड",
+    "प्लेटफॉर्म",
+    "फिल्टर",
+    "फोटो",
+    "बचाओ",
+    "बटनो",
+    "बदलते",
+    "बदला",
+    "बदले",
+    "बनाए",
+    "बनाएं",
+    "बनाने",
+    "बहुत",
+    "बहुमुखी",
+    "बाईं",
+    "बारे",
+    "बिना",
+    "बिलि",
+    "बेहतर",
+    "बैकएंड",
+    "बैनर",
+    "बोर्ड",
+    "बोली",
+    "ब्राउज़र",
+    "ब्लॉग",
+    "भंडार",
+    "भाषा",
+    "भाषाएँ",
+    "भुगतान",
+    "भूमिका",
+    "मजबूत",
+    "मात्रा",
+    "माध्यम",
+    "मार्गो",
+    "मिनट",
+    "मिला",
+    "मिले",
+    "मुख्य",
+    "मुद्राएँ",
+    "मुफ्त",
+    "मूल्य",
+    "मेनू",
+    "मेरे",
+    "मैदान",
+    "मौजूद",
+    "यात्रा",
+    "युक्त",
+    "यूआरएल",
+    "यूक्रेनी",
+    "योजना",
+    "योजनाएँ",
+    "योजनाओं",
+    "रिपॉजिटरी",
+    "रिलिवर्स",
+    "रिलीज़",
+    "रिलीवेटर",
+    "रीलिवर्स",
+    "रीसेट",
+    "रोशनी",
+    "लचीला",
+    "लाइट",
+    "लाईआउट",
+    "लागू",
+    "लेआउट",
+    "लेनदेन",
+    "लोकलहोस्ट",
+    "लोगो",
+    "वर्ग",
+    "वर्टिकल",
+    "वर्तमान",
+    "वादा",
+    "वादे",
+    "वापस",
+    "वापसी",
+    "वामसंरेखितNav",
+    "वाला",
+    "वाले",
+    "विकास",
+    "विपणन",
+    "विवरण",
+    "विशिष्ट",
+    "विशेष",
+    "विशेषाधिकार",
+    "विषय",
+    "वीकली",
+    "वेबसाइट",
+    "वैश्विक",
+    "व्यक्ति",
+    "व्यवस्थापक",
+    "शक्ति",
+    "शक्तिशाली",
+    "शर्ते",
+    "शानदार",
+    "शामिल",
+    "शिपि",
+    "शीघ्र",
+    "शुरू",
+    "शुल्क",
+    "सकता",
+    "सकती",
+    "सकते",
+    "सत्यापित",
+    "सत्र",
+    "सदस्यता",
+    "सदस्यताएं",
+    "संदेश",
+    "संपन्न",
+    "संपर्क",
+    "संपादित",
+    "सबसे",
+    "सबुक",
+    "संभावनाओं",
+    "समर्थन",
+    "समुदाय",
+    "संरेखित",
+    "सर्व",
+    "सर्वर",
+    "सर्वाधिकार",
+    "सर्वोत्तम",
+    "संसाधन",
+    "सहमति",
+    "सहायता",
+    "सहेजे",
+    "साइड",
+    "साइडबार",
+    "साइडबारविथहेडर",
+    "साइन",
+    "सामग्री",
+    "सामना",
+    "सिफारिश",
+    "सिस्टम",
+    "सुधारे",
+    "सुनिश्चित",
+    "सुरक्षित",
+    "सुविधा",
+    "सुविधाओं",
+    "सूचना",
+    "सूचित",
+    "सूची",
+    "सेकेंडरीनेविगेशन",
+    "सेटि",
+    "सेवा",
+    "स्टार्टर",
+    "स्टोर",
+    "स्तर",
+    "स्थान",
+    "स्थानांतरित",
+    "स्थानीयकृत",
+    "स्थिर",
+    "स्पिनर",
+    "स्पैनिश",
+    "स्लाइड",
+    "स्वागत",
+    "स्विच",
+    "स्वीकार",
+    "हटाएँ",
+    "हटाएं",
+    "हमसे",
+    "हमारी",
+    "हमारे",
+    "हिन्दी",
+    "हेडर",
+    "होने"
+  ]
+}
diff --git a/drizzle.config.ts b/drizzle.config.ts
index 95b5df01..86bf6a63 100644
--- a/drizzle.config.ts
+++ b/drizzle.config.ts
@@ -1,10 +1,10 @@
 import "dotenv/config";
-import { env } from "~/env";
 import { defineConfig } from "drizzle-kit";
 
+import { env } from "./src/env.js";
+
 export default defineConfig({
-  out: "./drizzle",
-  schema: "./src/db/schema/index.ts",
+  schema: "./src/server/db/schema/index.ts",
   dialect: "postgresql",
   dbCredentials: {
     url: env.DATABASE_URL,
diff --git a/eslint.config.js b/eslint.config.js
index 33d2f375..bd5c07c4 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -1,44 +1,49 @@
 // @ts-check
 
 import eslint from "@eslint/js";
-import tseslint from "typescript-eslint";
+// @ts-expect-error missing types
+import drizzle from "eslint-plugin-drizzle";
+import perfectionist from "eslint-plugin-perfectionist";
 import globals from "globals";
+import tseslint from "typescript-eslint";
 
 export default tseslint.config(
-  eslint.configs.recommended,
   {
-    ignores: ["**/.{git,next}/", "**/{node_modules,drizzle,public}/"],
+    ignores: ["**/.{git,next}/", "**/{node_modules}/"],
   },
+  eslint.configs.recommended,
+  ...tseslint.configs.strictTypeChecked,
+  ...tseslint.configs.stylisticTypeChecked,
   {
-    name: "@reliverse/eslint-config/core",
-    extends: [
-      ...tseslint.configs.strictTypeChecked,
-      ...tseslint.configs.stylisticTypeChecked,
-    ],
-    files: ["**/*.{js,ts,tsx}"],
     languageOptions: {
       globals: {
         ...globals.builtin,
         ...globals.browser,
-        ...globals.es2024,
+        ...globals.es2022,
         ...globals.node,
       },
-      parser: tseslint.parser,
       parserOptions: {
-        ecmaFeatures: {
-          impliedStrict: true,
-          jsx: true,
-        },
-        project: true,
+        projectService: true,
         tsconfigRootDir: import.meta.dirname,
         warnOnUnsupportedTypeScriptVersion: false,
       },
     },
+  },
+  {
+    files: ["**/*.js"],
+    ...tseslint.configs.disableTypeChecked,
+  },
+  {
+    files: ["**/*.{js,ts,tsx}"],
     plugins: {
-      "@typescript-eslint": tseslint.plugin,
+      perfectionist,
+      drizzle,
     },
     rules: {
+      "perfectionist/sort-imports": "error",
+      "@typescript-eslint/no-invalid-void-type": "off",
       "@typescript-eslint/use-unknown-in-catch-callback-variable": "off",
+      "@typescript-eslint/no-redundant-type-constituents": "off",
       "@typescript-eslint/restrict-template-expressions": "off",
       "@typescript-eslint/no-confusing-void-expression": "off",
       "@typescript-eslint/prefer-nullish-coalescing": "off",
@@ -48,27 +53,69 @@ export default tseslint.config(
       "@typescript-eslint/no-non-null-assertion": "off",
       "@typescript-eslint/no-unsafe-assignment": "off",
       "@typescript-eslint/no-empty-object-type": "off",
-      "@typescript-eslint/no-misused-promises": "off",
       "@typescript-eslint/no-unsafe-argument": "off",
+      "@typescript-eslint/unified-signatures": "off",
       "@typescript-eslint/no-base-to-string": "off",
       "@typescript-eslint/no-empty-function": "off",
       "@typescript-eslint/only-throw-error": "off",
       "@typescript-eslint/no-unsafe-return": "off",
       "@typescript-eslint/no-explicit-any": "off",
       "typescript-eslint/no-unsafe-return": "off",
-      "@typescript-eslint/no-unused-vars": "off",
       "@typescript-eslint/unbound-method": "off",
       "@typescript-eslint/no-unsafe-call": "off",
-      "@typescript-eslint/require-await": "off",
       "@typescript-eslint/no-deprecated": "off",
+      "@typescript-eslint/restrict-plus-operands": "off",
+      "@typescript-eslint/consistent-type-definitions": ["error", "type"],
+      "@typescript-eslint/consistent-type-imports": [
+        "warn",
+        {
+          disallowTypeAnnotations: true,
+          fixStyle: "separate-type-imports",
+          prefer: "type-imports",
+        },
+      ],
+      "@typescript-eslint/naming-convention": [
+        "off",
+        {
+          selector: "import",
+          format: ["camelCase", "PascalCase"],
+        },
+      ],
+      "@typescript-eslint/array-type": "off",
+      "@typescript-eslint/no-unused-vars": [
+        "off",
+        {
+          argsIgnorePattern: "^_",
+        },
+      ],
+      "@typescript-eslint/require-await": "off",
+      "@typescript-eslint/no-misused-promises": [
+        "off",
+        {
+          checksVoidReturn: {
+            attributes: false,
+          },
+        },
+      ],
+      "drizzle/enforce-delete-with-where": [
+        "error",
+        {
+          drizzleObjectName: ["db", "ctx.db"],
+        },
+      ],
+      "drizzle/enforce-update-with-where": [
+        "error",
+        {
+          drizzleObjectName: ["db", "ctx.db"],
+        },
+      ],
+      "no-throw-literal": "warn",
       "no-constant-binary-expression": "off",
       "no-constant-condition": "off",
       "no-case-declarations": "off",
+      curly: "warn",
+      eqeqeq: "off",
+      semi: "warn",
     },
   },
-  {
-    name: "@reliverse/eslint-config/js",
-    files: ["**/*.{js,jsx}"],
-    ...tseslint.configs.disableTypeChecked,
-  },
 );
diff --git a/messages/de-DE.json b/messages/de.json
similarity index 97%
rename from messages/de-DE.json
rename to messages/de.json
index ef2bb775..4d346c50 100644
--- a/messages/de-DE.json
+++ b/messages/de.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "Entdecken Sie Geschäfte aus der ganzen Welt",
   "featuredStoresTitle": "Ausgewählte Geschäfte",
   "viewAllProducts": "Alle Produkte ansehen",
-  "viewAllStores": "Alle Geschäfte anzeigen"
+  "viewAllStores": "Alle Geschäfte anzeigen",
+  "description": "Die Ressource wurde möglicherweise verschoben, umbenannt oder ist möglicherweise nicht vorhanden. \nÜberprüfen Sie die URL oder verwenden Sie das Menü zur Navigation.",
+  "go-home": "Heimkehr",
+  "not-found": {
+    "description": "Die Ressource wurde möglicherweise verschoben, umbenannt oder ist möglicherweise nicht vorhanden. \nÜberprüfen Sie die URL oder verwenden Sie das Menü zur Navigation.",
+    "go-home": "Heimkehr",
+    "title": "🫠 Seite nicht gefunden! \n🫠"
+  },
+  "title": "🫠 Seite nicht gefunden! \n🫠"
 }
diff --git a/messages/en-US.json b/messages/en.json
similarity index 97%
rename from messages/en-US.json
rename to messages/en.json
index 1fdbd221..42c4d4be 100644
--- a/messages/en-US.json
+++ b/messages/en.json
@@ -488,6 +488,11 @@
     "verifyEmail": "Verify Email",
     "waysToDonate": "Ways to Donate"
   },
+  "not-found": {
+    "description": "The resource might have been moved, renamed, or might not exist. Verify the URL or use the menu to navigate.",
+    "go-home": "Return Home",
+    "title": "🫠 Page Not Found! 🫠"
+  },
   "pages": {
     "not-found": {
       "description": "The resource might have been moved, renamed, or might not exist. Verify the URL or use the menu to navigate.",
@@ -606,5 +611,8 @@
   "featuredStoresDescription": "Explore stores from around the world",
   "featuredStoresTitle": "Featured stores",
   "viewAllProducts": "View all products",
-  "viewAllStores": "View all stores"
+  "viewAllStores": "View all stores",
+  "title": "🫠 Page Not Found! 🫠",
+  "description": "The resource might have been moved, renamed, or might not exist. Verify the URL or use the menu to navigate.",
+  "go-home": "Return Home"
 }
diff --git a/messages/es-ES.json b/messages/es.json
similarity index 97%
rename from messages/es-ES.json
rename to messages/es.json
index 01572db3..fa79a42c 100644
--- a/messages/es-ES.json
+++ b/messages/es.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "Explora tiendas de todo el mundo.",
   "featuredStoresTitle": "Tiendas destacadas",
   "viewAllProducts": "Ver todos los productos",
-  "viewAllStores": "Ver todas las tiendas"
+  "viewAllStores": "Ver todas las tiendas",
+  "description": "Es posible que el recurso se haya movido, haya cambiado de nombre o que no exista. \nVerifique la URL o use el menú para navegar.",
+  "go-home": "Regresar a casa",
+  "not-found": {
+    "description": "Es posible que el recurso se haya movido, haya cambiado de nombre o que no exista. \nVerifique la URL o use el menú para navegar.",
+    "go-home": "Regresar a casa",
+    "title": "🫠 ¡Página no encontrada! \n🫠"
+  },
+  "title": "🫠 ¡Página no encontrada! \n🫠"
 }
diff --git a/messages/fa-IR.json b/messages/fa-IR.json
deleted file mode 100644
index 88970c98..00000000
--- a/messages/fa-IR.json
+++ /dev/null
@@ -1,610 +0,0 @@
-{
-  "AuthjsV5Test": {
-    "clientExamplePageTsx": "client-example/page.tsx",
-    "clientSideRendering": "رندر سمت مشتری",
-    "exampleBackend": "نمونه باطن",
-    "here": "اینجا",
-    "loading": "در حال بارگیری...",
-    "sessionprovider": "SessionProvider",
-    "thirdPartyBackendIntegration": "ادغام باطن شخص ثالث",
-    "update": "به روز رسانی",
-    "updatingTheSession": "در حال به روز رسانی جلسه",
-    "useClient": "استفاده از مشتری",
-    "usesession": "useSession"
-  },
-  "CartAddForm": {
-    "addOneItem": "یک مورد اضافه کنید",
-    "quantity": "مقدار",
-    "removeOneItem": "حذف یک مورد"
-  },
-  "CommerceDashboard": {
-    "dashboard": "داشبورد"
-  },
-  "ContactForm": {
-    "message": "پیام",
-    "subject": "موضوع"
-  },
-  "CountryList": {
-    "currencies": "ارزها:",
-    "languages": "زبان ها:",
-    "loading": "در حال بارگیری..."
-  },
-  "DataTablePagination": {
-    "rowsPerPage": "ردیف در هر صفحه"
-  },
-  "DialogShell": {
-    "close": "بستن"
-  },
-  "Error": {
-    "description": "<p>Switch the website language to English if the error details are not displayed. | متأسفانه، با خطایی مواجه شده‌ایم.</p><p>می‌توانید سعی کنید صفحه‌ای را که بازدید می‌کردید، <retry>بازبارگیری کنید</retry>. ما به عنوان توسعه دهندگان وب سایت بسیار سپاسگزار خواهیم بود اگر با ما تماس بگیرید و این خطا را به ما اطلاع دهید. پیشاپیش از شما متشکرم!</p>",
-    "title": "مشکلی پیش آمد..."
-  },
-  "Faceted": {
-    "noResultsFound": "هیچ نتیجه ای یافت نشد."
-  },
-  "GuestAddForm": {
-    "email": "ایمیل"
-  },
-  "JoinNewsletterForm": {
-    "joinReliverseWeeklyNewsletter": "به خبرنامه هفتگی Reliverse بپیوندید",
-    "tryAgain": "دوباره امتحان کنید"
-  },
-  "LocaleSwitcher": {
-    "changeLanguage": "تغییر زبان",
-    "english": "انگلیسی",
-    "germany": "آلمان",
-    "languages": "زبان ها",
-    "spanish": "اسپانیایی",
-    "ukrainian": "اوکراینی"
-  },
-  "LoginForm": {
-    "no-account": "حساب کاربری ندارید؟",
-    "signup": "اینجا ثبت نام کنید.",
-    "title": "ورود",
-    "welcome-back": "خوش برگشتی"
-  },
-  "MainMenu": {
-    "websiteLogoWithName": "لوگوی وب سایت با نام"
-  },
-  "Manifest": {
-    "name": "Relivator: قالب Next.js"
-  },
-  "MdxCard": {
-    "view": "مشاهده کنید"
-  },
-  "MobileMenu": {
-    "toggleMenu": "تغییر منو"
-  },
-  "ModeToggle": {
-    "toggleTheme": "تغییر موضوع"
-  },
-  "MultiUploader": {
-    "dropFilesHere": "فایل ها را اینجا رها کنید!"
-  },
-  "NavWithCompactPageHeader": {
-    "navwithcompactpageheader": "NavWithCompactPageHeader"
-  },
-  "NewsletterWelcomeEmail": {
-    "reliverseWeeklyNewsletter": "خبرنامه هفتگی Reliverse"
-  },
-  "Options": {
-    "toggleColumns": "تغییر دادن ستون ها"
-  },
-  "PathnamesPage": {
-    "description": "<p>Reliverse Playground | next-intl | نام‌های مسیرهای URL را می‌توان بین‌المللی کرد.</p><p>اگر از زبان پیش‌فرض، انگلیسی استفاده می‌کنید، <code>/en/pathnames</code> را در نوار آدرس مرورگر در این صفحه خواهید دید.</p><p>اگر زبان محلی را به آلمانی تغییر دهید، URL بر این اساس بومی‌سازی می‌شود (<code>/de/pfadnamen</code>).</p>",
-    "title": "نام‌های مسیر"
-  },
-  "PostAddForm": {
-    "createPost": "ایجاد پست"
-  },
-  "PricingModules": {
-    "nextJs": "Next.js"
-  },
-  "Privileges": {
-    "switchUserRole": "تغییر نقش کاربر"
-  },
-  "ProductAddForm": {
-    "addProduct": "افزودن محصول",
-    "category": "دسته بندی",
-    "description": "توضیحات",
-    "images": "تصاویر",
-    "inventory": "موجودی",
-    "name": "نام",
-    "price": "قیمت",
-    "subcategory": "زیرمجموعه"
-  },
-  "ProductCard": {
-    "promise": "قول بده"
-  },
-  "ProductPager": {
-    "nextProduct": "محصول بعدی",
-    "previousProduct": "محصول قبلی"
-  },
-  "ProductUpdForm": {
-    "category": "دسته بندی",
-    "deleteProduct": "محصول را حذف کنید",
-    "description": "توضیحات",
-    "images": "تصاویر",
-    "inventory": "موجودی",
-    "name": "نام",
-    "price": "قیمت",
-    "subcategory": "زیرمجموعه",
-    "updateProduct": "به روز رسانی محصول"
-  },
-  "ProductsCombobox": {
-    "searchProducts": "محصولات را جستجو کنید"
-  },
-  "RegisterForm": {
-    "have-account": "از قبل حساب کاربری دارید؟",
-    "signin": "اینجا وارد شوید.",
-    "title": "ثبت نام"
-  },
-  "RootLocaleLayout": {
-    "metadata": {
-      "description": "Relivator با قدرت shadcn/ui، Next.js 15 و React 19 تجارت الکترونیک شما را بهبود می‌بخشد",
-      "title": {
-        "home": "خانه"
-      }
-    },
-    "titleDetails": "به سرعت فروشگاه های آنلاین بسازید"
-  },
-  "SVG": {
-    "buyMeACoffeLogo": "برای من یک لوگو قهوه بخر",
-    "facebookLogo": "لوگوی فیس بوک",
-    "githubLogoInvertocat": "لوگوی GitHub: Invertocat",
-    "googleLogo": "لوگوی گوگل",
-    "nextJs": "Next.js",
-    "passkey": "کلید عبور",
-    "patreonLogo": "لوگوی Patreon",
-    "paypalLogo": "لوگوی پی پال",
-    "spinner": "اسپینر"
-  },
-  "SessionData": {
-    "currentSessionData": "داده های جلسه فعلی",
-    "onlyPassTheNecessaryFields": "فقط فیلدهای لازم را بگذرانید",
-    "signIn": "وارد شوید"
-  },
-  "SidebarWithHeader": {
-    "applicationAppShellsSidebarLayoutsSidebarWithHeader": "برنامه - پوسته های برنامه - طرح بندی نوار کناری - نوار کناری با هدر",
-    "sidebarwithheader": "SidebarWithHeader"
-  },
-  "SiteFooter": {
-    "allRightsReserved": "تمامی حقوق محفوظ است"
-  },
-  "StoreAddForm": {
-    "addStore": "افزودن فروشگاه",
-    "description": "توضیحات",
-    "name": "نام"
-  },
-  "StorePager": {
-    "nextStore": "فروشگاه بعدی",
-    "previousStore": "فروشگاه قبلی"
-  },
-  "StoreSwitcher": {
-    "noStoresFound": "هیچ فروشگاهی پیدا نشد"
-  },
-  "ThemeToggle": {
-    "toggleTheme": "تغییر موضوع"
-  },
-  "ThemesGeneralSwitcher": {
-    "dark": "تاریک",
-    "light": "نور",
-    "system": "سیستم",
-    "theme": "تم"
-  },
-  "UpdateCart": {
-    "addOneItem": "یک مورد اضافه کنید",
-    "deleteItem": "مورد را حذف کنید",
-    "removeOneItem": "حذف یک مورد"
-  },
-  "UpdateNotificationForm": {
-    "marketingEmails": "ایمیل های بازاریابی",
-    "newsletterEmails": "ایمیل های خبرنامه",
-    "savePreferences": "ذخیره تنظیمات"
-  },
-  "UserButton": {
-    "signIn": "وارد شوید"
-  },
-  "VerifyOrderForm": {
-    "deliveryPostalCode": "کد پستی تحویل",
-    "verifyOrder": "تأیید سفارش"
-  },
-  "WithIcons": {
-    "applicationNavigationVerticalNavigationWithIcons": "برنامه - ناوبری - ناوبری عمودی - با نمادها",
-    "withicons": "با آیکون ها"
-  },
-  "WithLeftAlignedNav": {
-    "elementsHeadersWithLeftAlignedNav": "عناصر - سرصفحه ها - با ناوبری تراز چپ",
-    "withleftalignednav": "WithLeftAlignedNav"
-  },
-  "WithSecondaryNavigation": {
-    "withsecondarynavigation": "با ناوبری ثانویه"
-  },
-  "account-page": {
-    "Settings": "تنظیمات",
-    "loggedIn": "وارد شده",
-    "loggedOut": "خارج شده",
-    "login": "ورود",
-    "logout": "خروج",
-    "title": "حساب"
-  },
-  "auth": {
-    "error": {
-      "default": "با حساب دیگری وارد شوید.",
-      "email": "ایمیل یافت نشد. ارائه‌دهنده دیگری را امتحان کنید.",
-      "oauthNotLinked": "برای تایید هویت، با حساب اصلی وارد شوید.",
-      "unknown": "خطایی رخ داده است. دوباره تلاش کنید.",
-      "unknown-error": "مشکلی پیش آمده است. به /contact مراجعه و پشتیبانی را مطلع کنید."
-    },
-    "legal": "با استفاده از این دکمه‌ها، شما موافقت می‌کنید",
-    "legal-and": "و",
-    "legal-privacy": "سیاست حفظ حریم خصوصی",
-    "legal-terms": "شرایط استفاده"
-  },
-  "auth-provider": {
-    "please-wait": "لطفا صبر کنید..."
-  },
-  "auth-user": {
-    "signInEmail": "ورود به سیستم ایمیل"
-  },
-  "banners": {
-    "announcements-1": {
-      "button": "اکنون مراجعه کنید",
-      "details": "از پست وبلاگ انتشار دیدن کنید تا ببینید چه چیزی تغییر کرده است و چه چیزی در آینده خواهد آمد.",
-      "dismiss": "رد کردن",
-      "title": "Relivator v1.2.6 و v1.3.0-canary.7 اینجا هستند!"
-    }
-  },
-  "blog-comments-server": {
-    "postthreadlist": "PostThreadList"
-  },
-  "checkout": {
-    "CartDetails": "جزئیات",
-    "Demo": "داده‌های تست: 4242424242424242 | 12/34 | 567",
-    "Description": "پرداخت سبد خرید",
-    "EmptyCartDescription": "برای پرداخت، اقلامی را به سبد خرید اضافه کنید",
-    "EmptyCartHeading": "سبد خرید خالی است",
-    "Pay": "پرداخت",
-    "Title": "پرداخت",
-    "backToCart": "بازگشت به سبد خرید",
-    "backToCartSingle": "بازگشت",
-    "calculated": "در پرداخت محاسبه می‌شود",
-    "cart": "سبد خرید",
-    "cartIsEmpty": "سبد خرید خالی است",
-    "continueShopping": "ادامه خرید",
-    "free": "رایگان",
-    "notConnectedDescription": "برای پذیرش پرداخت، فروشگاه خود را به Stripe متصل کنید",
-    "notConnectedHeading": "فروشگاه به Stripe متصل نیست",
-    "shipping": "حمل و نقل",
-    "taxes": "مالیات",
-    "total": "جمع",
-    "viewTheCart": "مشاهده سبد خرید"
-  },
-  "client": {
-    "currentPassword": "رمز عبور فعلی",
-    "name": "نام",
-    "newPassword": "رمز عبور جدید",
-    "password": "رمز عبور",
-    "plan": "برنامه ریزی کنید",
-    "saveChanges": "ذخیره تغییرات",
-    "savePassword": "ذخیره رمز عبور",
-    "settings": "تنظیمات",
-    "subscriptionPlans": "طرح های اشتراک",
-    "userNotFound": "کاربر پیدا نشد",
-    "username": "نام کاربری"
-  },
-  "components": {
-    "command": {
-      "dark": "تاریک",
-      "light": "روشن",
-      "system": "سیستم",
-      "theme": "موضوع"
-    },
-    "search": {
-      "placeholder": "جستجو...",
-      "title": "جستجو"
-    }
-  },
-  "contact": {
-    "submit": "ارسال"
-  },
-  "cursor": {
-    "cursor": "مکان نما"
-  },
-  "demo": {
-    "aria-label-goto": "رفتن به",
-    "launch": "داشبورد"
-  },
-  "editor-placeholder": {
-    "record": "ضبط کنید"
-  },
-  "example": {
-    "beforeUsing": "قبل از استفاده",
-    "billing": "صورتحساب",
-    "localhostDebug": "[localhost-debug]:"
-  },
-  "faceted-filter": {
-    "noResultsFound": "هیچ نتیجه ای یافت نشد."
-  },
-  "faq": {
-    "1": {
-      "details": "برای اطلاعات به‌روز و دستورالعمل‌های نصب، فایل README.md در مخزن GitHub Relivator را ببینید.",
-      "summary": "چگونه می‌توانم سریع نصب کنم و شروع کنم؟"
-    },
-    "2": {
-      "details": "Relivator امکانات نامحدودی با تمام ابزارهای آماده فراهم می‌کند.",
-      "summary": "چرا باید Relivator را برای Next.js 15 و React 19 انتخاب کنم؟"
-    },
-    "3": {
-      "details": "توسعه عمدتاً توسط یک نفر انجام می‌شود. کمک‌های مالی می‌توانند روند را تسریع کنند. برای کمک، اینجا کلیک کنید. متشکرم! 🩷",
-      "summary": "آیا می‌توان انتشار Relivator v1.3.0 را سرعت بخشید؟"
-    }
-  },
-  "file-dialog": {
-    "cropImage": "برش تصویر",
-    "dropTheFileHere": "فایل را اینجا رها کنید",
-    "removeAll": "همه را حذف کنید",
-    "removeFile": "حذف فایل",
-    "uploadImages": "آپلود تصاویر"
-  },
-  "landing": {
-    "about": "غنی‌ترین، جهانی‌ترین و نمادین‌ترین استارتر Next.js. ویژگی‌هایمان را کشف کنید. بیش از یک کد، یک سفر. پایدار و آماده تولید.",
-    "buy-now": "کاتالوگ",
-    "features": {
-      "auth": {
-        "description": "سیستم احراز هویت همه‌کاره با NextAuth.js و Clerk. جزئیات در .env.example.",
-        "title": "احراز هویت: ایمن و انعطاف‌پذیر"
-      },
-      "database": {
-        "description": "عملکرد بالا با Drizzle ORM و تغییر بین MySQL و Postgres. استقرار با Planetscale، Vercel، Railway، Neon و بیشتر.",
-        "title": "یکپارچه‌سازی پایگاه‌داده: قوی و انعطاف‌پذیر"
-      },
-      "devtools": {
-        "ambitions-description": "Relivator امکانات نامحدودی با تمام ابزارهای آماده فراهم می‌کند.",
-        "description": "سیستم اشتراک قوی با پشتیبانی از برنامه‌های رایگان و پولی. جزئیات در README.md.",
-        "title": "اشتراک‌های Stripe: قوی و انعطاف‌پذیر"
-      },
-      "interface": {
-        "description": "ایجاد UI شگفت‌انگیز با اجزای Flowbite و Shadcn UI، طراحی شده با Radix و Tailwind CSS. توصیه می‌شود از VSCode استفاده کنید.",
-        "title": "اجزا: زیبا و کاربردی"
-      },
-      "nextjs": {
-        "description": "ناوبری صاف با App Router، Layouts و Loading UI. مسیرهای API قوی را کشف کنید.",
-        "title": "Next.js 15: تجربه بهتر"
-      },
-      "text": {
-        "description": "مدیریت آسان با اجزای سرور و کلاینت. استفاده از hook‌های پیشرفته و امکانات بیشتر برای توسعه روان.",
-        "title": "React 19: توسعه مدرن"
-      }
-    },
-    "footer-cta": "آماده شروع هستید؟",
-    "get-started-button": "داشبورد",
-    "main-cta": "GitHub",
-    "sell-now": "داشبورد"
-  },
-  "layout": {
-    "back": "برگشت"
-  },
-  "loading": {
-    "account": "حساب",
-    "billing": "صورتحساب",
-    "checkout": "تسویه حساب",
-    "loading": "در حال بارگیری...",
-    "purchases": "خریدها",
-    "signOut": "از سیستم خارج شوید",
-    "thankYouForTheOrder": "ممنون از سفارش"
-  },
-  "metadata": {
-    "description": "Relivator با قدرت shadcn/ui، Next.js 15 و React 19 تجارت الکترونیک شما را بهبود می‌بخشد",
-    "title": {
-      "home": "خانه"
-    }
-  },
-  "mode-toggle": {
-    "dark": "تاریک",
-    "light": "نور",
-    "system": "سیستم",
-    "toggleTheme": "تغییر موضوع"
-  },
-  "name": "الگوی Relivator Next.js",
-  "onboard": {
-    "asa": "آسا",
-    "dateEventDateTbd": "تاریخ: [تاریخ رویداد (TBD)]",
-    "donTMissOutReserveTheSpotNow": "فرصت را از دست ندهید، همین حالا مکان را رزرو کنید!",
-    "eventDetails": "جزئیات رویداد:",
-    "join15MinutesEarlyToNetwork": "🌟 15 دقیقه زودتر به شبکه بپیوندید! 🌟",
-    "locationEventLinkTbd": "مکان: [پیوند رویداد (TBD)]",
-    "relivatorNextJsRedefined": "🚀 Relivator - Next.js دوباره تعریف شد:",
-    "tbdToBeDetermined": "*TBD - باید مشخص شود",
-    "timeEventTimeTbd": "زمان: [زمان رویداد (TBD)]"
-  },
-  "page": {
-    "about": "درباره",
-    "accessToAPrivateCommunity": "دسترسی به یک جامعه خصوصی",
-    "account": "حساب",
-    "addANewStoreToTheAccount": "یک فروشگاه جدید به حساب اضافه کنید",
-    "addStore": "فروشگاه را اضافه کنید",
-    "admin": "مدیر",
-    "adminPage": "صفحه مدیریت",
-    "availableWorldwide": "در سراسر جهان موجود است",
-    "billing": "صورتحساب",
-    "blog": "وبلاگ",
-    "buildABoard": "یک تابلو بسازید",
-    "client": "مشتری",
-    "countriesData": "داده های کشورها",
-    "createNewComponent": "کامپوننت جدید ایجاد کنید",
-    "createNewPage": "ایجاد صفحه جدید",
-    "createNewPost": "ایجاد پست جدید",
-    "dashboard": "داشبورد",
-    "directSupport": "پشتیبانی مستقیم",
-    "donateThroughGithubBilling": "از طریق صورت‌حساب GitHub کمک مالی کنید",
-    "donationTiers": "طبقات اهدایی",
-    "earlyAccessToNewFeatures": "دسترسی زودهنگام به ویژگی های جدید",
-    "easyAndQuickProcess": "فرآیند آسان و سریع",
-    "editUserPrivileges": "ویرایش امتیازات کاربر",
-    "emailPreferences": "تنظیمات ایمیل",
-    "exclusiveUpdatesAndContent": "به روز رسانی و محتوای منحصر به فرد",
-    "frequentlyAskedQuestions": "سوالات متداول",
-    "howTheMoneyIsUsed": "نحوه استفاده از پول",
-    "instantDonations": "کمک های فوری",
-    "localhostOnlyDebugInfo": "[localhost-only-debug-info]",
-    "manageTheSubscription": "اشتراک را مدیریت کنید",
-    "manageYourEmailPreferences": "تنظیمات برگزیده ایمیل خود را مدیریت کنید",
-    "name": "نام: ---",
-    "newStore": "فروشگاه جدید",
-    "notImplementedYet": "هنوز اجرا نشده است",
-    "novuDeveloperPlaygroundPageComingSoon": "صفحه Playground Developer Novu به زودی...",
-    "oneTimeAndRecurringDonations": "کمک های یکباره و مکرر",
-    "oneTimeDonations": "کمک های یکباره",
-    "preferences": "ترجیحات",
-    "pricing": "قیمت گذاری",
-    "purchases": "خریدها",
-    "purchasesTable": "جدول خرید",
-    "readyToBuildYourEcommercePlatform": "آماده ساختن پلتفرم تجارت الکترونیک خود هستید؟",
-    "recurringAndOneTimeDonations": "کمک های مکرر و یکباره",
-    "reliversePlayground": "زمین بازی Reliverse",
-    "res": "Res",
-    "resJsonAsPromise": "()res.json به عنوان Promise",
-    "resetPassword": "بازنشانی رمز عبور",
-    "root": "ریشه",
-    "secureTransactions": "تراکنش های امن",
-    "seeAllPosts": "مشاهده همه پست ها",
-    "seeOurSponsors": "حامیان ما را ببینید",
-    "server": "سرور",
-    "settings": "تنظیمات",
-    "showASponsorBadgeOnYourGithubProfile": "نشان حامی مالی را در نمایه GitHub خود نشان دهید",
-    "signinWithDiscord": "با Discord وارد شوید",
-    "signinWithGithub": "با GitHub وارد شوید",
-    "signinWithGoogle": "با گوگل وارد شوید",
-    "simpleAndFunWayToSupport": "راه ساده و سرگرم کننده برای پشتیبانی",
-    "smallOneTimeDonations": "کمک های کوچک یکباره",
-    "specificCountryRe": "کشور خاص (RE)",
-    "stores": "فروشگاه ها",
-    "supportWithNoFees": "پشتیبانی بدون کارمزد",
-    "testEmailDelivery": "تست تحویل ایمیل",
-    "thankYouForTheOrder": "ممنون از سفارش",
-    "thePageIsStillInProductionPleaseCheckBackHereLater": "صفحه هنوز در حال تولید است. لطفاً بعداً اینجا را بررسی کنید.",
-    "underConstruction": "در حال ساخت ...",
-    "verifyEmail": "تایید ایمیل",
-    "waysToDonate": "راه های اهدا"
-  },
-  "pages": {
-    "not-found": {
-      "description": "منبع ممکن است جابجا، تغییر نام داده یا وجود نداشته باشد. URL را بررسی یا از منو استفاده کنید.",
-      "go-home": "بازگشت به خانه",
-      "title": "🫠 صفحه پیدا نشد! 🥲"
-    }
-  },
-  "privacy-notice-right-aligned": {
-    "elementsBannersPrivacyNoticeRightAligned": "عناصر - بنرها - اطلاعیه حریم خصوصی به راست تراز شده است",
-    "privacynoticerightaligned": "PrivacyNoticeRightAligned"
-  },
-  "product-building": {
-    "filters": "فیلترها",
-    "noProductsFound": "هیچ محصولی یافت نشد",
-    "sortBy": "مرتب سازی بر اساس"
-  },
-  "product-context": {
-    "productsctx": "محصولاتCtx"
-  },
-  "product-image-carousel": {
-    "nextSlide": "اسلاید بعدی",
-    "previousSlide": "اسلاید قبلی"
-  },
-  "products": {
-    "filters": "فیلترها",
-    "nextStorePage": "صفحه بعدی فروشگاه",
-    "noProductsFound": "هیچ محصولی یافت نشد",
-    "previousStorePage": "صفحه فروشگاه قبلی",
-    "sortBy": "مرتب سازی بر اساس"
-  },
-  "products-admin": {
-    "productDetails": "جزئیات محصول",
-    "products": "محصولات"
-  },
-  "signOutPage": {
-    "dashboard": "داشبورد",
-    "description": {
-      "areyousueyouwanttosignout": "آیا مطمئن هستید که می خواهید از سیستم خارج شوید؟"
-    },
-    "heading": {
-      "signout": "از سیستم خارج شوید"
-    },
-    "home": "صفحه اصلی",
-    "logOut": "از سیستم خارج شوید"
-  },
-  "stacked-with-footer-actions": {
-    "elementsFlyoutMenusStackedWithFooterActions": "عناصر - منوهای پرواز - انباشته با اقدامات پاورقی",
-    "stackedwithfooteractions": "StackedWithFooterActions"
-  },
-  "store": {
-    "categories": {
-      "buyFromCategories": "از بهترین فروشگاه‌ها {category} بخرید",
-      "buyTheBest": "بهترین {category}"
-    },
-    "products": {
-      "addToCart": "افزودن به سبد خرید",
-      "buyProductsFromOurStores": "خرید از فروشگاه‌های ما",
-      "catalogue": "کاتالوگ",
-      "description": "شرح",
-      "moreProductsFrom": "بیشتر از {storeName}",
-      "noDescription": "توضیح موجود نیست.",
-      "products": "محصولات",
-      "productsCatalogue": "کاتالوگ محصولات"
-    },
-    "stores": {
-      "buy-products": "خرید از فروشگاه‌های ما",
-      "stores": "فروشگاه‌ها"
-    }
-  },
-  "stores": {
-    "noStoresFound": "هیچ فروشگاهی پیدا نشد",
-    "sortBy": "مرتب سازی بر اساس"
-  },
-  "temp-compiler-fix": {
-    "app": "برنامه"
-  },
-  "titleDetails": "به سرعت فروشگاه های آنلاین بسازید",
-  "upgrade": {
-    "localhostDebug": "localhost-debug",
-    "thisIncludes": "این شامل:"
-  },
-  "usermenu": {
-    "account": {
-      "menu": "حساب"
-    },
-    "adminpage": {
-      "menu": "صفحه مدیریت"
-    },
-    "billing": {
-      "menu": "صورتحساب"
-    },
-    "dashboard": {
-      "menu": "داشبورد"
-    },
-    "logout": {
-      "menu": "خروج از سیستم"
-    },
-    "purchases": {
-      "menu": "خریدها"
-    },
-    "settings": {
-      "menu": "تنظیمات"
-    },
-    "stores": {
-      "menu": "فروشگاه ها"
-    }
-  },
-  "with-button": {
-    "dismiss": "رد کردن"
-  },
-  "with-button-animated": {
-    "dismiss": "رد کردن"
-  },
-  "featuredProductsDescription": "محصولات از سراسر جهان را کاوش کنید",
-  "featuredProductsTitle": "محصولات ویژه",
-  "featuredStoresDescription": "فروشگاه های سراسر جهان را کاوش کنید",
-  "featuredStoresTitle": "فروشگاه های ویژه",
-  "viewAllProducts": "مشاهده تمامی محصولات",
-  "viewAllStores": "مشاهده تمام فروشگاه ها"
-}
diff --git a/messages/fr-FR.json b/messages/fr.json
similarity index 97%
rename from messages/fr-FR.json
rename to messages/fr.json
index 76cbbee3..db6e77b9 100644
--- a/messages/fr-FR.json
+++ b/messages/fr.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "Explorez les magasins du monde entier",
   "featuredStoresTitle": "Magasins en vedette",
   "viewAllProducts": "Voir tous les produits",
-  "viewAllStores": "Voir tous les magasins"
+  "viewAllStores": "Voir tous les magasins",
+  "description": "La ressource a peut-être été déplacée, renommée ou peut ne pas exister. \nVérifiez l'URL ou utilisez le menu pour naviguer.",
+  "go-home": "Retour à la maison",
+  "not-found": {
+    "description": "La ressource a peut-être été déplacée, renommée ou peut ne pas exister. \nVérifiez l'URL ou utilisez le menu pour naviguer.",
+    "go-home": "Retour à la maison",
+    "title": "🫠 Page introuvable ! \n🫠"
+  },
+  "title": "🫠 Page introuvable ! \n🫠"
 }
diff --git a/messages/hi-IN.json b/messages/hi.json
similarity index 96%
rename from messages/hi-IN.json
rename to messages/hi.json
index 39fe42f6..943a8c05 100644
--- a/messages/hi-IN.json
+++ b/messages/hi.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "दुनिया भर के स्टोर खोजें",
   "featuredStoresTitle": "विशेष स्टोर",
   "viewAllProducts": "सभी उत्पाद देखें",
-  "viewAllStores": "सभी स्टोर देखें"
+  "viewAllStores": "सभी स्टोर देखें",
+  "description": "हो सकता है कि संसाधन को स्थानांतरित कर दिया गया हो, उसका नाम बदल दिया गया हो, या उसका अस्तित्व ही न हो। \nयूआरएल सत्यापित करें या नेविगेट करने के लिए मेनू का उपयोग करें।",
+  "go-home": "घर लौटना",
+  "not-found": {
+    "description": "हो सकता है कि संसाधन को स्थानांतरित कर दिया गया हो, उसका नाम बदल दिया गया हो, या उसका अस्तित्व ही न हो। \nयूआरएल सत्यापित करें या नेविगेट करने के लिए मेनू का उपयोग करें।",
+    "go-home": "घर लौटना",
+    "title": "🫠 पेज नहीं मिला! \n🫠"
+  },
+  "title": "🫠 पेज नहीं मिला! \n🫠"
 }
diff --git a/messages/it-IT.json b/messages/it.json
similarity index 97%
rename from messages/it-IT.json
rename to messages/it.json
index dab5999b..de7ee4de 100644
--- a/messages/it-IT.json
+++ b/messages/it.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "Esplora negozi da tutto il mondo",
   "featuredStoresTitle": "Negozi in evidenza",
   "viewAllProducts": "Visualizza tutti i prodotti",
-  "viewAllStores": "Visualizza tutti i negozi"
+  "viewAllStores": "Visualizza tutti i negozi",
+  "description": "La risorsa potrebbe essere stata spostata, rinominata o potrebbe non esistere. \nVerifica l'URL o utilizza il menu per navigare.",
+  "go-home": "Ritorno a casa",
+  "not-found": {
+    "description": "La risorsa potrebbe essere stata spostata, rinominata o potrebbe non esistere. \nVerifica l'URL o utilizza il menu per navigare.",
+    "go-home": "Ritorno a casa",
+    "title": "🫠 Pagina non trovata! \n🫠"
+  },
+  "title": "🫠 Pagina non trovata! \n🫠"
 }
diff --git a/messages/ms-MY.json b/messages/ms.json
similarity index 97%
rename from messages/ms-MY.json
rename to messages/ms.json
index 7c3c6098..20c11033 100644
--- a/messages/ms-MY.json
+++ b/messages/ms.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "Terokai kedai dari seluruh dunia",
   "featuredStoresTitle": "Kedai pilihan",
   "viewAllProducts": "Lihat semua produk",
-  "viewAllStores": "Lihat semua kedai"
+  "viewAllStores": "Lihat semua kedai",
+  "description": "Sumber mungkin telah dialihkan, dinamakan semula atau mungkin tidak wujud. \nSahkan URL atau gunakan menu untuk menavigasi.",
+  "go-home": "Balik Rumah",
+  "not-found": {
+    "description": "Sumber mungkin telah dialihkan, dinamakan semula atau mungkin tidak wujud. \nSahkan URL atau gunakan menu untuk menavigasi.",
+    "go-home": "Balik Rumah",
+    "title": "🫠 Halaman Tidak Ditemui! \n🫠"
+  },
+  "title": "🫠 Halaman Tidak Ditemui! \n🫠"
 }
diff --git a/messages/pl-PL.json b/messages/pl.json
similarity index 97%
rename from messages/pl-PL.json
rename to messages/pl.json
index 27db7539..785036fa 100644
--- a/messages/pl-PL.json
+++ b/messages/pl.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "Przeglądaj sklepy z całego świata",
   "featuredStoresTitle": "Polecane sklepy",
   "viewAllProducts": "Zobacz wszystkie produkty",
-  "viewAllStores": "Zobacz wszystkie sklepy"
+  "viewAllStores": "Zobacz wszystkie sklepy",
+  "description": "Zasób mógł zostać przeniesiony, zmieniono jego nazwę lub mógł nie istnieć. \nSprawdź adres URL lub użyj menu do nawigacji.",
+  "go-home": "Wróć do domu",
+  "not-found": {
+    "description": "Zasób mógł zostać przeniesiony, zmieniono jego nazwę lub mógł nie istnieć. \nSprawdź adres URL lub użyj menu do nawigacji.",
+    "go-home": "Wróć do domu",
+    "title": "🫠 Nie znaleziono strony! \n🫠"
+  },
+  "title": "🫠 Nie znaleziono strony! \n🫠"
 }
diff --git a/messages/tr-TR.json b/messages/tr.json
similarity index 97%
rename from messages/tr-TR.json
rename to messages/tr.json
index 94420804..fc3b3fc3 100644
--- a/messages/tr-TR.json
+++ b/messages/tr.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "Dünyanın dört bir yanından mağazaları keşfedin",
   "featuredStoresTitle": "Öne çıkan mağazalar",
   "viewAllProducts": "Tüm ürünleri görüntüle",
-  "viewAllStores": "Tüm mağazaları görüntüle"
+  "viewAllStores": "Tüm mağazaları görüntüle",
+  "description": "Kaynak taşınmış, yeniden adlandırılmış veya mevcut olmayabilir. \nURL'yi doğrulayın veya gezinmek için menüyü kullanın.",
+  "go-home": "Eve Dönüş",
+  "not-found": {
+    "description": "Kaynak taşınmış, yeniden adlandırılmış veya mevcut olmayabilir. \nURL'yi doğrulayın veya gezinmek için menüyü kullanın.",
+    "go-home": "Eve Dönüş",
+    "title": "🫠 Sayfa Bulunamadı! \n🫠"
+  },
+  "title": "🫠 Sayfa Bulunamadı! \n🫠"
 }
diff --git a/messages/uk-UA.json b/messages/uk.json
similarity index 97%
rename from messages/uk-UA.json
rename to messages/uk.json
index b548f5e4..cdd5a288 100644
--- a/messages/uk-UA.json
+++ b/messages/uk.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "Досліджуйте магазини з усього світу",
   "featuredStoresTitle": "Рекомендовані магазини",
   "viewAllProducts": "Переглянути всі продукти",
-  "viewAllStores": "Переглянути всі магазини"
+  "viewAllStores": "Переглянути всі магазини",
+  "description": "Можливо, ресурс було переміщено, перейменовано або не існує. \nПеревірте URL-адресу або скористайтеся меню для навігації.",
+  "go-home": "Повернення додому",
+  "not-found": {
+    "description": "Можливо, ресурс було переміщено, перейменовано або не існує. \nПеревірте URL-адресу або скористайтеся меню для навігації.",
+    "go-home": "Повернення додому",
+    "title": "🫠 Сторінку не знайдено! \n🫠"
+  },
+  "title": "🫠 Сторінку не знайдено! \n🫠"
 }
diff --git a/messages/zh-CN.json b/messages/zh.json
similarity index 97%
rename from messages/zh-CN.json
rename to messages/zh.json
index 7ee34b5f..6c6e8d72 100644
--- a/messages/zh-CN.json
+++ b/messages/zh.json
@@ -606,5 +606,13 @@
   "featuredStoresDescription": "探索世界各地的商店",
   "featuredStoresTitle": "特色店铺",
   "viewAllProducts": "查看所有产品",
-  "viewAllStores": "查看所有商店"
+  "viewAllStores": "查看所有商店",
+  "description": "该资源可能已被移动、重命名或可能不存在。\n验证 URL 或使用菜单进行导航。",
+  "go-home": "回家",
+  "not-found": {
+    "description": "该资源可能已被移动、重命名或可能不存在。\n验证 URL 或使用菜单进行导航。",
+    "go-home": "回家",
+    "title": "🫠 页面未找到！ \n🫠"
+  },
+  "title": "🫠 页面未找到！ \n🫠"
 }
diff --git a/next-env.d.ts b/next-env.d.ts
index 40c3d680..1b3be084 100644
--- a/next-env.d.ts
+++ b/next-env.d.ts
@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
diff --git a/next.config.js b/next.config.js
deleted file mode 100644
index 83fedf75..00000000
--- a/next.config.js
+++ /dev/null
@@ -1,31 +0,0 @@
-/**
- * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially useful
- * for Docker builds.
- */
-await import("./src/env.js");
-
-import createMDX from "@next/mdx";
-import createNextIntlPlugin from "next-intl/plugin";
-
-const withNextIntl = createNextIntlPlugin();
-
-/** @type {import("next").NextConfig} */
-const nextConfig = {
-  pageExtensions: ["js", "jsx", "ts", "tsx", "md", "mdx"],
-  images: {
-    remotePatterns: [
-      {
-        protocol: "https",
-        hostname: "utfs.io",
-      },
-    ],
-    unoptimized: true,
-  },
-  // Already doing linting and typechecking using `bun appts`
-  eslint: { ignoreDuringBuilds: true },
-  typescript: { ignoreBuildErrors: true },
-};
-
-const withMDX = createMDX({});
-
-export default withNextIntl(withMDX(nextConfig));
diff --git a/next.config.ts b/next.config.ts
new file mode 100644
index 00000000..6ff5fa6e
--- /dev/null
+++ b/next.config.ts
@@ -0,0 +1,15 @@
+import type { NextConfig } from "next";
+
+import createNextIntlPlugin from "next-intl/plugin";
+
+import "./src/env.js";
+
+const withNextIntl = createNextIntlPlugin();
+
+const nextConfig: NextConfig = {
+  // done manually using bun check
+  eslint: { ignoreDuringBuilds: true },
+  typescript: { ignoreBuildErrors: true },
+};
+
+export default withNextIntl(nextConfig);
diff --git a/package.json b/package.json
index b7d8f3a3..551df144 100644
--- a/package.json
+++ b/package.json
@@ -1,26 +1,26 @@
 {
   "name": "relivator",
-  "version": "1.3.0-canary.7",
+  "version": "1.3.0",
   "private": true,
   "type": "module",
   "scripts": {
-    "appts": "redrun lint format typecheck build",
-    "clean": "rimraf --glob **/node_modules **/dist **/.next **/.tsbuildinfo **/.react-email",
+    "check": "bun typecheck && bun lint && bun format",
+    "dev": "next dev --turbopack",
     "build": "next build",
-    "dev": "next dev --turbo",
     "start": "next start",
-    "lint": "eslint --cache --fix .",
     "typecheck": "tsc --noEmit",
-    "format": "redrun biome:write",
-    "biome:write": "biome format --write .",
-    "biome:check": "biome lint --write .",
-    "check": "bun lint && bun typecheck && bun format:check",
+    "lint": "eslint --cache --fix .",
+    "lint:i": "eslint --inspect-config",
+    "format": "biome check --write .",
+    "grammar": "cspell . --words-only --unique --no-progress --gitignore",
+    "knip": "knip",
+    "clean": "rimraf --glob **/node_modules **/dist **/.next **/.tsbuildinfo **/.react-email",
     "shadcn:add": "bunx shadcn-ui@latest add",
     "db:introspect": "dotenv drizzle-kit introspect",
-    "db:migrate-manual": "dotenv tsx src/db/migrate.ts",
+    "db:migrate-manual": "dotenv tsx src/server/db/migrate.ts",
     "db:drop-migration": "drizzle-kit drop",
-    "db:seed": "bun src/db/seed.ts",
-    "db:seed-old": "dotenv tsx src/db/seed.ts",
+    "db:seed": "bun src/server/db/seed.ts",
+    "db:seed-old": "dotenv tsx src/server/db/seed.ts",
     "db:generate": "drizzle-kit generate",
     "db:migrate": "drizzle-kit migrate",
     "db:push": "npx drizzle-kit push",
@@ -30,15 +30,16 @@
     "unlighthouse": "bunx unlighthouse --site https://relivator.com"
   },
   "dependencies": {
-    "@clerk/nextjs": "^6.0.2",
-    "@clerk/themes": "^2.1.39",
-    "@eslint/js": "^9.13.0",
-    "@hookform/resolvers": "^3.9.0",
+    "@auth/drizzle-adapter": "^1.7.4",
+    "@clerk/elements": "^0.22.0",
+    "@clerk/nextjs": "^6.9.0",
+    "@clerk/themes": "^2.2.0",
+    "@hookform/resolvers": "^3.9.1",
     "@loglib/tracker": "^0.8.0",
     "@mdx-js/loader": "^3.1.0",
     "@mdx-js/react": "^3.1.0",
-    "@neondatabase/serverless": "^0.10.1",
-    "@next/mdx": "^15.0.1",
+    "@neondatabase/serverless": "^0.10.4",
+    "@next/mdx": "^15.1.0",
     "@radix-ui/react-accordion": "^1.2.1",
     "@radix-ui/react-alert-dialog": "^1.1.2",
     "@radix-ui/react-aspect-ratio": "^1.1.0",
@@ -47,101 +48,112 @@
     "@radix-ui/react-dialog": "^1.1.2",
     "@radix-ui/react-dropdown-menu": "^2.1.2",
     "@radix-ui/react-hover-card": "^1.1.2",
-    "@radix-ui/react-icons": "^1.3.0",
+    "@radix-ui/react-icons": "^1.3.2",
     "@radix-ui/react-label": "^2.1.0",
     "@radix-ui/react-navigation-menu": "^1.2.1",
     "@radix-ui/react-popover": "^1.1.2",
     "@radix-ui/react-progress": "^1.1.0",
-    "@radix-ui/react-scroll-area": "^1.2.0",
+    "@radix-ui/react-scroll-area": "^1.2.1",
     "@radix-ui/react-select": "^2.1.2",
     "@radix-ui/react-separator": "^1.1.0",
     "@radix-ui/react-slider": "^1.2.1",
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-switch": "^1.1.1",
     "@radix-ui/react-tabs": "^1.1.1",
-    "@radix-ui/react-tooltip": "^1.1.3",
-    "@react-email/components": "^0.0.25",
-    "@react-email/tailwind": "0.1.0",
-    "@stripe/react-stripe-js": "^2.8.1",
-    "@stripe/stripe-js": "^4.9.0",
+    "@radix-ui/react-toast": "^1.2.2",
+    "@radix-ui/react-tooltip": "^1.1.4",
+    "@react-email/components": "^0.0.31",
+    "@react-email/tailwind": "1.0.4",
+    "@stripe/react-stripe-js": "^3.0.0",
+    "@stripe/stripe-js": "^5.2.0",
     "@t3-oss/env-nextjs": "^0.11.1",
     "@tanstack/match-sorter-utils": "^8.19.4",
+    "@tanstack/react-query": "^5.62.7",
     "@tanstack/react-table": "^8.20.5",
-    "@tremor/react": "^3.18.3",
+    "@tremor/react": "^3.18.6",
     "@types/eslint__js": "^8.42.3",
     "@types/mdx": "^2.0.13",
-    "@uploadthing/react": "^7.1.0",
-    "@upstash/ratelimit": "^2.0.4",
-    "@upstash/redis": "^1.34.3",
-    "@vercel/functions": "^1.4.2",
-    "ai": "^3.4.23",
-    "class-variance-authority": "^0.7.0",
+    "@uploadthing/react": "^7.1.2",
+    "@vercel/analytics": "^1.4.1",
+    "@vercel/functions": "^1.5.1",
+    "better-auth": "^1.0.15",
+    "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "cmdk": "^1.0.0",
+    "cmdk": "^1.0.4",
     "consola": "^3.2.3",
     "date-fns": "^4.1.0",
-    "dotenv": "^16.4.5",
-    "drizzle-orm": "^0.35.3",
-    "embla-carousel-react": "8.3.0",
-    "framer-motion": "^11.11.10",
+    "dotenv": "^16.4.7",
+    "drizzle-orm": "^0.38.0",
+    "embla-carousel-react": "8.5.1",
+    "framer-motion": "^11.13.5",
     "geist": "^1.3.1",
-    "globals": "^15.11.0",
-    "input-otp": "^1.2.4",
-    "lucide-react": "^0.454.0",
-    "nanoid": "^5.0.8",
-    "next": "15.0.1",
-    "next-intl": "^3.23.5",
-    "next-themes": "^0.3.0",
-    "openai": "^4.68.4",
+    "globals": "^15.13.0",
+    "input-otp": "^1.4.1",
+    "lucide-react": "^0.468.0",
+    "nanoid": "^5.0.9",
+    "next": "^15.1.0",
+    "next-auth": "^4.24.11",
+    "next-intl": "^3.26.0",
+    "next-themes": "^0.4.4",
+    "nuqs": "^2.2.3",
+    "ofetch": "^1.4.1",
     "pg": "^8.13.1",
     "postgres": "^3.4.5",
-    "react": "18.3.1",
+    "react": "^19.0.0",
     "react-cropper": "^2.3.3",
-    "react-day-picker": "^9.2.1",
-    "react-dom": "18.3.1",
-    "react-dropzone": "^14.2.10",
-    "react-email": "^3.0.1",
-    "react-hook-form": "^7.53.1",
+    "react-day-picker": "^9.4.2",
+    "react-dom": "^19.0.0",
+    "react-dropzone": "^14.3.5",
+    "react-email": "^3.0.4",
+    "react-hook-form": "^7.54.0",
     "react-intersection-observer": "^9.13.1",
+    "react-is": "^19.0.0",
     "react-markdown": "^9.0.1",
-    "react-medium-image-zoom": "^5.2.10",
+    "react-medium-image-zoom": "^5.2.12",
     "react-syntax-highlighter": "^15.6.1",
-    "react-textarea-autosize": "^8.5.4",
+    "react-textarea-autosize": "^8.5.6",
     "react-use-measure": "^2.1.1",
     "react-wrap-balancer": "^1.1.1",
-    "redrun": "^11.0.5",
-    "resend": "^4.0.0",
+    "recharts": "^2.14.1",
+    "resend": "^4.0.1",
     "server-only": "^0.0.1",
-    "sonner": "^1.5.0",
-    "stripe": "^17.2.1",
-    "tailwind-merge": "^2.5.4",
+    "sonner": "^1.7.1",
+    "stripe": "^17.4.0",
+    "superjson": "^2.2.2",
+    "tailwind-merge": "^2.5.5",
     "tailwindcss-animate": "^1.0.7",
-    "typescript-eslint": "^8.12.0",
-    "uploadthing": "^7.2.0",
-    "vaul": "^1.1.0",
-    "zod": "^3.23.8"
+    "uploadthing": "^7.4.0",
+    "vaul": "^1.1.1",
+    "zod": "^3.24.0"
   },
   "devDependencies": {
     "@biomejs/biome": "1.9.4",
-    "@clerk/types": "^4.28.0",
-    "@faker-js/faker": "^9.1.0",
+    "@cspell/dict-uk-ua": "^4.0.4",
+    "@eslint/js": "^9.16.0",
+    "@faker-js/faker": "^9.3.0",
     "@tailwindcss/typography": "^0.5.15",
     "@total-typescript/ts-reset": "^0.6.1",
     "@types/eslint": "^9.6.1",
-    "@types/node": "^22.8.2",
+    "@types/node": "^22.10.1",
     "@types/pg": "^8.11.10",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
+    "@types/react": "^19.0.1",
+    "@types/react-dom": "^19.0.2",
     "@types/react-syntax-highlighter": "^15.5.13",
-    "@typescript-eslint/eslint-plugin": "^8.12.0",
-    "@typescript-eslint/parser": "^8.12.0",
+    "@typescript-eslint/eslint-plugin": "^8.18.0",
+    "@typescript-eslint/parser": "^8.18.0",
     "autoprefixer": "^10.4.20",
-    "dotenv-cli": "^7.4.2",
-    "drizzle-kit": "^0.26.2",
-    "eslint": "^9.13.0",
-    "eslint-config-next": "^15.0.1",
+    "cspell": "^8.16.1",
+    "dotenv-cli": "^7.4.4",
+    "drizzle-kit": "^0.30.0",
+    "eslint": "^9.16.0",
+    "eslint-config-next": "^15.1.0",
+    "eslint-plugin-drizzle": "^0.2.3",
+    "eslint-plugin-perfectionist": "^4.2.0",
     "eslint-plugin-tailwindcss": "^3.17.5",
-    "postcss": "^8.4.47",
+    "knip": "^5.39.4",
+    "postcss": "^8.4.49",
+    "prettier": "^3.4.2",
+    "prettier-plugin-tailwindcss": "^0.6.9",
     "rehype-autolink-headings": "^7.1.0",
     "rehype-code-titles": "^1.2.0",
     "rehype-pretty-code": "^0.14.0",
@@ -151,10 +163,11 @@
     "remark-gfm": "^4.0.0",
     "remark-math": "^6.0.0",
     "rimraf": "^6.0.1",
-    "shiki": "^1.22.2",
-    "tailwindcss": "^3.4.14",
+    "shiki": "^1.24.2",
+    "tailwindcss": "^3.4.16",
     "tsx": "^4.19.2",
-    "typescript": "^5.6.3",
+    "typescript": "^5.7.2",
+    "typescript-eslint": "^8.18.0",
     "unist-builder": "^4.0.0",
     "unist-util-visit": "^5.0.0"
   }
diff --git a/postcss.config.js b/postcss.config.js
index d12fc049..b47d1b85 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1,7 +1,8 @@
+// @ts-check
+
 /** @type {import('postcss-load-config').Config} */
 const config = {
   plugins: {
-    autoprefixer: {},
     tailwindcss: {},
   },
 };
diff --git a/public/file.svg b/public/file.svg
new file mode 100644
index 00000000..004145cd
--- /dev/null
+++ b/public/file.svg
@@ -0,0 +1 @@
+<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/public/globe.svg b/public/globe.svg
new file mode 100644
index 00000000..567f17b0
--- /dev/null
+++ b/public/globe.svg
@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/public/screenshot-dark.png b/public/screenshot-dark.png
index 1dca3149..af37f467 100644
Binary files a/public/screenshot-dark.png and b/public/screenshot-dark.png differ
diff --git a/public/window.svg b/public/window.svg
new file mode 100644
index 00000000..b2b2a44f
--- /dev/null
+++ b/public/window.svg
@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>
\ No newline at end of file
diff --git a/reset.d.ts b/reset.d.ts
deleted file mode 100644
index a3d4a031..00000000
--- a/reset.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-import "@total-typescript/ts-reset";
diff --git a/src/app.ts b/src/app.ts
new file mode 100644
index 00000000..c386c4e6
--- /dev/null
+++ b/src/app.ts
@@ -0,0 +1,19 @@
+export const app = {
+  shortName: "Relivator",
+  name: "Relivator – The Next.js Template for Your eCommerce – by Bleverse",
+  url: "https://relivator.com",
+  ogImage: "https://relivator.com/og.jpg",
+  description:
+    "Relivator is the Next.js template making it easy to build the powerful eCommerce platforms.",
+  links: {
+    twitter: "https://twitter.com/reliverse_org",
+    github: "https://github.com/reliverse",
+  },
+};
+
+export type AppConfig = typeof app;
+
+export const META_THEME_COLORS = {
+  light: "#ffffff",
+  dark: "#09090b",
+};
diff --git a/src/app/[locale]/(auth)/layout.tsx b/src/app/[locale]/(auth)/layout.tsx
deleted file mode 100644
index b731b483..00000000
--- a/src/app/[locale]/(auth)/layout.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import Image from "next/image";
-import Link from "next/link";
-
-import { siteConfig } from "~/config/site";
-import { Icons } from "~/components/icons";
-
-export default function AuthLayout({ children }: React.PropsWithChildren) {
-  return (
-    <div className="relative grid min-h-screen grid-cols-1 overflow-hidden lg:grid-cols-2">
-      <Link
-        href="/"
-        className="absolute left-8 top-6 z-20 flex items-center text-lg font-bold tracking-tight text-foreground/80 transition-colors hover:text-foreground"
-      >
-        <Icons.logo className="mr-2 size-6" aria-hidden="true" />
-        <span>{siteConfig.name}</span>
-      </Link>
-      <main className="absolute left-1/2 top-1/2 flex w-full -translate-x-1/2 -translate-y-1/2 items-center lg:static lg:left-0 lg:top-0 lg:flex lg:translate-x-0 lg:translate-y-0">
-        {children}
-      </main>
-      <div className="relative aspect-video size-full">
-        <Image
-          src="/images/auth-layout.webp"
-          alt="A skateboarder dropping into a bowl"
-          fill
-          className="absolute inset-0 object-cover"
-          priority
-          sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
-        />
-        <div className="absolute inset-0 bg-gradient-to-t from-background to-black/80 lg:to-black/40" />
-        <div className="absolute bottom-4 right-4 z-20 line-clamp-1 rounded-md bg-muted px-3 py-1.5 text-sm text-muted-foreground">
-          Photo by{" "}
-          <a
-            href="https://unsplash.com/ja/@pixelperfektion?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText"
-            className="underline transition-colors hover:text-foreground"
-          >
-            pixelperfektion
-          </a>
-          {" on "}
-          <a
-            href="https://unsplash.com/photos/OS2WODdxy1A?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText"
-            className="underline transition-colors hover:text-foreground"
-          >
-            Unsplash
-          </a>
-        </div>
-      </div>
-    </div>
-  );
-}
diff --git a/src/app/[locale]/(auth)/sso-callback/[[...sso-callback]]/page.tsx b/src/app/[locale]/(auth)/sso-callback/[[...sso-callback]]/page.tsx
deleted file mode 100644
index e7f248d9..00000000
--- a/src/app/[locale]/(auth)/sso-callback/[[...sso-callback]]/page.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { AuthenticateWithRedirectCallback } from "@clerk/nextjs";
-
-import { Icons } from "~/components/icons";
-import { Shell } from "~/components/shell";
-
-export default function SSOCallbackPage() {
-  return (
-    <Shell className="max-w-lg place-items-center">
-      <Icons.spinner className="size-16 animate-spin" aria-hidden="true" />
-      <AuthenticateWithRedirectCallback />
-    </Shell>
-  );
-}
diff --git a/src/app/[locale]/(checkout)/cart/page.tsx b/src/app/[locale]/(checkout)/cart/page.tsx
deleted file mode 100644
index 73b31d13..00000000
--- a/src/app/[locale]/(checkout)/cart/page.tsx
+++ /dev/null
@@ -1,72 +0,0 @@
-import type { Metadata } from "next";
-import Link from "next/link";
-import { env } from "~/env.js";
-
-import { getUniqueStoreIds } from "~/lib/actions/cart";
-import { cn } from "~/lib/utils";
-import { buttonVariants } from "~/components/ui/button";
-import { CheckoutCard } from "~/components/checkout/checkout-card";
-import { Icons } from "~/components/icons";
-import {
-  PageHeader,
-  PageHeaderDescription,
-  PageHeaderHeading,
-} from "~/components/page-header";
-import { Shell } from "~/components/shell";
-
-export const metadata: Metadata = {
-  metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
-  title: "Cart",
-  description: "Checkout with your cart items",
-};
-
-export default async function CartPage() {
-  const uniqueStoreIds = await getUniqueStoreIds();
-
-  return (
-    <Shell>
-      <PageHeader
-        id="cart-page-header"
-        aria-labelledby="cart-page-header-heading"
-      >
-        <PageHeaderHeading size="sm">Checkout</PageHeaderHeading>
-        <PageHeaderDescription size="sm">
-          Checkout with your cart items
-        </PageHeaderDescription>
-      </PageHeader>
-      {uniqueStoreIds.length > 0 ? (
-        uniqueStoreIds.map(
-          (storeId) =>
-            storeId && <CheckoutCard key={storeId} storeId={storeId} />,
-        )
-      ) : (
-        <section
-          id="cart-page-empty-cart"
-          aria-labelledby="cart-page-empty-cart-heading"
-          className="flex h-full flex-col items-center justify-center space-y-1 pt-16"
-        >
-          <Icons.cart
-            className="mb-4 size-16 text-muted-foreground"
-            aria-hidden="true"
-          />
-          <div className="text-xl font-medium text-muted-foreground">
-            Your cart is empty
-          </div>
-          <Link
-            aria-label="Add items to your cart to checkout"
-            href="/products"
-            className={cn(
-              buttonVariants({
-                variant: "link",
-                size: "sm",
-                className: "text-sm text-muted-foreground",
-              }),
-            )}
-          >
-            Add items to your cart to checkout
-          </Link>
-        </section>
-      )}
-    </Shell>
-  );
-}
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-header.tsx b/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-header.tsx
deleted file mode 100644
index ba5bc6cb..00000000
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-header.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import type { User } from "@clerk/nextjs/server";
-
-import { AuthDropdown } from "~/components/layouts/auth-dropdown";
-
-interface DashboardHeaderProps {
-  user: User;
-  storeId: string;
-  children: React.ReactNode;
-}
-
-export function DashboardHeader({
-  user,
-  storeId,
-  children,
-}: DashboardHeaderProps) {
-  return (
-    <header className="sticky top-0 z-50 w-full border-b border-border/60 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
-      <div className="flex h-14 items-center px-6">
-        {children}
-        <div className="flex flex-1 items-center justify-end space-x-4">
-          <nav className="flex items-center space-x-2">
-            <AuthDropdown user={user} />
-          </nav>
-        </div>
-      </div>
-    </header>
-  );
-}
diff --git a/src/app/[locale]/(lobby)/(content)/[...slug]/not-found.tsx.txt b/src/app/[locale]/(lobby)/(content)/[...slug]/not-found.tsx.txt
deleted file mode 100644
index ba140f85..00000000
--- a/src/app/[locale]/(lobby)/(content)/[...slug]/not-found.tsx.txt
+++ /dev/null
@@ -1,15 +0,0 @@
-import { ErrorCard } from "~/components/error-card";
-import { Shell } from "~/components/shell";
-
-export default function PageNotFound() {
-  return (
-    <Shell variant="centered" className="max-w-md">
-      <ErrorCard
-        title="Page not found"
-        description="The page you are looking for does not exist"
-        retryLink="/"
-        retryLinkText="Go to Home"
-      />
-    </Shell>
-  );
-}
diff --git a/src/app/[locale]/(lobby)/(content)/[...slug]/page.tsx.txt b/src/app/[locale]/(lobby)/(content)/[...slug]/page.tsx.txt
deleted file mode 100644
index 8fe2fba2..00000000
--- a/src/app/[locale]/(lobby)/(content)/[...slug]/page.tsx.txt
+++ /dev/null
@@ -1,117 +0,0 @@
-import { notFound } from "next/navigation";
-
-import "~/styles/mdx.css";
-
-import { type Metadata } from "next";
-
-import { siteConfig } from "~/config/site";
-import { absoluteUrl } from "~/lib/utils";
-import { Separator } from "~/components/ui/separator";
-import { allPages, Mdx } from "~/mdx-components";
-import { MdxPager } from "~/components/mdx/mdx-pager";
-import {
-  PageHeader,
-  PageHeaderDescription,
-  PageHeaderHeading,
-} from "~/components/page-header";
-import { Shell } from "~/components/shell";
-
-interface PageProps {
-  params: {
-    slug: string[];
-  };
-}
-
-function getPageFromParams(params: PageProps["params"]) {
-  const slug = params.slug.join("/") ?? "";
-  const page = allPages.find(
-    (page: { slugAsParams: string }) => page.slugAsParams === slug,
-  );
-
-  if (!page) {
-    null;
-  }
-
-  return page;
-}
-
-// export function generateMetadata({ params }: PageProps): Metadata {
-//   const page = getPageFromParams(params);
-
-//   if (!page) {
-//     return {};
-//   }
-
-//   const url = absoluteUrl("/");
-
-//   const ogUrl = new URL(`${url}/api/og`);
-//   ogUrl.searchParams.set("title", page.title);
-//   ogUrl.searchParams.set("type", siteConfig.name);
-//   ogUrl.searchParams.set("mode", "light");
-
-//   return {
-//     title: page.title,
-//     description: page.description,
-//     openGraph: {
-//       title: page.title,
-//       description: page.description,
-//       type: "article",
-//       url: absoluteUrl(page.slugAsParams),
-//       images: [
-//         {
-//           url: ogUrl.toString(),
-//           width: 1200,
-//           height: 630,
-//           alt: page.title,
-//         },
-//       ],
-//     },
-//     twitter: {
-//       card: "summary_large_image",
-//       title: page.title,
-//       description: page.description,
-//       images: [ogUrl.toString()],
-//     },
-//   };
-// }
-
-export function generateStaticParams(): PageProps["params"][] {
-  return allPages.map((page) => ({
-    slug: page.slugAsParams.split("/"),
-  }));
-}
-
-export default function Page({ params }: PageProps) {
-  const page = getPageFromParams(params);
-
-  if (!page) {
-    notFound();
-  }
-
-  // Remove the /pages prefix from the slug
-  const formattedPage = {
-    ...page,
-    slug: page.slugAsParams.replace(/^\/pages/, ""),
-  };
-
-  const formattedPages = allPages.map((page) => ({
-    ...page,
-    slug: page.slugAsParams.replace(/^\/pages/, ""),
-  }));
-
-  return (
-    <Shell as="article" variant="markdown">
-      <PageHeader>
-        <PageHeaderHeading>{page.title}</PageHeaderHeading>
-        <PageHeaderDescription>{page.description}</PageHeaderDescription>
-      </PageHeader>
-      <Separator className="my-4" />
-      <Mdx code={page.body.code} />
-      <MdxPager
-        currentItem={formattedPage}
-        allItems={formattedPages}
-        className="my-4"
-      />
-    </Shell>
-  );
-}
diff --git a/src/app/[locale]/(lobby)/@modal/(.)preview/layout.tsx b/src/app/[locale]/(lobby)/@modal/(.)preview/layout.tsx
deleted file mode 100644
index 7730573a..00000000
--- a/src/app/[locale]/(lobby)/@modal/(.)preview/layout.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import {
-  AlertDialog,
-  AlertDialogContent,
-  AlertDialogTitle,
-} from "~/components/ui/alert-dialog";
-
-export default function ModalLayout({ children }: React.PropsWithChildren) {
-  return (
-    <AlertDialog defaultOpen={true}>
-      <AlertDialogTitle className="sr-only">Command Dialog</AlertDialogTitle>
-      <AlertDialogContent className="max-w-3xl overflow-hidden p-0">
-        {children}
-      </AlertDialogContent>
-    </AlertDialog>
-  );
-}
diff --git a/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/loading.tsx b/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/loading.tsx
deleted file mode 100644
index 0d952376..00000000
--- a/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/loading.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { cn } from "~/lib/utils";
-import { Skeleton } from "~/components/ui/skeleton";
-import { DialogShell } from "~/components/dialog-shell";
-import { PlaceholderImage } from "~/components/placeholder-image";
-
-export default function ProductModalLoading() {
-  return (
-    <DialogShell className="flex flex-col gap-2 overflow-visible sm:flex-row">
-      <Skeleton className="absolute right-10 top-4 size-4" />
-      <PlaceholderImage ratio={16 / 9} className="rounded-none" isSkeleton />
-      <div className="w-full space-y-8 p-6 sm:p-10">
-        <div className="space-y-2.5">
-          <Skeleton className="h-7 w-1/2" />
-          <Skeleton className="h-4 w-10" />
-          <Skeleton className="h-4 w-24" />
-          <Skeleton className="h-4 w-20" />
-        </div>
-        <div className="space-y-2">
-          {Array.from({ length: 4 }, (_, i) => (
-            <Skeleton
-              key={i}
-              className={cn("h-4 w-full", i === 3 && "w-1/2")}
-            />
-          ))}
-        </div>
-      </div>
-    </DialogShell>
-  );
-}
diff --git a/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/not-found.tsx b/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/not-found.tsx
deleted file mode 100644
index f5c055e5..00000000
--- a/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/not-found.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import { ErrorCard } from "~/components/error-card";
-import { Shell } from "~/components/shell";
-
-export default function ProductModalNotFound() {
-  return (
-    <Shell variant="centered" className="max-w-md">
-      <ErrorCard
-        title="Product not found"
-        description="The product may have expired or you may have already updated your product"
-        retryLink="/"
-        retryLinkText="Go to Home"
-      />
-    </Shell>
-  );
-}
diff --git a/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/page.tsx b/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/page.tsx
deleted file mode 100644
index 723739c6..00000000
--- a/src/app/[locale]/(lobby)/@modal/(.)preview/product/[productId]/page.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-import Image from "next/image";
-import Link from "next/link";
-import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { categories, products } from "~/db/schema";
-import type { StoredFile } from "~/types";
-import { EnterFullScreenIcon } from "@radix-ui/react-icons";
-import { eq, sql } from "drizzle-orm";
-
-import { cn, formatPrice } from "~/lib/utils";
-import { AlertDialogAction } from "~/components/ui/alert-dialog";
-import { AspectRatio } from "~/components/ui/aspect-ratio";
-import { buttonVariants } from "~/components/ui/button";
-import { DialogShell } from "~/components/dialog-shell";
-import { PlaceholderImage } from "~/components/placeholder-image";
-import { Rating } from "~/components/rating";
-
-interface ProductModalPageProps {
-  params: {
-    productId: string;
-  };
-}
-
-export default async function ProductModalPage({
-  params,
-}: ProductModalPageProps) {
-  const productId = decodeURIComponent(params.productId);
-
-  const product = await db
-    .select({
-      id: products.id,
-      name: products.name,
-      description: products.description,
-      images: sql<StoredFile[] | null>`${products.images}`,
-      category: categories.name,
-      price: products.price,
-      inventory: products.inventory,
-      rating: products.rating,
-    })
-    .from(products)
-    .leftJoin(categories, eq(products.categoryId, categories.id))
-    .where(eq(products.id, productId))
-    .execute()
-    .then((rows) => rows[0]);
-
-  if (!product) {
-    notFound();
-  }
-
-  return (
-    <DialogShell className="flex flex-col gap-2 overflow-visible sm:flex-row">
-      <AlertDialogAction
-        className={cn(
-          buttonVariants({
-            variant: "ghost",
-            size: "icon",
-            className:
-              "absolute right-10 top-4 h-auto w-auto shrink-0 rounded-sm bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:bg-transparent hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground",
-          }),
-        )}
-        asChild
-      >
-        <Link href={`/product/${product.id}`} replace>
-          <EnterFullScreenIcon className="size-4" aria-hidden="true" />
-        </Link>
-      </AlertDialogAction>
-      <AspectRatio ratio={16 / 9} className="w-full">
-        {product.images?.length ? (
-          <Image
-            src={product.images[0]?.url ?? "/images/product-placeholder.webp"}
-            alt={product.images[0]?.name ?? product.name}
-            className="object-cover"
-            sizes="(min-width: 1024px) 20vw, (min-width: 768px) 25vw, (min-width: 640px) 33vw, (min-width: 475px) 50vw, 100vw"
-            fill
-            loading="lazy"
-          />
-        ) : (
-          <PlaceholderImage className="rounded-none" asChild />
-        )}
-      </AspectRatio>
-      <div className="w-full space-y-6 p-6 sm:p-10">
-        <div className="space-y-2">
-          <h1 className="line-clamp-2 text-2xl font-bold">{product.name}</h1>
-          <p className="text-base text-muted-foreground">
-            {formatPrice(product.price)}
-          </p>
-          <Rating rating={Math.round(product.rating / 5)} />
-          <p className="text-base text-muted-foreground">
-            {product.inventory} in stock
-          </p>
-        </div>
-        <p className="line-clamp-4 text-base text-muted-foreground">
-          {product.description}
-        </p>
-      </div>
-    </DialogShell>
-  );
-}
diff --git a/src/app/[locale]/(lobby)/@modal/default.tsx b/src/app/[locale]/(lobby)/@modal/default.tsx
deleted file mode 100644
index 6ddf1b76..00000000
--- a/src/app/[locale]/(lobby)/@modal/default.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-export default function Default() {
-  return null;
-}
diff --git a/src/app/[locale]/(lobby)/layout.tsx b/src/app/[locale]/(lobby)/layout.tsx
deleted file mode 100644
index 1e42f605..00000000
--- a/src/app/[locale]/(lobby)/layout.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { getCachedUser } from "~/lib/queries/user";
-import { SiteFooter } from "~/components/layouts/site-footer";
-import { SiteHeader } from "~/components/layouts/site-header";
-
-interface LobyLayoutProps
-  extends React.PropsWithChildren<{
-    modal: React.ReactNode;
-  }> {}
-
-export default async function LobyLayout({ children, modal }: LobyLayoutProps) {
-  const user = await getCachedUser();
-
-  return (
-    <div className="relative flex min-h-screen flex-col">
-      <SiteHeader user={user} />
-      <main className="flex-1">
-        {children}
-        {modal}
-      </main>
-      <SiteFooter />
-    </div>
-  );
-}
diff --git a/src/app/[locale]/(lobby)/(content)/blog/[...slug]/loading.tsx b/src/app/[locale]/blog/[...slug]/loading.tsx
similarity index 99%
rename from src/app/[locale]/(lobby)/(content)/blog/[...slug]/loading.tsx
rename to src/app/[locale]/blog/[...slug]/loading.tsx
index ae6bb9ec..f30c18f5 100644
--- a/src/app/[locale]/(lobby)/(content)/blog/[...slug]/loading.tsx
+++ b/src/app/[locale]/blog/[...slug]/loading.tsx
@@ -1,9 +1,8 @@
 import "~/styles/mdx.css";
-
+import { Shell } from "~/components/shell";
 import { AspectRatio } from "~/components/ui/aspect-ratio";
 import { Separator } from "~/components/ui/separator";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Shell } from "~/components/shell";
 
 export default function PostLoading() {
   return (
diff --git a/src/app/[locale]/(lobby)/(content)/blog/[...slug]/not-found.tsx b/src/app/[locale]/blog/[...slug]/not-found.tsx
similarity index 100%
rename from src/app/[locale]/(lobby)/(content)/blog/[...slug]/not-found.tsx
rename to src/app/[locale]/blog/[...slug]/not-found.tsx
diff --git a/src/app/[locale]/(lobby)/(content)/blog/[...slug]/page.tsx b/src/app/[locale]/blog/[...slug]/page.tsx
similarity index 98%
rename from src/app/[locale]/(lobby)/(content)/blog/[...slug]/page.tsx
rename to src/app/[locale]/blog/[...slug]/page.tsx
index d959e9f6..1e8d0095 100644
--- a/src/app/[locale]/(lobby)/(content)/blog/[...slug]/page.tsx
+++ b/src/app/[locale]/blog/[...slug]/page.tsx
@@ -1,27 +1,26 @@
-import { notFound } from "next/navigation";
-
-import { allAuthors, allPosts, Mdx } from "~/mdx-components";
+import { ChevronLeftIcon } from "@radix-ui/react-icons";
+import { type Metadata } from "next";
 
 import "~/styles/mdx.css";
 
-import { type Metadata } from "next";
 import Image from "next/image";
 import Link from "next/link";
-import { env } from "~/env.js";
-import { ChevronLeftIcon } from "@radix-ui/react-icons";
+import { notFound } from "next/navigation";
 
-import { absoluteUrl, cn, formatDate } from "~/lib/utils";
+import { MdxPager } from "~/components/mdx/mdx-pager";
+import { Shell } from "~/components/shell";
 import { AspectRatio } from "~/components/ui/aspect-ratio";
 import { buttonVariants } from "~/components/ui/button";
 import { Separator } from "~/components/ui/separator";
-import { MdxPager } from "~/components/mdx/mdx-pager";
-import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { allAuthors, allPosts, Mdx } from "~/mdx-components";
+import { absoluteUrl, cn, formatDate } from "~/server/utils";
 
-interface PostPageProps {
+type PostPageProps = {
   params: {
     slug: string[];
   };
-}
+};
 
 async function getPostFromParams(params: PostPageProps["params"]) {
   const slug = params.slug.join("/");
diff --git a/src/app/[locale]/(lobby)/(content)/blog/_components/post-card-skeleton.tsx b/src/app/[locale]/blog/_components/post-card-skeleton.tsx
similarity index 100%
rename from src/app/[locale]/(lobby)/(content)/blog/_components/post-card-skeleton.tsx
rename to src/app/[locale]/blog/_components/post-card-skeleton.tsx
index 69a08cc9..b162d9e5 100644
--- a/src/app/[locale]/(lobby)/(content)/blog/_components/post-card-skeleton.tsx
+++ b/src/app/[locale]/blog/_components/post-card-skeleton.tsx
@@ -1,6 +1,6 @@
+import { PlaceholderImage } from "~/components/placeholder-image";
 import { CardHeader } from "~/components/ui/card";
 import { Skeleton } from "~/components/ui/skeleton";
-import { PlaceholderImage } from "~/components/placeholder-image";
 
 export function PostCardSkeleton() {
   return (
diff --git a/src/app/[locale]/(lobby)/(content)/blog/_components/post-card.tsx b/src/app/[locale]/blog/_components/post-card.tsx
similarity index 95%
rename from src/app/[locale]/(lobby)/(content)/blog/_components/post-card.tsx
rename to src/app/[locale]/blog/_components/post-card.tsx
index c59d580a..9c543b5f 100644
--- a/src/app/[locale]/(lobby)/(content)/blog/_components/post-card.tsx
+++ b/src/app/[locale]/blog/_components/post-card.tsx
@@ -1,16 +1,16 @@
 import Image from "next/image";
 import Link from "next/link";
-import { type Post } from "~/mdx-components";
 
-import { formatDate } from "~/lib/utils";
+import { PlaceholderImage } from "~/components/placeholder-image";
 import { AspectRatio } from "~/components/ui/aspect-ratio";
 import { CardDescription, CardHeader, CardTitle } from "~/components/ui/card";
-import { PlaceholderImage } from "~/components/placeholder-image";
+import { type Post } from "~/mdx-components";
+import { formatDate } from "~/server/utils";
 
-interface PostCardProps {
+type PostCardProps = {
   post: Post;
   i: number;
-}
+};
 
 export function PostCard({ post, i }: PostCardProps) {
   return (
diff --git a/src/app/[locale]/(lobby)/(content)/blog/page.tsx b/src/app/[locale]/blog/page.tsx
similarity index 58%
rename from src/app/[locale]/(lobby)/(content)/blog/page.tsx
rename to src/app/[locale]/blog/page.tsx
index 770775a9..685d4972 100644
--- a/src/app/[locale]/(lobby)/(content)/blog/page.tsx
+++ b/src/app/[locale]/blog/page.tsx
@@ -1,18 +1,21 @@
-import * as React from "react";
 import { type Metadata } from "next";
-import { env } from "~/env.js";
 
-import { Separator } from "~/components/ui/separator";
-import {
-  PageHeader,
-  PageHeaderDescription,
-  PageHeaderHeading,
-} from "~/components/page-header";
+import { AlertCard } from "~/components/alert-card";
 import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+
+// import * as React from "react";
 
-import { PostCard } from "./_components/post-card";
-import { PostCardSkeleton } from "./_components/post-card-skeleton";
-import { allPosts } from "~/mdx-components";
+// import {
+// PageHeader,
+// PageHeaderDescription,
+// PageHeaderHeading,
+// } from "~/components/page-header";
+// import { Separator } from "~/components/ui/separator";
+// import { allPosts } from "~/mdx-components";
+
+// import { PostCard } from "./_components/post-card";
+// import { PostCardSkeleton } from "./_components/post-card-skeleton";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -20,14 +23,16 @@ export const metadata: Metadata = {
   description: "Explore the latest news and updates from the community",
 };
 
-export default function BlogPage() {
-  const posts = allPosts
-    .filter((post) => post.published)
-    .sort((a, b) => b.date.localeCompare(a.date));
+export default async function BlogPage() {
+  // const posts = allPosts
+  //   .filter((post) => post.published)
+  //   .sort((a, b) => b.date.localeCompare(a.date));
 
   return (
-    <Shell className="md:pb-10">
-      <PageHeader>
+    <Shell className="md:pb-10 mt-20">
+      <AlertCard />
+
+      {/* <PageHeader>
         <PageHeaderHeading>Blog</PageHeaderHeading>
         <PageHeaderDescription>
           Explore the latest news and updates from the community
@@ -44,7 +49,7 @@ export default function BlogPage() {
             <PostCard key={post.slug} post={post} i={i} />
           ))}
         </React.Suspense>
-      </section>
+      </section> */}
     </Shell>
   );
 }
diff --git a/src/app/[locale]/(lobby)/build-a-board/page.tsx b/src/app/[locale]/build-a-board/page.tsx
similarity index 78%
rename from src/app/[locale]/(lobby)/build-a-board/page.tsx
rename to src/app/[locale]/build-a-board/page.tsx
index 6e79a45b..218bb4e9 100644
--- a/src/app/[locale]/(lobby)/build-a-board/page.tsx
+++ b/src/app/[locale]/build-a-board/page.tsx
@@ -1,13 +1,9 @@
+import { CheckIcon, CircleIcon } from "@radix-ui/react-icons";
 import { type Metadata } from "next";
 import { cookies } from "next/headers";
 import Link from "next/link";
-import { env } from "~/env.js";
-import { CheckIcon, CircleIcon } from "@radix-ui/react-icons";
 
-import { getCartItems } from "~/lib/actions/cart";
-import { getProducts } from "~/lib/queries/product";
-import { cn } from "~/lib/utils";
-import { productsSearchParamsSchema } from "~/lib/validations/params";
+import { AlertCard } from "~/components/alert-card";
 import { BoardBuilder } from "~/components/board-builder";
 import {
   PageHeader,
@@ -15,6 +11,11 @@ import {
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getCartItems } from "~/server/actions/cart";
+import { getProducts } from "~/server/queries/product";
+import { cn } from "~/server/utils";
+import { productsSearchParamsSchema } from "~/server/validations/params";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -22,21 +23,21 @@ export const metadata: Metadata = {
   description: "Select the components for your board",
 };
 
-interface BuildABoadPageProps {
+type BuildABoadPageProps = {
   searchParams: Record<string, string | string[] | undefined>;
-}
+};
 
 export default async function BuildABoardPage({
   searchParams,
 }: BuildABoadPageProps) {
-  const { page, per_page, sort, subcategory, price_range, active } =
-    productsSearchParamsSchema.parse(searchParams);
+  // const { page, per_page, sort, subcategory, price_range, active } =
+  // productsSearchParamsSchema.parse(searchParams);
 
   // Products transaction
-  const limit = typeof per_page === "string" ? parseInt(per_page) : 8;
-  const offset = typeof page === "string" ? (parseInt(page) - 1) * limit : 0;
-  const activeSubcategory =
-    typeof subcategory === "string" ? subcategory : "decks";
+  // const limit = typeof per_page === "string" ? parseInt(per_page) : 8;
+  // const offset = typeof page === "string" ? (parseInt(page) - 1) * limit : 0;
+  // const activeSubcategory =
+  //   typeof subcategory === "string" ? subcategory : "decks";
 
   // const { data, pageCount } = await getProducts({
   //   limit,
@@ -48,12 +49,13 @@ export default async function BuildABoardPage({
   // })
 
   // Get cart items
-  const cartId = (await cookies()).get("cartId")?.value;
-  const cartItems = await getCartItems({ cartId });
+  // const cartId = (await cookies()).get("cartId")?.value;
+  // const cartItems = await getCartItems({ cartId });
 
   return (
-    <Shell className="gap-4">
-      <PageHeader
+    <Shell className="gap-4 mt-20">
+      <AlertCard />
+      {/* <PageHeader
         id="build-a-board-header"
         aria-labelledby="build-a-board-header-heading"
       >
@@ -61,7 +63,7 @@ export default async function BuildABoardPage({
         <PageHeaderDescription size="sm">
           Select the components for your board
         </PageHeaderDescription>
-      </PageHeader>
+      </PageHeader> */}
       {/* <section
         className="sticky top-14 z-30 w-full shrink-0 overflow-hidden bg-background/50 pb-4 pt-6 shadow-md sm:backdrop-blur"
       >
diff --git a/src/app/[locale]/cart/client.tsx b/src/app/[locale]/cart/client.tsx
new file mode 100644
index 00000000..fd59d3ca
--- /dev/null
+++ b/src/app/[locale]/cart/client.tsx
@@ -0,0 +1,99 @@
+"use client";
+
+import Link from "next/link";
+import * as React from "react";
+
+import { CheckoutCard } from "~/components/checkout/checkout-card";
+import { Icons } from "~/components/icons";
+import { Button } from "~/components/ui/button";
+import { buttonVariants } from "~/components/ui/button";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import { Separator } from "~/components/ui/separator";
+import {
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger,
+} from "~/components/ui/sheet";
+import { cn } from "~/server/utils";
+
+type CartSheetProps = {
+  uniqueStoreIds: string[];
+};
+
+export function CartSheet({ uniqueStoreIds }: CartSheetProps) {
+  return (
+    <Sheet>
+      {/* Sheet Trigger Button */}
+      <SheetTrigger asChild>
+        <Button
+          variant="ghost"
+          size="icon"
+          className="w-10 h-10 relative"
+          aria-label="Open Cart"
+        >
+          <Icons.cart className="h-6 w-6" aria-hidden="true" />
+          {/* Optional: Display the number of items in the cart */}
+          {uniqueStoreIds.length > 0 && (
+            <span className="absolute top-0 right-0 inline-flex items-center justify-center px-2 py-1 text-xs font-bold leading-none text-red-100 bg-red-600 rounded-full">
+              {uniqueStoreIds.length}
+            </span>
+          )}
+        </Button>
+      </SheetTrigger>
+
+      {/* Sheet Content */}
+      <SheetContent side="right" className="w-full sm:w-[400px]">
+        <SheetHeader>
+          <SheetTitle>Cart</SheetTitle>
+          <SheetClose className="absolute top-4 right-4">
+            <kbd className="inline-flex select-none items-center gap-1 rounded border bg-background px-2 py-1 font-mono font-medium opacity-100">
+              <span className="text-xs">ESC</span>
+              <span className="sr-only">Close</span>
+            </kbd>
+          </SheetClose>
+        </SheetHeader>
+
+        <ScrollArea className="h-[calc(100vh-10rem)] pb-10">
+          <div className="flex flex-col gap-6 p-6">
+            {uniqueStoreIds.length > 0 ? (
+              uniqueStoreIds.map(
+                (storeId) =>
+                  storeId && <CheckoutCard key={storeId} storeId={storeId} />,
+              )
+            ) : (
+              <section
+                id="cart-page-empty-cart"
+                aria-labelledby="cart-page-empty-cart-heading"
+                className="flex flex-col items-center justify-center space-y-1 pt-16"
+              >
+                <Icons.cart
+                  className="mb-4 size-16 text-muted-foreground"
+                  aria-hidden="true"
+                />
+                <div className="text-xl font-medium text-muted-foreground">
+                  Your cart is empty
+                </div>
+                <Link
+                  aria-label="Add items to your cart to checkout"
+                  href="/products"
+                  className={cn(
+                    buttonVariants({
+                      variant: "link",
+                      size: "sm",
+                      className: "text-sm text-muted-foreground",
+                    }),
+                  )}
+                >
+                  Add items to your cart to checkout
+                </Link>
+              </section>
+            )}
+          </div>
+        </ScrollArea>
+      </SheetContent>
+    </Sheet>
+  );
+}
diff --git a/src/app/[locale]/(checkout)/cart/layout.tsx b/src/app/[locale]/cart/layout.tsx
similarity index 72%
rename from src/app/[locale]/(checkout)/cart/layout.tsx
rename to src/app/[locale]/cart/layout.tsx
index 72d1095c..64ec055a 100644
--- a/src/app/[locale]/(checkout)/cart/layout.tsx
+++ b/src/app/[locale]/cart/layout.tsx
@@ -1,8 +1,7 @@
-import * as React from "react";
 import { redirect } from "next/navigation";
+import * as React from "react";
 
-import { getCachedUser } from "~/lib/queries/user";
-import { SiteHeader } from "~/components/layouts/site-header";
+import { getCachedUser } from "~/server/queries/user";
 
 export default async function CartLayout({
   children,
@@ -15,7 +14,6 @@ export default async function CartLayout({
 
   return (
     <div className="relative flex min-h-screen flex-col">
-      <SiteHeader user={user} />
       <main className="flex-1">{children}</main>
     </div>
   );
diff --git a/src/app/[locale]/(checkout)/cart/loading.tsx b/src/app/[locale]/cart/loading.tsx
similarity index 99%
rename from src/app/[locale]/(checkout)/cart/loading.tsx
rename to src/app/[locale]/cart/loading.tsx
index c72daf23..11e41f3b 100644
--- a/src/app/[locale]/(checkout)/cart/loading.tsx
+++ b/src/app/[locale]/cart/loading.tsx
@@ -1,3 +1,10 @@
+import { Icons } from "~/components/icons";
+import {
+  PageHeader,
+  PageHeaderDescription,
+  PageHeaderHeading,
+} from "~/components/page-header";
+import { Shell } from "~/components/shell";
 import {
   Card,
   CardContent,
@@ -7,13 +14,6 @@ import {
 import { ScrollArea } from "~/components/ui/scroll-area";
 import { Separator } from "~/components/ui/separator";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Icons } from "~/components/icons";
-import {
-  PageHeader,
-  PageHeaderDescription,
-  PageHeaderHeading,
-} from "~/components/page-header";
-import { Shell } from "~/components/shell";
 
 export default function CartLoading() {
   return (
@@ -24,7 +24,7 @@ export default function CartLoading() {
           Checkout with your cart items
         </PageHeaderDescription>
       </PageHeader>
-      <Card as="section">
+      <Card>
         <CardHeader className="flex flex-row items-center justify-between space-x-4 py-4">
           <Skeleton className="h-6 w-20" />
           <Skeleton className="h-8 w-20" />
diff --git a/src/app/[locale]/cart/page.tsx b/src/app/[locale]/cart/page.tsx
new file mode 100644
index 00000000..6d4e85b9
--- /dev/null
+++ b/src/app/[locale]/cart/page.tsx
@@ -0,0 +1,26 @@
+import type { Metadata } from "next";
+
+import { env } from "~/env.js";
+import { getUniqueStoreIds } from "~/server/actions/cart";
+
+import { CartSheet } from "./client";
+
+export const metadata: Metadata = {
+  metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
+  title: "Cart",
+  description: "Checkout with your cart items",
+};
+
+export default async function CartPage() {
+  const uniqueStoreIds = await getUniqueStoreIds();
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-gray-100">
+      <CartSheet
+        uniqueStoreIds={uniqueStoreIds.filter(
+          (id): id is string => id !== null,
+        )}
+      />
+    </div>
+  );
+}
diff --git a/src/app/[locale]/(lobby)/collections/[category]/[subcategory]/page.tsx b/src/app/[locale]/categories/[category]/[subcategory]/page.tsx
similarity index 58%
rename from src/app/[locale]/(lobby)/collections/[category]/[subcategory]/page.tsx
rename to src/app/[locale]/categories/[category]/[subcategory]/page.tsx
index 8f0675f9..d31025ad 100644
--- a/src/app/[locale]/(lobby)/collections/[category]/[subcategory]/page.tsx
+++ b/src/app/[locale]/categories/[category]/[subcategory]/page.tsx
@@ -1,10 +1,6 @@
 import type { Metadata } from "next";
-import { env } from "~/env.js";
 
-import { getProducts } from "~/lib/queries/product";
-import { getStores } from "~/lib/queries/store";
-import { toTitleCase, unslugify } from "~/lib/utils";
-import { productsSearchParamsSchema } from "~/lib/validations/params";
+import { AlertCard } from "~/components/alert-card";
 import {
   PageHeader,
   PageHeaderDescription,
@@ -12,30 +8,42 @@ import {
 } from "~/components/page-header";
 import { Products } from "~/components/products";
 import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getProducts } from "~/server/queries/product";
+import { getStores } from "~/server/queries/store";
+import { toTitleCase, unslugify } from "~/server/utils";
+import { productsSearchParamsSchema } from "~/server/validations/params";
 
-interface SubcategoryPageProps {
-  params: {
+type SubcategoryPageProps = {
+  params: Promise<{
     category: string;
     subcategory: string;
-  };
+  }>;
   searchParams: Record<string, string | string[] | undefined>;
-}
+};
 
-export function generateMetadata({ params }: SubcategoryPageProps): Metadata {
-  const subcategory = unslugify(params.subcategory);
+/* export async function generateMetadata({
+  params,
+}: SubcategoryPageProps): Promise<Metadata> {
+  const resolvedParams = await params;
+  const { category, subcategory } = resolvedParams;
+  const subcategoryTitle = unslugify(subcategory);
 
   return {
     metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
-    title: toTitleCase(subcategory),
-    description: `Buy the best ${subcategory}`,
+    title: toTitleCase(subcategoryTitle),
+    description: `Buy the best ${subcategoryTitle}`,
   };
-}
+} */
 
 export default async function SubcategoryPage({
   params,
   searchParams,
 }: SubcategoryPageProps) {
-  const { category, subcategory } = params;
+  /* const resolvedParams = await params;
+  const { category, subcategory } = resolvedParams;
+
+  const subcategoryTitle = unslugify(subcategory);
   const { page, per_page, sort, price_range, store_ids, store_page, active } =
     productsSearchParamsSchema.parse(searchParams);
 
@@ -52,18 +60,19 @@ export default async function SubcategoryPage({
       ? (parseInt(store_page) - 1) * storesLimit
       : 0;
 
-  const storesTransaction = await getStores(searchParams);
+  const storesTransaction = await getStores(searchParams); */
 
   return (
-    <Shell>
-      <PageHeader>
+    <Shell className="mt-20">
+      <AlertCard />
+      {/* <PageHeader>
         <PageHeaderHeading size="sm">
-          {toTitleCase(unslugify(subcategory))}
+          {toTitleCase(subcategoryTitle)}
         </PageHeaderHeading>
         <PageHeaderDescription size="sm">
-          {`Buy the best ${unslugify(subcategory)}`}
+          {`Buy the best ${subcategoryTitle}`}
         </PageHeaderDescription>
-      </PageHeader>
+      </PageHeader> */}
       {/* <Products
         products={productsTransaction.data}
         pageCount={productsTransaction.pageCount}
diff --git a/src/app/[locale]/(lobby)/collections/[category]/loading.tsx b/src/app/[locale]/categories/[category]/loading.tsx
similarity index 100%
rename from src/app/[locale]/(lobby)/collections/[category]/loading.tsx
rename to src/app/[locale]/categories/[category]/loading.tsx
diff --git a/src/app/[locale]/(lobby)/collections/[category]/page.tsx b/src/app/[locale]/categories/[category]/page.tsx
similarity index 90%
rename from src/app/[locale]/(lobby)/collections/[category]/page.tsx
rename to src/app/[locale]/categories/[category]/page.tsx
index 9db651fc..ce0a80de 100644
--- a/src/app/[locale]/(lobby)/collections/[category]/page.tsx
+++ b/src/app/[locale]/categories/[category]/page.tsx
@@ -1,9 +1,7 @@
 import type { Metadata } from "next";
-import { env } from "~/env.js";
+
 import type { SearchParams } from "~/types";
 
-import { getProducts } from "~/lib/queries/product";
-import { toTitleCase } from "~/lib/utils";
 import { AlertCard } from "~/components/alert-card";
 import {
   PageHeader,
@@ -11,11 +9,14 @@ import {
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getProducts } from "~/server/queries/product";
+import { toTitleCase } from "~/server/utils";
 
-interface CategoryPageProps {
+type CategoryPageProps = {
   params: Promise<{ category: string }>;
   searchParams: SearchParams;
-}
+};
 
 export async function generateMetadata({
   params,
diff --git a/src/app/[locale]/(checkout)/checkout/[storeId]/error.tsx b/src/app/[locale]/checkout/[storeId]/error.tsx
similarity index 100%
rename from src/app/[locale]/(checkout)/checkout/[storeId]/error.tsx
rename to src/app/[locale]/checkout/[storeId]/error.tsx
diff --git a/src/app/[locale]/(checkout)/checkout/[storeId]/loading.tsx b/src/app/[locale]/checkout/[storeId]/loading.tsx
similarity index 100%
rename from src/app/[locale]/(checkout)/checkout/[storeId]/loading.tsx
rename to src/app/[locale]/checkout/[storeId]/loading.tsx
index d9d1a0cb..c5c6668b 100644
--- a/src/app/[locale]/(checkout)/checkout/[storeId]/loading.tsx
+++ b/src/app/[locale]/checkout/[storeId]/loading.tsx
@@ -1,7 +1,7 @@
+import { Icons } from "~/components/icons";
 import { ScrollArea } from "~/components/ui/scroll-area";
 import { Separator } from "~/components/ui/separator";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Icons } from "~/components/icons";
 
 export default function CheckoutLoading() {
   return (
diff --git a/src/app/[locale]/(checkout)/checkout/[storeId]/page.tsx b/src/app/[locale]/checkout/[storeId]/page.tsx
similarity index 95%
rename from src/app/[locale]/(checkout)/checkout/[storeId]/page.tsx
rename to src/app/[locale]/checkout/[storeId]/page.tsx
index 7e73a2bd..3aaae0c2 100644
--- a/src/app/[locale]/(checkout)/checkout/[storeId]/page.tsx
+++ b/src/app/[locale]/checkout/[storeId]/page.tsx
@@ -1,23 +1,24 @@
 import type { Metadata } from "next";
-import Link from "next/link";
-import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { stores } from "~/db/schema";
-import { env } from "~/env.js";
+
 import { ArrowLeftIcon } from "@radix-ui/react-icons";
 import { eq } from "drizzle-orm";
+import Link from "next/link";
+import { notFound } from "next/navigation";
 
-import { getCart } from "~/lib/actions/cart";
-import { createPaymentIntent, getStripeAccount } from "~/lib/actions/stripe";
-import { cn, formatPrice } from "~/lib/utils";
-import { Button, buttonVariants } from "~/components/ui/button";
-import { Drawer, DrawerContent, DrawerTrigger } from "~/components/ui/drawer";
-import { ScrollArea } from "~/components/ui/scroll-area";
-import { Separator } from "~/components/ui/separator";
 import { CartLineItems } from "~/components/checkout/cart-line-items";
 import { CheckoutForm } from "~/components/checkout/checkout-form";
 import { CheckoutShell } from "~/components/checkout/checkout-shell";
 import { Shell } from "~/components/shell";
+import { Button, buttonVariants } from "~/components/ui/button";
+import { Drawer, DrawerContent, DrawerTrigger } from "~/components/ui/drawer";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import { Separator } from "~/components/ui/separator";
+import { env } from "~/env.js";
+import { getCart } from "~/server/actions/cart";
+import { createPaymentIntent, getStripeAccount } from "~/server/actions/stripe";
+import { db } from "~/server/db";
+import { stores } from "~/server/db/schema";
+import { cn, formatPrice } from "~/server/utils";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -25,11 +26,11 @@ export const metadata: Metadata = {
   description: "Checkout with store items",
 };
 
-interface CheckoutPageProps {
+type CheckoutPageProps = {
   params: {
     storeId: string;
   };
-}
+};
 
 export default async function CheckoutPage({ params }: CheckoutPageProps) {
   const storeId = decodeURIComponent(params.storeId);
diff --git a/src/app/[locale]/(checkout)/checkout/[storeId]/success/loading.tsx b/src/app/[locale]/checkout/[storeId]/success/loading.tsx
similarity index 100%
rename from src/app/[locale]/(checkout)/checkout/[storeId]/success/loading.tsx
rename to src/app/[locale]/checkout/[storeId]/success/loading.tsx
index b854f68a..528bf256 100644
--- a/src/app/[locale]/(checkout)/checkout/[storeId]/success/loading.tsx
+++ b/src/app/[locale]/checkout/[storeId]/success/loading.tsx
@@ -1,12 +1,12 @@
-import { ScrollArea } from "~/components/ui/scroll-area";
-import { Separator } from "~/components/ui/separator";
-import { Skeleton } from "~/components/ui/skeleton";
 import { Icons } from "~/components/icons";
 import {
   PageHeader,
   PageHeaderDescription,
   PageHeaderHeading,
 } from "~/components/page-header";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import { Separator } from "~/components/ui/separator";
+import { Skeleton } from "~/components/ui/skeleton";
 
 export default function OrderSuccessLoading() {
   return (
diff --git a/src/app/[locale]/(checkout)/checkout/[storeId]/success/page.tsx b/src/app/[locale]/checkout/[storeId]/success/page.tsx
similarity index 94%
rename from src/app/[locale]/(checkout)/checkout/[storeId]/success/page.tsx
rename to src/app/[locale]/checkout/[storeId]/success/page.tsx
index 498f6386..e7c8e799 100644
--- a/src/app/[locale]/(checkout)/checkout/[storeId]/success/page.tsx
+++ b/src/app/[locale]/checkout/[storeId]/success/page.tsx
@@ -1,14 +1,8 @@
 import type { Metadata } from "next";
-import Link from "next/link";
-import { db } from "~/db";
-import { stores } from "~/db/schema";
-import { env } from "~/env.js";
+
 import { eq } from "drizzle-orm";
+import Link from "next/link";
 
-import { getOrderLineItems } from "~/lib/actions/order";
-import { getPaymentIntent } from "~/lib/actions/stripe";
-import { cn, formatPrice } from "~/lib/utils";
-import { buttonVariants } from "~/components/ui/button";
 import { CartLineItems } from "~/components/checkout/cart-line-items";
 import { VerifyOderForm } from "~/components/checkout/verify-order-form";
 import {
@@ -16,6 +10,13 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "~/components/page-header";
+import { buttonVariants } from "~/components/ui/button";
+import { env } from "~/env.js";
+import { getOrderLineItems } from "~/server/actions/order";
+import { getPaymentIntent } from "~/server/actions/stripe";
+import { db } from "~/server/db";
+import { stores } from "~/server/db/schema";
+import { cn, formatPrice } from "~/server/utils";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -23,12 +24,12 @@ export const metadata: Metadata = {
   description: "Order summary for your purchase",
 };
 
-interface OrderSuccessPageProps {
+type OrderSuccessPageProps = {
   params: {
     storeId: string;
   };
   searchParams: Record<string, string | string[] | undefined>;
-}
+};
 
 export default async function OrderSuccessPage({
   params,
diff --git a/src/app/[locale]/(checkout)/checkout/layout.tsx b/src/app/[locale]/checkout/layout.tsx
similarity index 82%
rename from src/app/[locale]/(checkout)/checkout/layout.tsx
rename to src/app/[locale]/checkout/layout.tsx
index 912910e7..7f0da153 100644
--- a/src/app/[locale]/(checkout)/checkout/layout.tsx
+++ b/src/app/[locale]/checkout/layout.tsx
@@ -1,6 +1,6 @@
 import { redirect } from "next/navigation";
 
-import { getCachedUser } from "~/lib/queries/user";
+import { getCachedUser } from "~/server/queries/user";
 
 export default async function CheckoutLayout({
   children,
diff --git a/src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/_components/user-profile.tsx b/src/app/[locale]/dashboard/account/[[...rest]]/_components/user-profile.tsx
similarity index 99%
rename from src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/_components/user-profile.tsx
rename to src/app/[locale]/dashboard/account/[[...rest]]/_components/user-profile.tsx
index 0a7149e6..df0bf021 100644
--- a/src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/_components/user-profile.tsx
+++ b/src/app/[locale]/dashboard/account/[[...rest]]/_components/user-profile.tsx
@@ -1,8 +1,9 @@
 "use client";
 
+import type { Theme, UserProfileProps } from "@clerk/types";
+
 import { UserProfile as ClerkUserProfile } from "@clerk/nextjs";
 import { dark } from "@clerk/themes";
-import type { Theme, UserProfileProps } from "@clerk/types";
 import { useTheme } from "next-themes";
 
 const appearance: Theme = {
diff --git a/src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/loading.tsx b/src/app/[locale]/dashboard/account/[[...rest]]/loading.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/loading.tsx
rename to src/app/[locale]/dashboard/account/[[...rest]]/loading.tsx
index d924c5d5..057fc733 100644
--- a/src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/loading.tsx
+++ b/src/app/[locale]/dashboard/account/[[...rest]]/loading.tsx
@@ -1,10 +1,10 @@
-import { Skeleton } from "~/components/ui/skeleton";
 import {
   PageHeader,
   PageHeaderDescription,
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { Skeleton } from "~/components/ui/skeleton";
 
 export default function AccountLoading() {
   return (
diff --git a/src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/page.tsx b/src/app/[locale]/dashboard/account/[[...rest]]/page.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/page.tsx
rename to src/app/[locale]/dashboard/account/[[...rest]]/page.tsx
index 323757fb..84c8f786 100644
--- a/src/app/[locale]/(dashboard)/dashboard/account/[[...rest]]/page.tsx
+++ b/src/app/[locale]/dashboard/account/[[...rest]]/page.tsx
@@ -1,13 +1,13 @@
 import type { Metadata } from "next";
-import { env } from "~/env.js";
 
-import { ScrollArea, ScrollBar } from "~/components/ui/scroll-area";
 import {
   PageHeader,
   PageHeaderDescription,
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { ScrollArea, ScrollBar } from "~/components/ui/scroll-area";
+import { env } from "~/env.js";
 
 import { UserProfile } from "./_components/user-profile";
 
diff --git a/src/app/[locale]/(dashboard)/dashboard/billing/_components/billing-skeleton.tsx b/src/app/[locale]/dashboard/billing/_components/billing-skeleton.tsx
similarity index 98%
rename from src/app/[locale]/(dashboard)/dashboard/billing/_components/billing-skeleton.tsx
rename to src/app/[locale]/dashboard/billing/_components/billing-skeleton.tsx
index a46195e5..744e2025 100644
--- a/src/app/[locale]/(dashboard)/dashboard/billing/_components/billing-skeleton.tsx
+++ b/src/app/[locale]/dashboard/billing/_components/billing-skeleton.tsx
@@ -1,4 +1,3 @@
-import { cn } from "~/lib/utils";
 import {
   Card,
   CardContent,
@@ -6,6 +5,7 @@ import {
   CardHeader,
 } from "~/components/ui/card";
 import { Skeleton } from "~/components/ui/skeleton";
+import { cn } from "~/server/utils";
 
 export function BillingSkeleton() {
   return (
diff --git a/src/app/[locale]/(dashboard)/dashboard/billing/_components/billing.tsx b/src/app/[locale]/dashboard/billing/_components/billing.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/billing/_components/billing.tsx
rename to src/app/[locale]/dashboard/billing/_components/billing.tsx
index f8b4d7cd..cf065a0d 100644
--- a/src/app/[locale]/(dashboard)/dashboard/billing/_components/billing.tsx
+++ b/src/app/[locale]/dashboard/billing/_components/billing.tsx
@@ -1,10 +1,9 @@
+import { CheckIcon } from "@radix-ui/react-icons";
 import Link from "next/link";
+
 import type { PlanWithPrice, UserPlan } from "~/types";
-import { CheckIcon } from "@radix-ui/react-icons";
 
-import { type getUserUsageMetrics } from "~/lib/queries/user";
-import { getPlanLimits } from "~/lib/subscription";
-import { cn, formatDate } from "~/lib/utils";
+import { ManagePlanForm } from "~/components/manage-plan-form";
 import { Badge } from "~/components/ui/badge";
 import { Button } from "~/components/ui/button";
 import {
@@ -15,14 +14,16 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import { ManagePlanForm } from "~/components/manage-plan-form";
 import { UsageCard } from "~/components/usage-card";
+import { type getUserUsageMetrics } from "~/server/queries/user";
+import { getPlanLimits } from "~/server/subscription";
+import { cn, formatDate } from "~/server/utils";
 
-interface BillingProps {
+type BillingProps = {
   planPromise: Promise<UserPlan | null>;
   plansPromise: Promise<PlanWithPrice[]>;
   usageMetricsPromise: ReturnType<typeof getUserUsageMetrics>;
-}
+};
 
 export async function Billing({
   planPromise,
diff --git a/src/app/[locale]/(dashboard)/dashboard/billing/page.tsx b/src/app/[locale]/dashboard/billing/page.tsx
similarity index 94%
rename from src/app/[locale]/(dashboard)/dashboard/billing/page.tsx
rename to src/app/[locale]/dashboard/billing/page.tsx
index 1f47ee06..752c293b 100644
--- a/src/app/[locale]/(dashboard)/dashboard/billing/page.tsx
+++ b/src/app/[locale]/dashboard/billing/page.tsx
@@ -1,22 +1,23 @@
-import * as React from "react";
 import type { Metadata } from "next";
-import { redirect } from "next/navigation";
-import { env } from "~/env.js";
+
 import { RocketIcon } from "@radix-ui/react-icons";
+import { redirect } from "next/navigation";
+import * as React from "react";
 
-import { getPlan, getPlans } from "~/lib/actions/stripe";
-import { getCachedUser, getUserUsageMetrics } from "~/lib/queries/user";
-import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
+import { AlertCard } from "~/components/alert-card";
 import {
   PageHeader,
   PageHeaderDescription,
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
+import { env } from "~/env.js";
+import { getPlan, getPlans } from "~/server/actions/stripe";
+import { getCachedUser, getUserUsageMetrics } from "~/server/queries/user";
 
 import { Billing } from "./_components/billing";
 import { BillingSkeleton } from "./_components/billing-skeleton";
-import { AlertCard } from "~/components/alert-card";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
diff --git a/src/app/[locale]/(dashboard)/dashboard/layout.tsx b/src/app/[locale]/dashboard/layout.tsx
similarity index 65%
rename from src/app/[locale]/(dashboard)/dashboard/layout.tsx
rename to src/app/[locale]/dashboard/layout.tsx
index 054c68de..12974acd 100644
--- a/src/app/[locale]/(dashboard)/dashboard/layout.tsx
+++ b/src/app/[locale]/dashboard/layout.tsx
@@ -1,24 +1,26 @@
+import consola from "consola";
+import { eq } from "drizzle-orm";
 import { redirect } from "next/navigation";
-import { getStoresByUserId } from "~/lib/queries/store";
-import { getCachedUser, getUserPlanMetrics } from "~/lib/queries/user";
+
+import type { User } from "~/server/db/schema";
 
 import { SidebarProvider } from "~/components/layouts/sidebar-provider";
-import { DashboardHeader } from "./stores/[storeId]/_components/dashboard-header";
+import { db } from "~/server/db";
+import { usersTable } from "~/server/db/schema";
+import { getStoresByUserId } from "~/server/queries/store";
+import { getCachedUser, getUserPlanMetrics } from "~/server/queries/user";
+
 import { DashboardSidebar } from "./stores/[storeId]/_components/dashboard-sidebar";
 import { DashboardSidebarSheet } from "./stores/[storeId]/_components/dashboard-sidebar-sheet";
 import { StoreSwitcher } from "./stores/[storeId]/_components/store-switcher";
-import consola from "consola";
-import { User, usersTable } from "~/db/schema";
-import { eq } from "drizzle-orm";
-import { db } from "~/db";
 import { getCurrentStoreId } from "./stores/[storeId]/_components/storeSwitcherActions";
 
-interface DashboardLayoutProps {
+type DashboardLayoutProps = {
   params?: {
     storeId?: string;
   };
   children: React.ReactNode;
-}
+};
 
 export default async function DashboardLayout({
   params = {},
@@ -36,7 +38,7 @@ export default async function DashboardLayout({
       const existingUser = await trx
         .select()
         .from(usersTable)
-        .where(eq(usersTable.email, user.emailAddresses[0].emailAddress))
+        .where(eq(usersTable.email, user.emailAddresses[0]?.emailAddress ?? ""))
         .limit(1);
 
       let userRecord = existingUser[0];
@@ -44,13 +46,13 @@ export default async function DashboardLayout({
       // If the user does not exist, create it
       if (!userRecord) {
         consola.info(
-          `Creating user ${user.emailAddresses[0].emailAddress} in usersTable.`,
+          `Creating user ${user.emailAddresses[0]?.emailAddress} in usersTable.`,
         );
         const newUser = {
           id: user.id,
           name: `${user.firstName ?? ""} ${user.lastName ?? ""}`.trim(),
           age: 0,
-          email: user.emailAddresses[0].emailAddress,
+          email: user.emailAddresses[0]?.emailAddress ?? "",
           currentStoreId: "",
         };
 
@@ -81,23 +83,23 @@ export default async function DashboardLayout({
     const currentStoreId = await getCurrentStoreId(user.id);
 
     return (
-      <SidebarProvider>
-        <div className="grid min-h-screen w-full lg:grid-cols-[17.5rem_1fr]">
-          <DashboardSidebar
-            storeId={storeId}
-            className="top-0 z-30 hidden flex-col gap-4 border-r border-border/60 lg:sticky lg:block"
-          >
-            <StoreSwitcher
-              userId={user.id}
-              storesPromise={getStoresByUserId({ userId: user.id })}
-              planMetricsPromise={planMetricsPromise}
-              currentStoreId={currentStoreId}
-            />
-          </DashboardSidebar>
-          <div className="flex flex-col">
-            <DashboardHeader user={user} storeId={storeId}>
+      <>
+        <SidebarProvider>
+          <div className="grid w-full lg:grid-cols-[17.5rem_1fr] -mt-2">
+            <DashboardSidebar
+              storeId={storeId ?? ""}
+              className="top-0 z-30 hidden flex-col gap-4 border-r pt-6 border-border/60 lg:sticky lg:block"
+            >
+              <StoreSwitcher
+                userId={user.id}
+                storesPromise={getStoresByUserId({ userId: user.id })}
+                planMetricsPromise={planMetricsPromise}
+                currentStoreId={currentStoreId}
+              />
+            </DashboardSidebar>
+            <div className="flex flex-col">
               <DashboardSidebarSheet className="lg:hidden">
-                <DashboardSidebar storeId={storeId}>
+                <DashboardSidebar storeId={storeId ?? ""}>
                   <StoreSwitcher
                     userId={user.id}
                     storesPromise={getStoresByUserId({ userId: user.id })}
@@ -106,11 +108,11 @@ export default async function DashboardLayout({
                   />
                 </DashboardSidebar>
               </DashboardSidebarSheet>
-            </DashboardHeader>
-            <main className="flex-1 overflow-hidden px-6">{children}</main>
+              <main className="flex-1 overflow-hidden px-6">{children}</main>
+            </div>
           </div>
-        </div>
-      </SidebarProvider>
+        </SidebarProvider>
+      </>
     );
   } catch (error) {
     consola.error("❌ An error occurred:", error);
diff --git a/src/app/[locale]/dashboard/page.tsx b/src/app/[locale]/dashboard/page.tsx
new file mode 100644
index 00000000..0b02043b
--- /dev/null
+++ b/src/app/[locale]/dashboard/page.tsx
@@ -0,0 +1,5 @@
+import { redirect } from "next/navigation";
+
+export default function Dashboard() {
+  return redirect("/dashboard/stores");
+}
diff --git a/src/app/[locale]/(dashboard)/dashboard/purchases/[purchaseId]/loading.tsx b/src/app/[locale]/dashboard/purchases/[purchaseId]/loading.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/purchases/[purchaseId]/loading.tsx
rename to src/app/[locale]/dashboard/purchases/[purchaseId]/loading.tsx
index a827c429..b92f30f3 100644
--- a/src/app/[locale]/(dashboard)/dashboard/purchases/[purchaseId]/loading.tsx
+++ b/src/app/[locale]/dashboard/purchases/[purchaseId]/loading.tsx
@@ -1,7 +1,7 @@
-import { Card, CardContent, CardHeader } from "~/components/ui/card";
-import { Skeleton } from "~/components/ui/skeleton";
 import { PageHeader } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { Card, CardContent, CardHeader } from "~/components/ui/card";
+import { Skeleton } from "~/components/ui/skeleton";
 
 export default function PurchaseLoading() {
   return (
diff --git a/src/app/[locale]/(dashboard)/dashboard/purchases/[purchaseId]/page.tsx b/src/app/[locale]/dashboard/purchases/[purchaseId]/page.tsx
similarity index 90%
rename from src/app/[locale]/(dashboard)/dashboard/purchases/[purchaseId]/page.tsx
rename to src/app/[locale]/dashboard/purchases/[purchaseId]/page.tsx
index 84f6281c..03045e7e 100644
--- a/src/app/[locale]/(dashboard)/dashboard/purchases/[purchaseId]/page.tsx
+++ b/src/app/[locale]/dashboard/purchases/[purchaseId]/page.tsx
@@ -1,13 +1,14 @@
+import { and, eq } from "drizzle-orm";
 import { type Metadata } from "next";
 import Link from "next/link";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { orders, stores } from "~/db/schema";
-import { env } from "~/env.js";
-import { and, eq } from "drizzle-orm";
 
-import { getOrderLineItems } from "~/lib/actions/order";
-import { formatId, formatPrice } from "~/lib/utils";
+import {
+  PageHeader,
+  PageHeaderDescription,
+  PageHeaderHeading,
+} from "~/components/page-header";
+import { Shell } from "~/components/shell";
 import {
   Card,
   CardContent,
@@ -15,12 +16,11 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import {
-  PageHeader,
-  PageHeaderDescription,
-  PageHeaderHeading,
-} from "~/components/page-header";
-import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getOrderLineItems } from "~/server/actions/order";
+import { db } from "~/server/db";
+import { orders, stores } from "~/server/db/schema";
+import { formatId, formatPrice } from "~/server/utils";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -28,11 +28,11 @@ export const metadata: Metadata = {
   description: "View your purchase details",
 };
 
-interface PurchasePageProps {
+type PurchasePageProps = {
   params: {
     purchaseId: string;
   };
-}
+};
 
 export default async function PurchasePage({ params }: PurchasePageProps) {
   // Using the purchaseId as the orderId in the sql query
@@ -68,9 +68,7 @@ export default async function PurchasePage({ params }: PurchasePageProps) {
       </PageHeader>
       <Card>
         <CardHeader className="space-y-1">
-          <CardTitle as="h2" className="text-2xl">
-            Order {formatId(orderId)}
-          </CardTitle>
+          <CardTitle className="text-2xl">Order {formatId(orderId)}</CardTitle>
           <CardDescription>{store?.name ?? "Unknown store"}</CardDescription>
         </CardHeader>
         <CardContent className="flex w-full flex-col space-y-2.5">
diff --git a/src/app/[locale]/(dashboard)/dashboard/purchases/page.tsx b/src/app/[locale]/dashboard/purchases/page.tsx
similarity index 92%
rename from src/app/[locale]/(dashboard)/dashboard/purchases/page.tsx
rename to src/app/[locale]/dashboard/purchases/page.tsx
index 06fa347d..e8c0e38f 100644
--- a/src/app/[locale]/(dashboard)/dashboard/purchases/page.tsx
+++ b/src/app/[locale]/dashboard/purchases/page.tsx
@@ -1,15 +1,11 @@
-import * as React from "react";
 import type { Metadata } from "next";
+
+import { and, asc, desc, eq, inArray, like, sql } from "drizzle-orm";
 import { redirect } from "next/navigation";
-import { db } from "~/db";
-import { orders, stores, type Order } from "~/db/schema";
-import { env } from "~/env.js";
+import * as React from "react";
+
 import type { SearchParams } from "~/types";
-import { and, asc, desc, eq, inArray, like, sql } from "drizzle-orm";
 
-import { getCachedUser } from "~/lib/queries/user";
-import { getUserEmail } from "~/lib/utils";
-import { purchasesSearchParamsSchema } from "~/lib/validations/params";
 import { DataTableSkeleton } from "~/components/data-table/data-table-skeleton";
 import {
   PageHeader,
@@ -18,15 +14,21 @@ import {
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
 import { PurchasesTable } from "~/components/tables/purchases-table";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { orders, stores, type Order } from "~/server/db/schema";
+import { getCachedUser } from "~/server/queries/user";
+import { getUserEmail } from "~/server/utils";
+import { purchasesSearchParamsSchema } from "~/server/validations/params";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
   title: "Purchases",
   description: "Manage your purchases",
 };
-interface PurchasesPageProps {
+type PurchasesPageProps = {
   searchParams: SearchParams;
-}
+};
 
 export default async function PurchasesPage({
   searchParams,
diff --git a/src/app/[locale]/(dashboard)/dashboard/settings/_components/update-notification-form-skeleton.tsx b/src/app/[locale]/dashboard/settings/_components/update-notification-form-skeleton.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/settings/_components/update-notification-form-skeleton.tsx
rename to src/app/[locale]/dashboard/settings/_components/update-notification-form-skeleton.tsx
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/settings/_components/update-notification-form.tsx b/src/app/[locale]/dashboard/settings/_components/update-notification-form.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/settings/_components/update-notification-form.tsx
rename to src/app/[locale]/dashboard/settings/_components/update-notification-form.tsx
index b7df57a7..9e10d08a 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/settings/_components/update-notification-form.tsx
+++ b/src/app/[locale]/dashboard/settings/_components/update-notification-form.tsx
@@ -1,16 +1,11 @@
 "use client";
 
-import * as React from "react";
 import { zodResolver } from "@hookform/resolvers/zod";
+import * as React from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 
-import { updateNotification } from "~/lib/actions/notification";
-import { type getNotification } from "~/lib/queries/notification";
-import {
-  updateNotificationSchema,
-  type UpdateNotificationSchema,
-} from "~/lib/validations/notification";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -22,11 +17,16 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Switch } from "~/components/ui/switch";
-import { Icons } from "~/components/icons";
+import { updateNotification } from "~/server/actions/notification";
+import { type getNotification } from "~/server/queries/notification";
+import {
+  updateNotificationSchema,
+  type UpdateNotificationSchema,
+} from "~/server/validations/notification";
 
-interface UpdateNotificationFormProps {
+type UpdateNotificationFormProps = {
   notificationPromise: ReturnType<typeof getNotification>;
-}
+};
 
 export function UpdateNotificationForm({
   notificationPromise,
diff --git a/src/app/[locale]/(dashboard)/dashboard/settings/page.tsx b/src/app/[locale]/dashboard/settings/page.tsx
similarity index 90%
rename from src/app/[locale]/(dashboard)/dashboard/settings/page.tsx
rename to src/app/[locale]/dashboard/settings/page.tsx
index 4492f8ed..42d12d2b 100644
--- a/src/app/[locale]/(dashboard)/dashboard/settings/page.tsx
+++ b/src/app/[locale]/dashboard/settings/page.tsx
@@ -1,12 +1,16 @@
-import * as React from "react";
 import type { Metadata } from "next";
-import { env } from "~/env.js";
-import type { SearchParams } from "~/types";
+
+import * as React from "react";
 import { z } from "zod";
 
-import { getNotification } from "~/lib/queries/notification";
-import { getCachedUser } from "~/lib/queries/user";
-import { getUserEmail } from "~/lib/utils";
+import type { SearchParams } from "~/types";
+
+import {
+  PageHeader,
+  PageHeaderDescription,
+  PageHeaderHeading,
+} from "~/components/page-header";
+import { Shell } from "~/components/shell";
 import {
   Card,
   CardContent,
@@ -14,12 +18,10 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import {
-  PageHeader,
-  PageHeaderDescription,
-  PageHeaderHeading,
-} from "~/components/page-header";
-import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getNotification } from "~/server/queries/notification";
+import { getCachedUser } from "~/server/queries/user";
+import { getUserEmail } from "~/server/utils";
 
 import { UpdateNotificationForm } from "./_components/update-notification-form";
 import { UpdateNotificationFormSkeleton } from "./_components/update-notification-form-skeleton";
@@ -30,9 +32,9 @@ export const metadata: Metadata = {
   description: "Manage your settings",
 };
 
-interface SettingsPageProps {
+type SettingsPageProps = {
   searchParams: Promise<SearchParams>;
-}
+};
 
 const schema = z.object({
   token: z.string().optional(),
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/create-store-dialog.tsx b/src/app/[locale]/dashboard/stores/[storeId]/_components/create-store-dialog.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/create-store-dialog.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/_components/create-store-dialog.tsx
index a373c1b0..925325f1 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/create-store-dialog.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/_components/create-store-dialog.tsx
@@ -1,19 +1,14 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { HoverCardPortal } from "@radix-ui/react-hover-card";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 
-import { createStore } from "~/lib/actions/store";
-import { type getUserPlanMetrics } from "~/lib/queries/user";
-import {
-  createStoreSchema,
-  type CreateStoreSchema,
-} from "~/lib/validations/store";
-import { useMediaQuery } from "~/hooks/use-media-query";
+import { Icons } from "~/components/icons";
+import { RateLimitAlert } from "~/components/rate-limit-alert";
 import { Button } from "~/components/ui/button";
 import {
   Dialog,
@@ -40,16 +35,20 @@ import {
   HoverCardContent,
   HoverCardTrigger,
 } from "~/components/ui/hover-card";
-import { Icons } from "~/components/icons";
-import { RateLimitAlert } from "~/components/rate-limit-alert";
+import { useMediaQuery } from "~/hooks/use-media-query";
+import { createStore } from "~/server/actions/store";
+import { type getUserPlanMetrics } from "~/server/queries/user";
+import {
+  createStoreSchema,
+  type CreateStoreSchema,
+} from "~/server/validations/store";
 
 import { CreateStoreForm } from "./create-store-form";
 
-interface CreateStoreDialogProps
-  extends React.ComponentPropsWithoutRef<typeof Dialog> {
+type CreateStoreDialogProps = {
   userId: string;
   planMetricsPromise: ReturnType<typeof getUserPlanMetrics>;
-}
+} & React.ComponentPropsWithoutRef<typeof Dialog>;
 
 export function CreateStoreDialog({
   userId,
@@ -199,9 +198,9 @@ export function CreateStoreDialog({
   );
 }
 
-interface RateLimitHoverCardProps {
+type RateLimitHoverCardProps = {
   planMetrics: Awaited<ReturnType<typeof getUserPlanMetrics>>;
-}
+};
 
 export function RateLimitHoverCard({ planMetrics }: RateLimitHoverCardProps) {
   return (
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/create-store-form.tsx b/src/app/[locale]/dashboard/stores/[storeId]/_components/create-store-form.tsx
similarity index 89%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/create-store-form.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/_components/create-store-form.tsx
index 08d72ae8..fe161305 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/create-store-form.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/_components/create-store-form.tsx
@@ -3,8 +3,6 @@
 import * as React from "react";
 import { type UseFormReturn } from "react-hook-form";
 
-import { cn } from "~/lib/utils";
-import { type CreateStoreSchema } from "~/lib/validations/store";
 import {
   Form,
   FormControl,
@@ -15,13 +13,14 @@ import {
 } from "~/components/ui/form";
 import { Input } from "~/components/ui/input";
 import { Textarea } from "~/components/ui/textarea";
+import { cn } from "~/server/utils";
+import { type CreateStoreSchema } from "~/server/validations/store";
 
-interface CreateStoreFormProps
-  extends Omit<React.ComponentPropsWithRef<"form">, "onSubmit"> {
+type CreateStoreFormProps = {
   children: React.ReactNode;
   form: UseFormReturn<CreateStoreSchema>;
   onSubmit: (data: CreateStoreSchema) => void;
-}
+} & Omit<React.ComponentPropsWithRef<"form">, "onSubmit">;
 
 export function CreateStoreForm({
   children,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-sidebar-sheet.tsx b/src/app/[locale]/dashboard/stores/[storeId]/_components/dashboard-sidebar-sheet.tsx
similarity index 90%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-sidebar-sheet.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/_components/dashboard-sidebar-sheet.tsx
index b909f3b3..a8d5c011 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-sidebar-sheet.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/_components/dashboard-sidebar-sheet.tsx
@@ -2,8 +2,8 @@
 
 import Link from "next/link";
 
-import { cn } from "~/lib/utils";
-import { useMediaQuery } from "~/hooks/use-media-query";
+import { Icons } from "~/components/icons";
+import { useSidebar } from "~/components/layouts/sidebar-provider";
 import { Button, type ButtonProps } from "~/components/ui/button";
 import {
   Sheet,
@@ -13,13 +13,13 @@ import {
   SheetTitle,
   SheetTrigger,
 } from "~/components/ui/sheet";
-import { Icons } from "~/components/icons";
-
-import { useSidebar } from "~/components/layouts/sidebar-provider";
+import { useMediaQuery } from "~/hooks/use-media-query";
+import { cn } from "~/server/utils";
 
-export interface DashboardSidebarSheetProps
-  extends React.ComponentPropsWithRef<typeof SheetTrigger>,
-    ButtonProps {}
+export type DashboardSidebarSheetProps = {} & React.ComponentPropsWithRef<
+  typeof SheetTrigger
+> &
+  ButtonProps;
 
 export function DashboardSidebarSheet({
   children,
@@ -29,7 +29,9 @@ export function DashboardSidebarSheet({
   const { open, setOpen } = useSidebar();
   const isDesktop = useMediaQuery("(min-width: 1024px)");
 
-  if (isDesktop) return null;
+  if (isDesktop) {
+    return null;
+  }
 
   return (
     <Sheet open={open} onOpenChange={setOpen}>
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-sidebar.tsx b/src/app/[locale]/dashboard/stores/[storeId]/_components/dashboard-sidebar.tsx
similarity index 74%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-sidebar.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/_components/dashboard-sidebar.tsx
index 48a36ce8..8d4d7109 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/dashboard-sidebar.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/_components/dashboard-sidebar.tsx
@@ -1,20 +1,20 @@
 "use client";
 
-import * as React from "react";
 import Link from "next/link";
 import { useSelectedLayoutSegments } from "next/navigation";
-import { type SidebarNavItem } from "~/types";
+import * as React from "react";
 
-import { siteConfig } from "~/config/site";
-import { cn } from "~/lib/utils";
-import { ScrollArea } from "~/components/ui/scroll-area";
 import { Icons } from "~/components/icons";
 import { SidebarNav } from "~/components/layouts/sidebar-nav";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import { siteConfig } from "~/config/site";
+import { cn } from "~/server/utils";
+import { type SidebarNavItem } from "~/types";
 
-interface DashboardSidebarProps extends React.HTMLAttributes<HTMLElement> {
+type DashboardSidebarProps = {
   storeId: string;
   children: React.ReactNode;
-}
+} & React.HTMLAttributes<HTMLElement>;
 
 export function DashboardSidebar({
   storeId,
@@ -65,18 +65,7 @@ export function DashboardSidebar({
 
   return (
     <aside className={cn("h-screen w-full", className)} {...props}>
-      <div className="hidden h-[3.55rem] items-center border-b border-border/60 px-4 lg:flex lg:px-6">
-        <Link
-          href="/"
-          className="flex w-fit items-center font-heading tracking-wider text-foreground/90 transition-colors hover:text-foreground"
-        >
-          <Icons.logo className="mb-1 mr-2 size-7" aria-hidden="true" />
-          {siteConfig.name}
-        </Link>
-      </div>
-      <div className="flex flex-col gap-2.5 px-4 pt-2 lg:px-6 lg:pt-4">
-        {children}
-      </div>
+      <div className="flex flex-col gap-2.5 px-4 lg:px-6">{children}</div>
       <ScrollArea className="h-[calc(100vh-8rem)] px-3 py-2.5 lg:px-5">
         <SidebarNav items={sidebarNav} className="p-1 pt-4" />
       </ScrollArea>
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/store-switcher.tsx b/src/app/[locale]/dashboard/stores/[storeId]/_components/store-switcher.tsx
similarity index 89%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/store-switcher.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/_components/store-switcher.tsx
index 92a5c6f1..77efbb20 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/store-switcher.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/_components/store-switcher.tsx
@@ -1,7 +1,5 @@
 "use client";
 
-import * as React from "react";
-import { useParams, usePathname, useRouter } from "next/navigation";
 import { DialogTitle } from "@radix-ui/react-dialog";
 import {
   CaretSortIcon,
@@ -9,10 +7,11 @@ import {
   FrameIcon,
   PlusCircledIcon,
 } from "@radix-ui/react-icons";
+import Link from "next/link";
+import { useParams, usePathname, useRouter } from "next/navigation";
+import * as React from "react";
 
-import { type getStoresByUserId } from "~/lib/queries/store";
-import { type getUserPlanMetrics } from "~/lib/queries/user";
-import { cn } from "~/lib/utils";
+import { RateLimitAlert } from "~/components/rate-limit-alert";
 import { Button } from "~/components/ui/button";
 import {
   Command,
@@ -29,18 +28,19 @@ import {
   PopoverContent,
   PopoverTrigger,
 } from "~/components/ui/popover";
-import { RateLimitAlert } from "~/components/rate-limit-alert";
+import { type getStoresByUserId } from "~/server/queries/store";
+import { type getUserPlanMetrics } from "~/server/queries/user";
+import { cn } from "~/server/utils";
 
 import { CreateStoreDialog } from "./create-store-dialog";
 import { updateCurrentStore } from "./storeSwitcherActions";
 
-interface StoreSwitcherProps
-  extends React.ComponentPropsWithoutRef<typeof PopoverTrigger> {
+type StoreSwitcherProps = {
   userId: string;
   storesPromise: ReturnType<typeof getStoresByUserId>;
   planMetricsPromise: ReturnType<typeof getUserPlanMetrics>;
   currentStoreId?: string;
-}
+} & React.ComponentPropsWithoutRef<typeof PopoverTrigger>;
 
 export function StoreSwitcher({
   userId,
@@ -77,9 +77,13 @@ export function StoreSwitcher({
       <Dialog open={showRateLimitDialog} onOpenChange={setShowRateLimitDialog}>
         <DialogContent className="gap-0">
           <DialogHeader className="text-left">
-            <DialogTitle>Rate limit exceeded</DialogTitle>
+            <DialogTitle>Store limit exceeded</DialogTitle>
           </DialogHeader>
-          <RateLimitAlert planMetrics={planMetrics} />
+          {/* TODO: fix Stripe's error show in the toast */}
+          {/* <RateLimitAlert planMetrics={planMetrics} /> */}{" "}
+          <Link href="/dashboard/billing" className="mt-4">
+            <Button>Upgrade</Button>
+          </Link>
         </DialogContent>
       </Dialog>
       <Popover open={open} onOpenChange={setOpen}>
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/storeSwitcherActions.ts b/src/app/[locale]/dashboard/stores/[storeId]/_components/storeSwitcherActions.ts
similarity index 83%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/storeSwitcherActions.ts
rename to src/app/[locale]/dashboard/stores/[storeId]/_components/storeSwitcherActions.ts
index c3da6a7d..f9e5bf55 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/_components/storeSwitcherActions.ts
+++ b/src/app/[locale]/dashboard/stores/[storeId]/_components/storeSwitcherActions.ts
@@ -1,9 +1,12 @@
 "use server";
 
-import { db } from "~/db";
-import { User, usersTable } from "~/db/schema";
 import { eq } from "drizzle-orm";
 
+import type { User } from "~/server/db/schema";
+
+import { db } from "~/server/db";
+import { usersTable } from "~/server/db/schema";
+
 export async function updateCurrentStore(userId: string, storeId: string) {
   try {
     await db
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/_components/overview-card.tsx b/src/app/[locale]/dashboard/stores/[storeId]/analytics/_components/overview-card.tsx
similarity index 97%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/_components/overview-card.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/analytics/_components/overview-card.tsx
index 9b60c9ec..2e80dce0 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/_components/overview-card.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/analytics/_components/overview-card.tsx
@@ -1,13 +1,13 @@
+import { Icons } from "~/components/icons";
 import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Icons } from "~/components/icons";
 
-interface OverviewCardProps {
+type OverviewCardProps = {
   title: string;
   value: string;
   description: string;
   icon: keyof typeof Icons;
-}
+};
 
 export function OverviewCard({
   title,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/_components/sales-chart.tsx b/src/app/[locale]/dashboard/stores/[storeId]/analytics/_components/sales-chart.tsx
similarity index 76%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/_components/sales-chart.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/analytics/_components/sales-chart.tsx
index 4c7eb83b..82d72302 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/_components/sales-chart.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/analytics/_components/sales-chart.tsx
@@ -2,15 +2,14 @@
 
 import { LineChart, type LineChartProps } from "@tremor/react";
 
-import { cn, formatPrice } from "~/lib/utils";
+import { cn, formatPrice } from "~/server/utils";
 
-interface SalesChartProps
-  extends Omit<LineChartProps, "data" | "index" | "categories"> {
+type SalesChartProps = {
   data: {
     name: string;
     Total: number;
   }[];
-}
+} & Omit<LineChartProps, "data" | "index" | "categories">;
 
 export function SalesChart({ data, className, ...props }: SalesChartProps) {
   return (
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/analytics/page.tsx
similarity index 96%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/analytics/page.tsx
index 454a12b2..3e5ecd94 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/analytics/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/analytics/page.tsx
@@ -1,21 +1,13 @@
 import type { Metadata } from "next";
-import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { stores } from "~/db/schema";
-import { env } from "~/env.js";
-import type { SearchParams } from "~/types";
+
 import { format } from "date-fns";
 import { eq } from "drizzle-orm";
+import { notFound } from "next/navigation";
 import { z } from "zod";
 
-import {
-  getCustomers,
-  getOrderCount,
-  getSaleCount,
-  getSales,
-} from "~/lib/actions/order";
-import { cn, formatNumber, formatPrice } from "~/lib/utils";
-import { searchParamsSchema } from "~/lib/validations/params";
+import type { SearchParams } from "~/types";
+
+import { DateRangePicker } from "~/components/date-range-picker";
 import { Avatar, AvatarFallback } from "~/components/ui/avatar";
 import {
   Card,
@@ -32,7 +24,17 @@ import {
   PaginationNext,
   PaginationPrevious,
 } from "~/components/ui/pagination";
-import { DateRangePicker } from "~/components/date-range-picker";
+import { env } from "~/env.js";
+import {
+  getCustomers,
+  getOrderCount,
+  getSaleCount,
+  getSales,
+} from "~/server/actions/order";
+import { db } from "~/server/db";
+import { stores } from "~/server/db/schema";
+import { cn, formatNumber, formatPrice } from "~/server/utils";
+import { searchParamsSchema } from "~/server/validations/params";
 
 import { OverviewCard } from "./_components/overview-card";
 import { SalesChart } from "./_components/sales-chart";
@@ -43,12 +45,12 @@ export const metadata: Metadata = {
   description: "Analytics for your store",
 };
 
-interface AnalyticsPageProps {
+type AnalyticsPageProps = {
   params: Promise<{
     storeId: string;
   }>;
   searchParams: Promise<SearchParams>;
-}
+};
 
 export default async function AnalyticsPage({
   params,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/customers/[customerId]/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/customers/[customerId]/page.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/customers/[customerId]/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/customers/[customerId]/page.tsx
index 8960c86e..d01fda3d 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/customers/[customerId]/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/customers/[customerId]/page.tsx
@@ -1,16 +1,17 @@
-import * as React from "react";
+import { and, asc, desc, eq, gte, inArray, lte, sql } from "drizzle-orm";
 import { type Metadata } from "next";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { orders, stores, type Order } from "~/db/schema";
-import { env } from "~/env.js";
+import * as React from "react";
+
 import type { SearchParams } from "~/types";
-import { and, asc, desc, eq, gte, inArray, lte, sql } from "drizzle-orm";
 
-import { customerSearchParamsSchema } from "~/lib/validations/params";
 import { DataTableSkeleton } from "~/components/data-table/data-table-skeleton";
 import { DateRangePicker } from "~/components/date-range-picker";
 import { OrdersTable } from "~/components/tables/orders-table";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { orders, stores, type Order } from "~/server/db/schema";
+import { customerSearchParamsSchema } from "~/server/validations/params";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -18,13 +19,13 @@ export const metadata: Metadata = {
   description: "View the customer's order details",
 };
 
-interface CustomerPageProps {
+type CustomerPageProps = {
   params: {
     storeId: string;
     customerId: string;
   };
   searchParams: SearchParams;
-}
+};
 
 export default async function CustomerPage({
   params,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/customers/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/customers/page.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/customers/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/customers/page.tsx
index f618cc33..293cea09 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/customers/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/customers/page.tsx
@@ -1,17 +1,19 @@
-import * as React from "react";
 import type { Metadata } from "next";
+
+import { and, asc, desc, eq, gte, like, lte, sql } from "drizzle-orm";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { orders, stores } from "~/db/schema";
-import { env } from "~/env.js";
+import * as React from "react";
+
 import type { SearchParams } from "~/types";
-import { and, asc, desc, eq, gte, like, lte, sql } from "drizzle-orm";
 
-import { customersSearchParamsSchema } from "~/lib/validations/params";
+import { AlertCard } from "~/components/alert-card";
 import { DataTableSkeleton } from "~/components/data-table/data-table-skeleton";
 import { DateRangePicker } from "~/components/date-range-picker";
 import { CustomersTable } from "~/components/tables/customers-table";
-import { AlertCard } from "~/components/alert-card";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { orders, stores } from "~/server/db/schema";
+import { customersSearchParamsSchema } from "~/server/validations/params";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -19,12 +21,12 @@ export const metadata: Metadata = {
   description: "Customers for your store",
 };
 
-interface CustomersPageProps {
+type CustomersPageProps = {
   params: Promise<{
     storeId: string;
   }>;
   searchParams: Promise<SearchParams>;
-}
+};
 
 export default async function CustomersPage({
   params,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/error.tsx b/src/app/[locale]/dashboard/stores/[storeId]/error.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/error.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/error.tsx
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/layout.tsx b/src/app/[locale]/dashboard/stores/[storeId]/layout.tsx
similarity index 88%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/layout.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/layout.tsx
index 3af2e38e..e8ef6db0 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/layout.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/layout.tsx
@@ -1,14 +1,14 @@
-import * as React from "react";
 import { redirect } from "next/navigation";
+import * as React from "react";
 
-import { getCachedUser } from "~/lib/queries/user";
+import { getCachedUser } from "~/server/queries/user";
 
-interface DashboardStoreLayoutProps {
+type DashboardStoreLayoutProps = {
   params: Promise<{
     storeId: string;
   }>;
   children: React.ReactNode;
-}
+};
 
 export default async function DashboardStoreLayout({
   children,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/loading.tsx b/src/app/[locale]/dashboard/stores/[storeId]/loading.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/loading.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/loading.tsx
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/not-found.tsx b/src/app/[locale]/dashboard/stores/[storeId]/not-found.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/not-found.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/not-found.tsx
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/orders/[orderId]/loading.tsx b/src/app/[locale]/dashboard/stores/[storeId]/orders/[orderId]/loading.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/orders/[orderId]/loading.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/orders/[orderId]/loading.tsx
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/orders/[orderId]/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/orders/[orderId]/page.tsx
similarity index 88%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/orders/[orderId]/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/orders/[orderId]/page.tsx
index c3798298..705eb8a6 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/orders/[orderId]/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/orders/[orderId]/page.tsx
@@ -1,13 +1,8 @@
+import { and, eq } from "drizzle-orm";
 import { type Metadata } from "next";
 import Link from "next/link";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { orders, products } from "~/db/schema";
-import { env } from "~/env.js";
-import { and, eq } from "drizzle-orm";
 
-import { getOrderLineItems } from "~/lib/actions/order";
-import { formatId, formatPrice } from "~/lib/utils";
 import {
   Card,
   CardContent,
@@ -15,6 +10,11 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
+import { env } from "~/env.js";
+import { getOrderLineItems } from "~/server/actions/order";
+import { db } from "~/server/db";
+import { orders, products } from "~/server/db/schema";
+import { formatId, formatPrice } from "~/server/utils";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -22,12 +22,12 @@ export const metadata: Metadata = {
   description: "View your order details",
 };
 
-interface OrderPageProps {
+type OrderPageProps = {
   params: {
     storeId: string;
     orderId: string;
   };
-}
+};
 
 export default async function OrderPage({ params }: OrderPageProps) {
   const storeId = decodeURIComponent(params.storeId);
@@ -49,9 +49,7 @@ export default async function OrderPage({ params }: OrderPageProps) {
   return (
     <Card>
       <CardHeader className="space-y-1">
-        <CardTitle as="h2" className="text-2xl">
-          Order {formatId(order.id)}
-        </CardTitle>
+        <CardTitle className="text-2xl">Order {formatId(order.id)}</CardTitle>
         <CardDescription>View your order details</CardDescription>
       </CardHeader>
       <CardContent className="flex w-full flex-col space-y-2.5">
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/orders/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/orders/page.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/orders/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/orders/page.tsx
index 37aac974..86b72cc4 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/orders/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/orders/page.tsx
@@ -1,18 +1,20 @@
-import * as React from "react";
 import type { Metadata } from "next";
+
+import { and, asc, desc, eq, gte, inArray, like, lte, sql } from "drizzle-orm";
 import { unstable_noStore as noStore } from "next/cache";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { orders, stores, type Order } from "~/db/schema";
-import { env } from "~/env.js";
+import * as React from "react";
+
 import type { SearchParams } from "~/types";
-import { and, asc, desc, eq, gte, inArray, like, lte, sql } from "drizzle-orm";
 
-import { ordersSearchParamsSchema } from "~/lib/validations/params";
+import { AlertCard } from "~/components/alert-card";
 import { DataTableSkeleton } from "~/components/data-table/data-table-skeleton";
 import { DateRangePicker } from "~/components/date-range-picker";
 import { OrdersTable } from "~/components/tables/orders-table";
-import { AlertCard } from "~/components/alert-card";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { orders, stores, type Order } from "~/server/db/schema";
+import { ordersSearchParamsSchema } from "~/server/validations/params";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -20,12 +22,12 @@ export const metadata: Metadata = {
   description: "Manage your orders",
 };
 
-interface OrdersPageProps {
+type OrdersPageProps = {
   params: Promise<{
     storeId: string;
   }>;
   searchParams: Promise<SearchParams>;
-}
+};
 
 export default async function OrdersPage({
   params,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/page.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/page.tsx
index 6c33a3a8..85622ed7 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/page.tsx
@@ -1,14 +1,11 @@
+import { eq } from "drizzle-orm";
 import { type Metadata } from "next";
 import Link from "next/link";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { stores } from "~/db/schema";
-import { env } from "~/env.js";
-import { eq } from "drizzle-orm";
 
-import { updateStore } from "~/lib/actions/store";
-import { getStripeAccount } from "~/lib/actions/stripe";
-import { cn, formatDate } from "~/lib/utils";
+import { AlertCard } from "~/components/alert-card";
+import { ConnectStoreToStripeButton } from "~/components/connect-store-to-stripe-button";
+import { LoadingButton } from "~/components/loading-button";
 import { buttonVariants } from "~/components/ui/button";
 import {
   Card,
@@ -21,15 +18,18 @@ import {
 import { Input } from "~/components/ui/input";
 import { Label } from "~/components/ui/label";
 import { Textarea } from "~/components/ui/textarea";
-import { ConnectStoreToStripeButton } from "~/components/connect-store-to-stripe-button";
-import { LoadingButton } from "~/components/loading-button";
-import { AlertCard } from "~/components/alert-card";
+import { env } from "~/env.js";
+import { updateStore } from "~/server/actions/store";
+import { getStripeAccount } from "~/server/actions/stripe";
+import { db } from "~/server/db";
+import { stores } from "~/server/db/schema";
+import { cn, formatDate } from "~/server/utils";
 
-interface DashboardStorePageProps {
+type DashboardStorePageProps = {
   params: Promise<{
     storeId: string;
   }>;
-}
+};
 
 async function getStoreFromParams(
   params: Awaited<DashboardStorePageProps["params"]>,
@@ -45,7 +45,9 @@ async function getStoreFromParams(
     where: eq(stores.id, storeId),
   });
 
-  if (!store) return null;
+  if (!store) {
+    return null;
+  }
 
   return store;
 }
@@ -168,7 +170,7 @@ export default async function DashboardStorePage({
           </CardContent>
         </Card>
       )}
-      <Card as="section">
+      <Card>
         <CardHeader className="space-y-1">
           <CardTitle className="text-2xl">Update your store</CardTitle>
           <CardDescription>
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/_components/update-product-form.tsx b/src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/_components/update-product-form.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/_components/update-product-form.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/_components/update-product-form.tsx
index 9a89d177..95eb6218 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/_components/update-product-form.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/_components/update-product-form.tsx
@@ -1,23 +1,14 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
-import { type Product } from "~/db/schema";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 
-import { deleteProduct, updateProduct } from "~/lib/actions/product";
-import { getErrorMessage } from "~/lib/handle-error";
-import {
-  type getCategories,
-  type getSubcategories,
-} from "~/lib/queries/product";
-import {
-  updateProductSchema,
-  type UpdateProductSchema,
-} from "~/lib/validations/product";
-import { useUploadFile } from "~/hooks/use-upload-file";
+import { FileUploader } from "~/components/file-uploader";
+import { Files } from "~/components/files";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Dialog,
@@ -46,17 +37,26 @@ import {
   SelectValue,
 } from "~/components/ui/select";
 import { Textarea } from "~/components/ui/textarea";
-import { FileUploader } from "~/components/file-uploader";
-import { Files } from "~/components/files";
-import { Icons } from "~/components/icons";
+import { useUploadFile } from "~/hooks/use-upload-file";
+import { deleteProduct, updateProduct } from "~/server/actions/product";
+import { type Product } from "~/server/db/schema";
+import { getErrorMessage } from "~/server/handle-error";
+import {
+  type getCategories,
+  type getSubcategories,
+} from "~/server/queries/product";
+import {
+  updateProductSchema,
+  type UpdateProductSchema,
+} from "~/server/validations/product";
 
-interface UpdateProductFormProps {
+type UpdateProductFormProps = {
   product: Product;
   promises: Promise<{
     categories: Awaited<ReturnType<typeof getCategories>>;
     subcategories: Awaited<ReturnType<typeof getSubcategories>>;
   }>;
-}
+};
 
 export function UpdateProductForm({
   product,
@@ -71,6 +71,11 @@ export function UpdateProductForm({
     "productImage",
     {
       defaultUploadedFiles: product.images ?? [],
+      headers: {
+        "Content-Type": "application/json",
+      },
+      onUploadBegin: () => {},
+      onUploadProgress: ({ progress }) => {},
     },
   );
 
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/loading.tsx b/src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/loading.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/loading.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/loading.tsx
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/not-found.tsx b/src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/not-found.tsx
similarity index 94%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/not-found.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/not-found.tsx
index 76747a10..9208ca03 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/not-found.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/not-found.tsx
@@ -1,11 +1,11 @@
 import { ErrorCard } from "~/components/error-card";
 import { Shell } from "~/components/shell";
 
-interface ProductNotFoundProps {
+type ProductNotFoundProps = {
   params: {
     storeId: string;
   };
-}
+};
 
 export default function ProductNotFound({ params }: ProductNotFoundProps) {
   const storeId = Number(params.storeId);
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/page.tsx
similarity index 84%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/page.tsx
index 41000ae7..a51f4dea 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/[productId]/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/products/[productId]/page.tsx
@@ -1,11 +1,7 @@
+import { and, eq } from "drizzle-orm";
 import { type Metadata } from "next";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { products } from "~/db/schema";
-import { env } from "~/env.js";
-import { and, eq } from "drizzle-orm";
 
-import { getCategories, getSubcategories } from "~/lib/queries/product";
 import {
   Card,
   CardContent,
@@ -13,6 +9,10 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { products } from "~/server/db/schema";
+import { getCategories, getSubcategories } from "~/server/queries/product";
 
 import { UpdateProductForm } from "./_components/update-product-form";
 
@@ -22,12 +22,12 @@ export const metadata: Metadata = {
   description: "Manage your product",
 };
 
-interface UpdateProductPageProps {
+type UpdateProductPageProps = {
   params: {
     storeId: string;
     productId: string;
   };
-}
+};
 
 export default async function UpdateProductPage({
   params,
@@ -50,9 +50,7 @@ export default async function UpdateProductPage({
   return (
     <Card>
       <CardHeader className="space-y-1">
-        <CardTitle as="h2" className="text-2xl">
-          Update product
-        </CardTitle>
+        <CardTitle className="text-2xl">Update product</CardTitle>
         <CardDescription>
           Update your product information, or delete it
         </CardDescription>
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/new/_components/create-product-form.tsx b/src/app/[locale]/dashboard/stores/[storeId]/products/new/_components/create-product-form.tsx
similarity index 97%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/new/_components/create-product-form.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/products/new/_components/create-product-form.tsx
index d262dab2..9de13c5e 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/new/_components/create-product-form.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/products/new/_components/create-product-form.tsx
@@ -1,22 +1,15 @@
 "use client";
 
-import * as React from "react";
-import type { StoredFile } from "~/types";
 import { zodResolver } from "@hookform/resolvers/zod";
+import * as React from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 
-import { addProduct } from "~/lib/actions/product";
-import { getErrorMessage } from "~/lib/handle-error";
-import {
-  type getCategories,
-  type getSubcategories,
-} from "~/lib/queries/product";
-import {
-  createProductSchema,
-  type CreateProductSchema,
-} from "~/lib/validations/product";
-import { useUploadFile } from "~/hooks/use-upload-file";
+import type { StoredFile } from "~/types";
+
+import { FileUploader } from "~/components/file-uploader";
+import { Files } from "~/components/files";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Dialog,
@@ -44,17 +37,25 @@ import {
   SelectValue,
 } from "~/components/ui/select";
 import { Textarea } from "~/components/ui/textarea";
-import { FileUploader } from "~/components/file-uploader";
-import { Files } from "~/components/files";
-import { Icons } from "~/components/icons";
+import { useUploadFile } from "~/hooks/use-upload-file";
+import { addProduct } from "~/server/actions/product";
+import { getErrorMessage } from "~/server/handle-error";
+import {
+  type getCategories,
+  type getSubcategories,
+} from "~/server/queries/product";
+import {
+  createProductSchema,
+  type CreateProductSchema,
+} from "~/server/validations/product";
 
-interface CreateProductFormProps {
+type CreateProductFormProps = {
   storeId: string;
   promises: Promise<{
     categories: Awaited<ReturnType<typeof getCategories>>;
     subcategories: Awaited<ReturnType<typeof getSubcategories>>;
   }>;
-}
+};
 
 export function CreateProductForm({
   storeId,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/new/loading.tsx b/src/app/[locale]/dashboard/stores/[storeId]/products/new/loading.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/new/loading.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/products/new/loading.tsx
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/new/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/products/new/page.tsx
similarity index 88%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/new/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/products/new/page.tsx
index 46954f76..48d662e3 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/new/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/products/new/page.tsx
@@ -1,9 +1,7 @@
 import type { Metadata } from "next";
+
 import { redirect } from "next/navigation";
-import { env } from "~/env.js";
 
-import { getCategories, getSubcategories } from "~/lib/queries/product";
-import { getCachedUser } from "~/lib/queries/user";
 import {
   Card,
   CardContent,
@@ -11,6 +9,9 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
+import { env } from "~/env.js";
+import { getCategories, getSubcategories } from "~/server/queries/product";
+import { getCachedUser } from "~/server/queries/user";
 
 import { CreateProductForm } from "./_components/create-product-form";
 
@@ -20,11 +21,11 @@ export const metadata: Metadata = {
   description: "Add a new product",
 };
 
-interface NewProductPageProps {
+type NewProductPageProps = {
   params: {
     storeId: string;
   };
-}
+};
 
 export default async function NewProductPage({ params }: NewProductPageProps) {
   const storeId = decodeURIComponent(params.storeId);
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/products/page.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/products/page.tsx
index 583ac524..7d687a6c 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/products/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/products/page.tsx
@@ -1,18 +1,19 @@
-import * as React from "react";
+import { and, asc, desc, eq, gte, inArray, like, lte, sql } from "drizzle-orm";
 import { type Metadata } from "next";
 import { unstable_noStore as noStore } from "next/cache";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { categories, products, stores, type Product } from "~/db/schema";
-import { env } from "~/env.js";
+import * as React from "react";
+
 import type { SearchParams } from "~/types";
-import { and, asc, desc, eq, gte, inArray, like, lte, sql } from "drizzle-orm";
 
-import { storesProductsSearchParamsSchema } from "~/lib/validations/params";
+import { AlertCard } from "~/components/alert-card";
 import { DataTableSkeleton } from "~/components/data-table/data-table-skeleton";
 import { DateRangePicker } from "~/components/date-range-picker";
 import { ProductsTable } from "~/components/tables/products-table";
-import { AlertCard } from "~/components/alert-card";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { categories, products, stores, type Product } from "~/server/db/schema";
+import { storesProductsSearchParamsSchema } from "~/server/validations/params";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -20,12 +21,12 @@ export const metadata: Metadata = {
   description: "Manage your products",
 };
 
-interface ProductsPageProps {
+type ProductsPageProps = {
   params: Promise<{
     storeId: string;
   }>;
   searchParams: Promise<SearchParams>;
-}
+};
 
 export default async function ProductsPage({
   params,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/settings/_components/update-notification-form-skeleton.tsx b/src/app/[locale]/dashboard/stores/[storeId]/settings/_components/update-notification-form-skeleton.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/settings/_components/update-notification-form-skeleton.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/settings/_components/update-notification-form-skeleton.tsx
diff --git a/src/app/[locale]/(dashboard)/dashboard/settings/_components/update-notification-form.tsx b/src/app/[locale]/dashboard/stores/[storeId]/settings/_components/update-notification-form.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/dashboard/settings/_components/update-notification-form.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/settings/_components/update-notification-form.tsx
index b7df57a7..9e10d08a 100644
--- a/src/app/[locale]/(dashboard)/dashboard/settings/_components/update-notification-form.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/settings/_components/update-notification-form.tsx
@@ -1,16 +1,11 @@
 "use client";
 
-import * as React from "react";
 import { zodResolver } from "@hookform/resolvers/zod";
+import * as React from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 
-import { updateNotification } from "~/lib/actions/notification";
-import { type getNotification } from "~/lib/queries/notification";
-import {
-  updateNotificationSchema,
-  type UpdateNotificationSchema,
-} from "~/lib/validations/notification";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -22,11 +17,16 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Switch } from "~/components/ui/switch";
-import { Icons } from "~/components/icons";
+import { updateNotification } from "~/server/actions/notification";
+import { type getNotification } from "~/server/queries/notification";
+import {
+  updateNotificationSchema,
+  type UpdateNotificationSchema,
+} from "~/server/validations/notification";
 
-interface UpdateNotificationFormProps {
+type UpdateNotificationFormProps = {
   notificationPromise: ReturnType<typeof getNotification>;
-}
+};
 
 export function UpdateNotificationForm({
   notificationPromise,
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/settings/page.tsx b/src/app/[locale]/dashboard/stores/[storeId]/settings/page.tsx
similarity index 90%
rename from src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/settings/page.tsx
rename to src/app/[locale]/dashboard/stores/[storeId]/settings/page.tsx
index e7eaa47d..fd049be0 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/[storeId]/settings/page.tsx
+++ b/src/app/[locale]/dashboard/stores/[storeId]/settings/page.tsx
@@ -1,12 +1,16 @@
-import * as React from "react";
 import type { Metadata } from "next";
-import { env } from "~/env.js";
-import type { SearchParams } from "~/types";
+
+import * as React from "react";
 import { z } from "zod";
 
-import { getNotification } from "~/lib/queries/notification";
-import { getCachedUser } from "~/lib/queries/user";
-import { getUserEmail } from "~/lib/utils";
+import type { SearchParams } from "~/types";
+
+import {
+  PageHeader,
+  PageHeaderDescription,
+  PageHeaderHeading,
+} from "~/components/page-header";
+import { Shell } from "~/components/shell";
 import {
   Card,
   CardContent,
@@ -14,12 +18,10 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import {
-  PageHeader,
-  PageHeaderDescription,
-  PageHeaderHeading,
-} from "~/components/page-header";
-import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getNotification } from "~/server/queries/notification";
+import { getCachedUser } from "~/server/queries/user";
+import { getUserEmail } from "~/server/utils";
 
 import { UpdateNotificationForm } from "./_components/update-notification-form";
 import { UpdateNotificationFormSkeleton } from "./_components/update-notification-form-skeleton";
@@ -30,9 +32,9 @@ export const metadata: Metadata = {
   description: "Manage your settings",
 };
 
-interface SettingsPageProps {
+type SettingsPageProps = {
   searchParams: Promise<SearchParams>;
-}
+};
 
 const schema = z.object({
   token: z.string().optional(),
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/loading.tsx b/src/app/[locale]/dashboard/stores/loading.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/dashboard/stores/loading.tsx
rename to src/app/[locale]/dashboard/stores/loading.tsx
index fa68c096..6fecd7b5 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/loading.tsx
+++ b/src/app/[locale]/dashboard/stores/loading.tsx
@@ -1,6 +1,6 @@
-import { Skeleton } from "~/components/ui/skeleton";
 import { ProductCardSkeleton } from "~/components/product-card-skeleton";
 import { Shell } from "~/components/shell";
+import { Skeleton } from "~/components/ui/skeleton";
 
 export default function ProductsLoading() {
   return (
diff --git a/src/app/[locale]/(lobby)/stores/page.tsx b/src/app/[locale]/dashboard/stores/page.tsx
similarity index 91%
rename from src/app/[locale]/(lobby)/stores/page.tsx
rename to src/app/[locale]/dashboard/stores/page.tsx
index db9b7d70..03d3c4f5 100644
--- a/src/app/[locale]/(lobby)/stores/page.tsx
+++ b/src/app/[locale]/dashboard/stores/page.tsx
@@ -1,8 +1,7 @@
 import { type Metadata } from "next";
-import { env } from "~/env.js";
+
 import type { SearchParams } from "~/types";
 
-import { getProducts } from "~/lib/queries/product";
 import { AlertCard } from "~/components/alert-card";
 import {
   PageHeader,
@@ -10,6 +9,8 @@ import {
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getProducts } from "~/server/queries/product";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -17,9 +18,9 @@ export const metadata: Metadata = {
   description: "Discover products from our stores",
 };
 
-interface StoresPageProps {
+type StoresPageProps = {
   searchParams: SearchParams;
-}
+};
 
 export default async function StoresPage({ searchParams }: StoresPageProps) {
   const productsTransaction = await getProducts(searchParams);
diff --git a/src/app/[locale]/error.tsx b/src/app/[locale]/error.tsx
deleted file mode 100644
index b20411c6..00000000
--- a/src/app/[locale]/error.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-"use client";
-
-import { useEffect } from "react";
-
-import { useTranslations } from "next-intl";
-
-import { Shell } from "~/components/shell";
-
-interface Props {
-  error: Error;
-  reset(): void;
-}
-
-export default function Error({ error, reset }: Props) {
-  const t = useTranslations("Error");
-
-  useEffect(() => {
-    console.error(error);
-  }, [error]);
-
-  return (
-    <Shell>
-      <div>
-        {t.rich("description", {
-          p: (chunks) => <p className="mt-4">{chunks}</p>,
-          retry: (chunks) => (
-            <button
-              className="underline underline-offset-2"
-              type="button"
-              onClick={reset}
-            >
-              {chunks}
-            </button>
-          ),
-        })}
-      </div>
-    </Shell>
-  );
-}
diff --git a/src/app/[locale]/favicon.ico b/src/app/[locale]/favicon.ico
deleted file mode 100644
index a042b4cd..00000000
Binary files a/src/app/[locale]/favicon.ico and /dev/null differ
diff --git a/src/app/[locale]/layout.tsx b/src/app/[locale]/layout.tsx
index 732c9d71..9a387c0e 100644
--- a/src/app/[locale]/layout.tsx
+++ b/src/app/[locale]/layout.tsx
@@ -1,56 +1,85 @@
+import "~/styles/globals.css";
+
 import type { Metadata, Viewport } from "next";
-import { env } from "~/env.js";
-import { ClerkProvider } from "@clerk/nextjs";
 
+import { ClerkProvider } from "@clerk/nextjs";
 import { GeistMono } from "geist/font/mono";
 import { GeistSans } from "geist/font/sans";
+import { NextIntlClientProvider } from "next-intl";
+import { getMessages } from "next-intl/server";
+import { notFound } from "next/navigation";
+import { NuqsAdapter } from "nuqs/adapters/next/app";
+
+import type { Locale } from "~/i18n/locales";
 
-import { siteConfig } from "~/config/site";
-import { fontHeading } from "~/lib/fonts";
-import { absoluteUrl, cn } from "~/lib/utils";
-import { Toaster } from "~/components/ui/toaster";
-import { Analytics as VercelAnalytics } from "~/components/analytics";
+import { app } from "~/app";
+import AppFooter from "~/components/app-footer";
+import AppHeader from "~/components/app-header";
 import { ThemeProvider } from "~/components/providers";
-import { TailwindIndicator } from "~/components/tailwind-indicator";
+import { TailwindIndicator } from "~/components/tailwind";
+import { Toaster as SonnerToaster } from "~/components/ui/sonner";
+import { Toaster as ShadcnToaster } from "~/components/ui/toaster";
 import { routing } from "~/i18n/routing";
-import { notFound } from "next/navigation";
-import { getMessages } from "next-intl/server";
-import { NextIntlClientProvider } from "next-intl";
+import { getCachedUser } from "~/server/queries/user";
+import { cn } from "~/utils";
+
+const fontSans = GeistSans;
+const fontMono = GeistMono;
 
 export const metadata: Metadata = {
-  metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
   title: {
-    default: siteConfig.name,
-    template: `%s - ${siteConfig.name}`,
+    default: app.name,
+    template: `%s - ${app.name}`,
   },
-  description: siteConfig.description,
-  keywords: ["nextjs", "react", "react server components", "relivator"],
+  metadataBase: new URL(app.url),
+  description: app.description,
+  keywords: [
+    "Reliverse",
+    "Bleverse",
+    "Relivator",
+    "Versator",
+    "Template",
+    "Starter",
+    "Next.js",
+    "React",
+    "Tailwind",
+    "Shadcn",
+  ],
   authors: [
     {
-      name: "reliverse",
+      name: "Bleverse",
+      url: "https://agency.bleverse.com",
+    },
+    {
+      name: "Reliverse",
       url: "https://reliverse.org",
     },
   ],
-  creator: "blefnk",
+  creator: "Bleverse",
   openGraph: {
     type: "website",
-    locale: "en_US",
-    url: siteConfig.url,
-    title: siteConfig.name,
-    description: siteConfig.description,
-    siteName: siteConfig.name,
+    locale: "en",
+    url: app.url,
+    title: app.name,
+    description: app.description,
+    siteName: app.name,
+    images: [
+      {
+        url: app.ogImage,
+        width: 1200,
+        height: 630,
+        alt: app.name,
+      },
+    ],
   },
   twitter: {
     card: "summary_large_image",
-    title: siteConfig.name,
-    description: siteConfig.description,
-    images: [`${siteConfig.url}/og.png`],
-    creator: "@blefnk",
+    title: app.name,
+    description: app.description,
+    images: [app.ogImage],
+    creator: "@reliverse_org",
   },
-  icons: {
-    icon: "/icon.png",
-  },
-  manifest: absoluteUrl("/site.webmanifest"),
+  icons: [{ rel: "icon", url: "/favicon.ico" }],
 };
 
 export const viewport: Viewport = {
@@ -61,36 +90,37 @@ export const viewport: Viewport = {
   ],
 };
 
-interface RootLayoutProps {
+type LocaleLayoutProps = {
   children: React.ReactNode;
   params: Promise<{ locale: string }>;
-}
+};
 
-export default async function RootLayout({
+export default async function LocaleLayout({
   children,
   params,
-}: RootLayoutProps) {
-  // Get the locale from the params
-  const { locale } = await params;
+}: Readonly<LocaleLayoutProps>) {
+  const user = await getCachedUser();
+
+  // Await the params object
+  const resolvedParams = await params;
+  const { locale } = resolvedParams;
 
   // Ensure that the incoming `locale` is valid
-  if (!routing.locales.includes(locale as any)) {
+  if (!routing.locales.includes(locale as Locale)) {
     notFound();
   }
 
-  // Provide all messages to the client
+  // Fetch and provide all messages to the client
   const messages = await getMessages();
 
   return (
     <ClerkProvider>
       <html lang={locale} suppressHydrationWarning>
-        <head />
         <body
           className={cn(
-            "min-h-screen bg-background font-sans antialiased",
-            GeistSans.variable,
-            GeistMono.variable,
-            fontHeading.variable,
+            "bg-background text-foreground font-sans antialiased",
+            fontSans.variable,
+            fontMono.variable,
           )}
         >
           <ThemeProvider
@@ -98,14 +128,23 @@ export default async function RootLayout({
             defaultTheme="system"
             enableSystem
             disableTransitionOnChange
+            enableColorScheme
           >
-            <NextIntlClientProvider messages={messages}>
-              {children}
-            </NextIntlClientProvider>
-            <TailwindIndicator />
-            <VercelAnalytics />
+            <NuqsAdapter>
+              <div className="flex flex-col min-h-screen">
+                <NextIntlClientProvider messages={messages}>
+                  <AppHeader user={user} />
+                  <main className="flex flex-1 flex-col gap-4 px-2 items-center mt-2">
+                    {children}
+                  </main>
+                  <AppFooter />
+                  <TailwindIndicator />
+                  <ShadcnToaster />
+                  <SonnerToaster />
+                </NextIntlClientProvider>
+              </div>
+            </NuqsAdapter>
           </ThemeProvider>
-          <Toaster />
         </body>
       </html>
     </ClerkProvider>
diff --git a/src/app/[locale]/not-found.tsx b/src/app/[locale]/not-found.tsx
index 245fc86a..a81f41d5 100644
--- a/src/app/[locale]/not-found.tsx
+++ b/src/app/[locale]/not-found.tsx
@@ -1,43 +1,26 @@
-import Balancer from "react-wrap-balancer";
-
-import Link from "next/link";
-
-import { ChevronLeft } from "lucide-react";
 import { useTranslations } from "next-intl";
 
 import { buttonVariants } from "~/components/ui/button";
-import { Shell } from "~/components/shell";
-import { cn } from "~/lib/utils";
-
-// @see src/app/[locale]/[...rest]/page.tsx
-export default function NotFoundPage() {
-  const t = useTranslations("pages.not-found");
+import { Link } from "~/i18n/routing";
+import { cn } from "~/utils";
 
+export default function NotFound() {
+  const t = useTranslations("not-found");
   return (
-    <Shell>
-      <Balancer
-        className={`
-          mx-auto mt-4 !block leading-normal text-muted-foreground
-
-          sm:text-lg sm:leading-7
-        `}
-        as="p"
-      >
-        {t("description")}
-      </Balancer>
+    <main className="flex flex-1 flex-col gap-4 px-2 items-center mt-24 max-w-xl mx-auto text-xl">
+      <h1 className="text-2xl font-bold">{t("title")}</h1>
+      <p>{t("description")}</p>
       <Link
+        href="/"
         className={cn(
           buttonVariants({
-            size: "default",
-            variant: "secondary",
+            variant: "default",
+            className: "mx-auto mt-4 w-fit",
           }),
-          "mx-auto mt-6 flex items-center gap-1",
         )}
-        href="/"
       >
-        <ChevronLeft size={16} />
-        <span>{t("go-home")}</span>
+        {t("go-home")}
       </Link>
-    </Shell>
+    </main>
   );
 }
diff --git a/src/app/[locale]/(dashboard)/onboarding/_components/connect-stripe.tsx b/src/app/[locale]/onboarding/_components/connect-stripe.tsx
similarity index 98%
rename from src/app/[locale]/(dashboard)/onboarding/_components/connect-stripe.tsx
rename to src/app/[locale]/onboarding/_components/connect-stripe.tsx
index b8eeb807..3f97df5f 100644
--- a/src/app/[locale]/(dashboard)/onboarding/_components/connect-stripe.tsx
+++ b/src/app/[locale]/onboarding/_components/connect-stripe.tsx
@@ -1,17 +1,17 @@
 "use client";
 
-import React from "react";
-import { useRouter } from "next/navigation";
 import { motion } from "framer-motion";
+import { useRouter } from "next/navigation";
+import React from "react";
 
-import { Button } from "~/components/ui/button";
 import { ConnectStoreToStripeButton } from "~/components/connect-store-to-stripe-button";
+import { Button } from "~/components/ui/button";
 
 import { StepHeader } from "./step-header";
 
-interface ConnectStripeProps {
+type ConnectStripeProps = {
   storeId: string | null;
-}
+};
 
 export function ConnectStripe({ storeId }: ConnectStripeProps) {
   const router = useRouter();
diff --git a/src/app/[locale]/(dashboard)/onboarding/_components/create-store.tsx b/src/app/[locale]/onboarding/_components/create-store.tsx
similarity index 95%
rename from src/app/[locale]/(dashboard)/onboarding/_components/create-store.tsx
rename to src/app/[locale]/onboarding/_components/create-store.tsx
index c0b78b6c..4f92bffb 100644
--- a/src/app/[locale]/(dashboard)/onboarding/_components/create-store.tsx
+++ b/src/app/[locale]/onboarding/_components/create-store.tsx
@@ -1,26 +1,26 @@
 "use client";
 
-import * as React from "react";
-import { useRouter, useSearchParams } from "next/navigation";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { motion } from "framer-motion";
+import { useRouter, useSearchParams } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 
-import { createStore } from "~/lib/actions/store";
+import { Icons } from "~/components/icons";
+import { Button } from "~/components/ui/button";
+import { createStore } from "~/server/actions/store";
 import {
   createStoreSchema,
   type CreateStoreSchema,
-} from "~/lib/validations/store";
-import { Button } from "~/components/ui/button";
-import { Icons } from "~/components/icons";
+} from "~/server/validations/store";
 
 import { CreateStoreForm } from "../../dashboard/stores/[storeId]/_components/create-store-form";
 import { StepHeader } from "./step-header";
 
-interface CreateStoreProps {
+type CreateStoreProps = {
   userId: string;
-}
+};
 
 export function CreateStore({ userId }: CreateStoreProps) {
   const router = useRouter();
diff --git a/src/app/[locale]/(dashboard)/onboarding/_components/intro.tsx b/src/app/[locale]/onboarding/_components/intro.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/onboarding/_components/intro.tsx
rename to src/app/[locale]/onboarding/_components/intro.tsx
index 5054d4be..999a6fe6 100644
--- a/src/app/[locale]/(dashboard)/onboarding/_components/intro.tsx
+++ b/src/app/[locale]/onboarding/_components/intro.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import { useRouter } from "next/navigation";
 import { motion } from "framer-motion";
+import { useRouter } from "next/navigation";
 
-import { useDebounce } from "~/hooks/use-debounce";
 import { Button } from "~/components/ui/button";
+import { useDebounce } from "~/hooks/use-debounce";
 
 export function Intro() {
   const router = useRouter();
diff --git a/src/app/[locale]/(dashboard)/onboarding/_components/onboarding.tsx b/src/app/[locale]/onboarding/_components/onboarding.tsx
similarity index 96%
rename from src/app/[locale]/(dashboard)/onboarding/_components/onboarding.tsx
rename to src/app/[locale]/onboarding/_components/onboarding.tsx
index 9d2da091..be548d3b 100644
--- a/src/app/[locale]/(dashboard)/onboarding/_components/onboarding.tsx
+++ b/src/app/[locale]/onboarding/_components/onboarding.tsx
@@ -2,16 +2,16 @@
 
 "use client";
 
-import { useSearchParams } from "next/navigation";
 import { AnimatePresence } from "framer-motion";
+import { useSearchParams } from "next/navigation";
 
 import { ConnectStripe } from "./connect-stripe";
 import { CreateStore } from "./create-store";
 import { Intro } from "./intro";
 
-interface OnboardingProps {
+type OnboardingProps = {
   userId: string;
-}
+};
 
 export function Onboarding({ userId }: OnboardingProps) {
   const search = useSearchParams();
diff --git a/src/app/[locale]/(dashboard)/onboarding/_components/step-header.tsx b/src/app/[locale]/onboarding/_components/step-header.tsx
similarity index 96%
rename from src/app/[locale]/(dashboard)/onboarding/_components/step-header.tsx
rename to src/app/[locale]/onboarding/_components/step-header.tsx
index c7eec9b6..b0cb270c 100644
--- a/src/app/[locale]/(dashboard)/onboarding/_components/step-header.tsx
+++ b/src/app/[locale]/onboarding/_components/step-header.tsx
@@ -1,9 +1,9 @@
 import { motion } from "framer-motion";
 
-interface StepHeaderProps {
+type StepHeaderProps = {
   title: string;
   description?: string;
-}
+};
 
 export function StepHeader({ title, description }: StepHeaderProps) {
   return (
diff --git a/src/app/[locale]/(dashboard)/onboarding/page.tsx b/src/app/[locale]/onboarding/page.tsx
similarity index 100%
rename from src/app/[locale]/(dashboard)/onboarding/page.tsx
rename to src/app/[locale]/onboarding/page.tsx
index 452c3dad..0b4e0e7a 100644
--- a/src/app/[locale]/(dashboard)/onboarding/page.tsx
+++ b/src/app/[locale]/onboarding/page.tsx
@@ -1,11 +1,11 @@
-import * as React from "react";
+import { auth } from "@clerk/nextjs/server";
 import { type Metadata } from "next";
 import { redirect } from "next/navigation";
-import { auth } from "@clerk/nextjs/server";
+import * as React from "react";
 
-import { Skeleton } from "~/components/ui/skeleton";
 import { GridPattern } from "~/components/grid-pattern";
 import { Shell } from "~/components/shell";
+import { Skeleton } from "~/components/ui/skeleton";
 
 import { Onboarding } from "./_components/onboarding";
 
diff --git a/src/app/[locale]/(lobby)/page.tsx b/src/app/[locale]/page.tsx
similarity index 66%
rename from src/app/[locale]/(lobby)/page.tsx
rename to src/app/[locale]/page.tsx
index 86d4526c..d0e7b7a1 100644
--- a/src/app/[locale]/(lobby)/page.tsx
+++ b/src/app/[locale]/page.tsx
@@ -1,13 +1,12 @@
-import * as React from "react";
+import { Suspense } from "react";
 
-import { getGithubStars } from "~/lib/queries/github";
-import { getCategories, getFeaturedProducts } from "~/lib/queries/product";
-import { getFeaturedStores } from "~/lib/queries/store";
+import { Lobby } from "~/components/lobby";
+import { LobbySkeleton } from "~/components/lobby-skeleton";
+import { getGithubStars } from "~/server/queries/github";
+import { getCategories, getFeaturedProducts } from "~/server/queries/product";
+import { getFeaturedStores } from "~/server/queries/store";
 
-import { Lobby } from "./_components/lobby";
-import { LobbySkeleton } from "./_components/lobby-skeleton";
-
-export default async function IndexPage() {
+export default function HomePage() {
   /**
    * To avoid sequential waterfall requests, multiple promises are passed to fetch data parallelly.
    * These promises are also passed to the `Lobby` component, making them hot promises.
@@ -21,13 +20,13 @@ export default async function IndexPage() {
   const storesPromise = getFeaturedStores();
 
   return (
-    <React.Suspense fallback={<LobbySkeleton />}>
+    <Suspense fallback={<LobbySkeleton />}>
       <Lobby
         githubStarsPromise={githubStarsPromise}
         productsPromise={productsPromise}
         categoriesPromise={categoriesPromise}
         storesPromise={storesPromise}
       />
-    </React.Suspense>
+    </Suspense>
   );
 }
diff --git a/src/app/[locale]/(lobby)/preview/product/[productId]/page.tsx b/src/app/[locale]/preview/product/[productId]/page.tsx
similarity index 87%
rename from src/app/[locale]/(lobby)/preview/product/[productId]/page.tsx
rename to src/app/[locale]/preview/product/[productId]/page.tsx
index c811d8d4..216d7d08 100644
--- a/src/app/[locale]/(lobby)/preview/product/[productId]/page.tsx
+++ b/src/app/[locale]/preview/product/[productId]/page.tsx
@@ -1,10 +1,10 @@
 import { redirect } from "next/navigation";
 
-interface ProductPreviewPageProps {
+type ProductPreviewPageProps = {
   params: {
     productId: string;
   };
-}
+};
 
 export default function ProductPreviewPage({
   params,
diff --git a/src/app/[locale]/(lobby)/product/[productId]/_components/add-to-cart-form.tsx b/src/app/[locale]/product/[productId]/_components/add-to-cart-form.tsx
similarity index 93%
rename from src/app/[locale]/(lobby)/product/[productId]/_components/add-to-cart-form.tsx
rename to src/app/[locale]/product/[productId]/_components/add-to-cart-form.tsx
index f4c44e32..c3602552 100644
--- a/src/app/[locale]/(lobby)/product/[productId]/_components/add-to-cart-form.tsx
+++ b/src/app/[locale]/product/[productId]/_components/add-to-cart-form.tsx
@@ -1,17 +1,15 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
+import type { z } from "zod";
+
 import { zodResolver } from "@hookform/resolvers/zod";
 import { MinusIcon, PlusIcon } from "@radix-ui/react-icons";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
-import type { z } from "zod";
 
-import { addToCart } from "~/lib/actions/cart";
-import { showErrorToast } from "~/lib/handle-error";
-import { cn } from "~/lib/utils";
-import { updateCartItemSchema } from "~/lib/validations/cart";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -22,12 +20,15 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Input } from "~/components/ui/input";
-import { Icons } from "~/components/icons";
+import { addToCart } from "~/server/actions/cart";
+import { showErrorToast } from "~/server/handle-error";
+import { cn } from "~/server/utils";
+import { updateCartItemSchema } from "~/server/validations/cart";
 
-interface AddToCartFormProps {
+type AddToCartFormProps = {
   productId: string;
   showBuyNow?: boolean;
-}
+};
 
 type Inputs = z.infer<typeof updateCartItemSchema>;
 
@@ -105,7 +106,9 @@ export function AddToCartForm({ productId, showBuyNow }: AddToCartFormProps) {
                     onChange={(e) => {
                       const value = e.target.value;
                       const parsedValue = parseInt(value, 10);
-                      if (isNaN(parsedValue)) return;
+                      if (isNaN(parsedValue)) {
+                        return;
+                      }
                       field.onChange(parsedValue);
                     }}
                   />
diff --git a/src/app/[locale]/(lobby)/product/[productId]/_components/update-product-rating-button.tsx b/src/app/[locale]/product/[productId]/_components/update-product-rating-button.tsx
similarity index 85%
rename from src/app/[locale]/(lobby)/product/[productId]/_components/update-product-rating-button.tsx
rename to src/app/[locale]/product/[productId]/_components/update-product-rating-button.tsx
index b09f37ed..704bf8f9 100644
--- a/src/app/[locale]/(lobby)/product/[productId]/_components/update-product-rating-button.tsx
+++ b/src/app/[locale]/product/[productId]/_components/update-product-rating-button.tsx
@@ -1,19 +1,19 @@
 "use client";
 
-import * as React from "react";
 import { HeartIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 import { toast } from "sonner";
 
-import { updateProductRating } from "~/lib/actions/product";
-import { showErrorToast } from "~/lib/handle-error";
-import { cn } from "~/lib/utils";
-import { Button, type ButtonProps } from "~/components/ui/button";
 import { Icons } from "~/components/icons";
+import { Button, type ButtonProps } from "~/components/ui/button";
+import { updateProductRating } from "~/server/actions/product";
+import { showErrorToast } from "~/server/handle-error";
+import { cn } from "~/server/utils";
 
-interface UpdateProductRatingButtonProps extends ButtonProps {
+type UpdateProductRatingButtonProps = {
   productId: string;
   rating: number;
-}
+} & ButtonProps;
 
 export function UpdateProductRatingButton({
   productId,
diff --git a/src/app/[locale]/(lobby)/product/[productId]/loading.tsx b/src/app/[locale]/product/[productId]/loading.tsx
similarity index 98%
rename from src/app/[locale]/(lobby)/product/[productId]/loading.tsx
rename to src/app/[locale]/product/[productId]/loading.tsx
index af99fc49..c471335a 100644
--- a/src/app/[locale]/(lobby)/product/[productId]/loading.tsx
+++ b/src/app/[locale]/product/[productId]/loading.tsx
@@ -1,10 +1,10 @@
-import { cn } from "~/lib/utils";
-import { ScrollArea } from "~/components/ui/scroll-area";
-import { Separator } from "~/components/ui/separator";
-import { Skeleton } from "~/components/ui/skeleton";
 import { Icons } from "~/components/icons";
 import { ProductCardSkeleton } from "~/components/product-card-skeleton";
 import { Shell } from "~/components/shell";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import { Separator } from "~/components/ui/separator";
+import { Skeleton } from "~/components/ui/skeleton";
+import { cn } from "~/server/utils";
 
 export default function ProductLoading() {
   return (
diff --git a/src/app/[locale]/(lobby)/product/[productId]/not-found.tsx b/src/app/[locale]/product/[productId]/not-found.tsx
similarity index 100%
rename from src/app/[locale]/(lobby)/product/[productId]/not-found.tsx
rename to src/app/[locale]/product/[productId]/not-found.tsx
diff --git a/src/app/[locale]/(lobby)/product/[productId]/page.tsx b/src/app/[locale]/product/[productId]/page.tsx
similarity index 96%
rename from src/app/[locale]/(lobby)/product/[productId]/page.tsx
rename to src/app/[locale]/product/[productId]/page.tsx
index 79f5ffc1..2e268817 100644
--- a/src/app/[locale]/(lobby)/product/[productId]/page.tsx
+++ b/src/app/[locale]/product/[productId]/page.tsx
@@ -1,12 +1,13 @@
 import type { Metadata } from "next";
+
+import { and, desc, eq, not } from "drizzle-orm";
 import Link from "next/link";
 import { notFound } from "next/navigation";
-import { db } from "~/db";
-import { categories, products, stores } from "~/db/schema";
-import { env } from "~/env.js";
-import { and, desc, eq, not } from "drizzle-orm";
 
-import { formatPrice, toTitleCase } from "~/lib/utils";
+import { ProductCard } from "~/components/product-card";
+import { ProductImageCarousel } from "~/components/product-image-carousel";
+import { Rating } from "~/components/rating";
+import { Shell } from "~/components/shell";
 import {
   Accordion,
   AccordionContent,
@@ -15,19 +16,19 @@ import {
 } from "~/components/ui/accordion";
 import { ScrollArea } from "~/components/ui/scroll-area";
 import { Separator } from "~/components/ui/separator";
-import { ProductCard } from "~/components/product-card";
-import { ProductImageCarousel } from "~/components/product-image-carousel";
-import { Rating } from "~/components/rating";
-import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { categories, products, stores } from "~/server/db/schema";
+import { formatPrice, toTitleCase } from "~/server/utils";
 
 import { AddToCartForm } from "./_components/add-to-cart-form";
 import { UpdateProductRatingButton } from "./_components/update-product-rating-button";
 
-interface ProductPageProps {
+type ProductPageProps = {
   params: {
     productId: string;
   };
-}
+};
 
 export async function generateMetadata({
   params,
diff --git a/src/app/[locale]/(lobby)/products/loading.tsx b/src/app/[locale]/products/loading.tsx
similarity index 100%
rename from src/app/[locale]/(lobby)/products/loading.tsx
rename to src/app/[locale]/products/loading.tsx
index fa68c096..6fecd7b5 100644
--- a/src/app/[locale]/(lobby)/products/loading.tsx
+++ b/src/app/[locale]/products/loading.tsx
@@ -1,6 +1,6 @@
-import { Skeleton } from "~/components/ui/skeleton";
 import { ProductCardSkeleton } from "~/components/product-card-skeleton";
 import { Shell } from "~/components/shell";
+import { Skeleton } from "~/components/ui/skeleton";
 
 export default function ProductsLoading() {
   return (
diff --git a/src/app/[locale]/(lobby)/products/page.tsx b/src/app/[locale]/products/page.tsx
similarity index 91%
rename from src/app/[locale]/(lobby)/products/page.tsx
rename to src/app/[locale]/products/page.tsx
index 89ec7489..28ec625a 100644
--- a/src/app/[locale]/(lobby)/products/page.tsx
+++ b/src/app/[locale]/products/page.tsx
@@ -1,8 +1,7 @@
 import { type Metadata } from "next";
-import { env } from "~/env.js";
+
 import type { SearchParams } from "~/types";
 
-import { getProducts } from "~/lib/queries/product";
 import { AlertCard } from "~/components/alert-card";
 import {
   PageHeader,
@@ -10,6 +9,8 @@ import {
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getProducts } from "~/server/queries/product";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -17,9 +18,9 @@ export const metadata: Metadata = {
   description: "Buy products from our stores",
 };
 
-interface ProductsPageProps {
+type ProductsPageProps = {
   searchParams: SearchParams;
-}
+};
 
 export default async function ProductsPage({
   searchParams,
diff --git a/src/app/[locale]/(auth)/signin/[[...signin]]/page.tsx b/src/app/[locale]/signin/[[...signin]]/page.tsx
similarity index 86%
rename from src/app/[locale]/(auth)/signin/[[...signin]]/page.tsx
rename to src/app/[locale]/signin/[[...signin]]/page.tsx
index 2c37e83f..767f011f 100644
--- a/src/app/[locale]/(auth)/signin/[[...signin]]/page.tsx
+++ b/src/app/[locale]/signin/[[...signin]]/page.tsx
@@ -1,7 +1,10 @@
 import { type Metadata } from "next";
 import Link from "next/link";
-import { env } from "~/env.js";
+import { redirect } from "next/navigation";
 
+import { OAuthSignIn } from "~/components/oauth-signin";
+import { Shell } from "~/components/shell";
+import { SignInForm } from "~/components/signin-form";
 import {
   Card,
   CardContent,
@@ -10,9 +13,8 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import { Shell } from "~/components/shell";
-import { OAuthSignIn } from "~/app/[locale]/(auth)/_components/oauth-signin";
-import { SignInForm } from "~/app/[locale]/(auth)/_components/signin-form";
+import { env } from "~/env.js";
+import { getCachedUser } from "~/server/queries/user";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -20,7 +22,13 @@ export const metadata: Metadata = {
   description: "Sign in to your account",
 };
 
-export default function SignInPage() {
+export default async function SignInPage() {
+  const user = await getCachedUser();
+
+  if (user) {
+    redirect("/");
+  }
+
   return (
     <Shell className="max-w-lg">
       <Card>
diff --git a/src/app/[locale]/(auth)/signin/reset-password/[[...reset-password]]/page.tsx b/src/app/[locale]/signin/reset-password/[[...reset-password]]/page.tsx
similarity index 90%
rename from src/app/[locale]/(auth)/signin/reset-password/[[...reset-password]]/page.tsx
rename to src/app/[locale]/signin/reset-password/[[...reset-password]]/page.tsx
index 97543d88..1b00199e 100644
--- a/src/app/[locale]/(auth)/signin/reset-password/[[...reset-password]]/page.tsx
+++ b/src/app/[locale]/signin/reset-password/[[...reset-password]]/page.tsx
@@ -1,6 +1,7 @@
 import { type Metadata } from "next";
-import { env } from "~/env.js";
 
+import { ResetPasswordForm } from "~/components/reset-password-form";
+import { Shell } from "~/components/shell";
 import {
   Card,
   CardContent,
@@ -8,8 +9,7 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import { Shell } from "~/components/shell";
-import { ResetPasswordForm } from "~/app/[locale]/(auth)/_components/reset-password-form";
+import { env } from "~/env.js";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
diff --git a/src/app/[locale]/(auth)/signin/reset-password/confirm/[[...confirm]]/page.tsx b/src/app/[locale]/signin/reset-password/confirm/[[...confirm]]/page.tsx
similarity index 89%
rename from src/app/[locale]/(auth)/signin/reset-password/confirm/[[...confirm]]/page.tsx
rename to src/app/[locale]/signin/reset-password/confirm/[[...confirm]]/page.tsx
index 709d77e0..4b1fee50 100644
--- a/src/app/[locale]/(auth)/signin/reset-password/confirm/[[...confirm]]/page.tsx
+++ b/src/app/[locale]/signin/reset-password/confirm/[[...confirm]]/page.tsx
@@ -1,6 +1,7 @@
 import { type Metadata } from "next";
-import { env } from "~/env.js";
 
+import { ResetPasswordConfirmForm } from "~/components/reset-password-confirm-form";
+import { Shell } from "~/components/shell";
 import {
   Card,
   CardContent,
@@ -8,8 +9,7 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import { Shell } from "~/components/shell";
-import { ResetPasswordConfirmForm } from "~/app/[locale]/(auth)/_components/reset-password-confirm-form";
+import { env } from "~/env.js";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
diff --git a/src/app/[locale]/(auth)/signout/[[...signout]]/page.tsx b/src/app/[locale]/signout/[[...signout]]/page.tsx
similarity index 72%
rename from src/app/[locale]/(auth)/signout/[[...signout]]/page.tsx
rename to src/app/[locale]/signout/[[...signout]]/page.tsx
index f45db5cb..9371872b 100644
--- a/src/app/[locale]/(auth)/signout/[[...signout]]/page.tsx
+++ b/src/app/[locale]/signout/[[...signout]]/page.tsx
@@ -1,13 +1,16 @@
 import type { Metadata } from "next";
-import { env } from "~/env.js";
 
+import { redirect } from "next/navigation";
+
+import { LogOutButtons } from "~/components/logout-buttons";
 import {
   PageHeader,
   PageHeaderDescription,
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
-import { LogOutButtons } from "~/app/[locale]/(auth)/_components/logout-buttons";
+import { env } from "~/env.js";
+import { getCachedUser } from "~/server/queries/user";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -15,7 +18,13 @@ export const metadata: Metadata = {
   description: "Sign out of your account",
 };
 
-export default function SignOutPage() {
+export default async function SignOutPage() {
+  const user = await getCachedUser();
+
+  if (!user) {
+    redirect("/");
+  }
+
   return (
     <Shell className="max-w-md">
       <PageHeader className="text-center">
diff --git a/src/app/[locale]/(auth)/signup/[[...signup]]/page.tsx b/src/app/[locale]/signup/[[...signup]]/page.tsx
similarity index 83%
rename from src/app/[locale]/(auth)/signup/[[...signup]]/page.tsx
rename to src/app/[locale]/signup/[[...signup]]/page.tsx
index a392eb99..3df0f33b 100644
--- a/src/app/[locale]/(auth)/signup/[[...signup]]/page.tsx
+++ b/src/app/[locale]/signup/[[...signup]]/page.tsx
@@ -1,7 +1,10 @@
 import { type Metadata } from "next";
 import Link from "next/link";
-import { env } from "~/env.js";
+import { redirect } from "next/navigation";
 
+import { OAuthSignIn } from "~/components/oauth-signin";
+import { Shell } from "~/components/shell";
+import { SignUpForm } from "~/components/signup-form";
 import {
   Card,
   CardContent,
@@ -10,9 +13,8 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import { Shell } from "~/components/shell";
-import { OAuthSignIn } from "~/app/[locale]/(auth)/_components/oauth-signin";
-import { SignUpForm } from "~/app/[locale]/(auth)/_components/signup-form";
+import { env } from "~/env.js";
+import { getCachedUser } from "~/server/queries/user";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -20,7 +22,13 @@ export const metadata: Metadata = {
   description: "Sign up for an account",
 };
 
-export default function SignUpPage() {
+export default async function SignUpPage() {
+  const user = await getCachedUser();
+
+  if (user) {
+    redirect("/");
+  }
+
   return (
     <Shell className="max-w-lg">
       <Card>
diff --git a/src/app/[locale]/(auth)/signup/verify-email/[[...verify-email]]/page.tsx b/src/app/[locale]/signup/verify-email/[[...verify-email]]/page.tsx
similarity index 91%
rename from src/app/[locale]/(auth)/signup/verify-email/[[...verify-email]]/page.tsx
rename to src/app/[locale]/signup/verify-email/[[...verify-email]]/page.tsx
index bfb7ef83..5f912503 100644
--- a/src/app/[locale]/(auth)/signup/verify-email/[[...verify-email]]/page.tsx
+++ b/src/app/[locale]/signup/verify-email/[[...verify-email]]/page.tsx
@@ -1,6 +1,6 @@
 import { type Metadata } from "next";
-import { env } from "~/env.js";
 
+import { Shell } from "~/components/shell";
 import {
   Card,
   CardContent,
@@ -8,8 +8,8 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import { Shell } from "~/components/shell";
-import { VerifyEmailForm } from "~/app/[locale]/(auth)/_components/verify-email-form";
+import { VerifyEmailForm } from "~/components/verify-email-form";
+import { env } from "~/env.js";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
diff --git a/src/app/[locale]/sso-callback/[[...sso-callback]]/client.tsx b/src/app/[locale]/sso-callback/[[...sso-callback]]/client.tsx
new file mode 100644
index 00000000..3417486a
--- /dev/null
+++ b/src/app/[locale]/sso-callback/[[...sso-callback]]/client.tsx
@@ -0,0 +1,34 @@
+"use client";
+
+import type { HandleOAuthCallbackParams } from "@clerk/types";
+
+import { useClerk } from "@clerk/nextjs";
+import { useEffect } from "react";
+
+import { Icons } from "~/components/icons";
+
+export default function SSOCallback({
+  searchParams,
+}: {
+  searchParams: HandleOAuthCallbackParams;
+}) {
+  const { handleRedirectCallback } = useClerk();
+
+  useEffect(() => {
+    void handleRedirectCallback(searchParams);
+  }, [searchParams, handleRedirectCallback]);
+
+  return (
+    <div
+      role="status"
+      aria-label="Loading"
+      aria-describedby="loading-description"
+      className="flex items-center justify-center"
+    >
+      <Icons.spinner
+        className="h-12 w-h-12 animate-caret-blink"
+        aria-hidden="true"
+      />
+    </div>
+  );
+}
diff --git a/src/app/[locale]/sso-callback/[[...sso-callback]]/page.tsx b/src/app/[locale]/sso-callback/[[...sso-callback]]/page.tsx
new file mode 100644
index 00000000..126587bc
--- /dev/null
+++ b/src/app/[locale]/sso-callback/[[...sso-callback]]/page.tsx
@@ -0,0 +1,19 @@
+import type { HandleOAuthCallbackParams } from "@clerk/types";
+
+import { Card } from "~/components/ui/card";
+
+import SSOCallback from "./client";
+
+export default async function SSOCallbackPage({
+  params,
+}: {
+  params: Promise<{ searchParams: HandleOAuthCallbackParams }>;
+}) {
+  const resolvedParams = await params;
+  const { searchParams } = resolvedParams;
+  return (
+    <Card className="max-w-lg place-items-center">
+      <SSOCallback searchParams={searchParams} />
+    </Card>
+  );
+}
diff --git a/src/app/[locale]/(lobby)/stores/loading.tsx b/src/app/[locale]/stores/loading.tsx
similarity index 100%
rename from src/app/[locale]/(lobby)/stores/loading.tsx
rename to src/app/[locale]/stores/loading.tsx
index fa68c096..6fecd7b5 100644
--- a/src/app/[locale]/(lobby)/stores/loading.tsx
+++ b/src/app/[locale]/stores/loading.tsx
@@ -1,6 +1,6 @@
-import { Skeleton } from "~/components/ui/skeleton";
 import { ProductCardSkeleton } from "~/components/product-card-skeleton";
 import { Shell } from "~/components/shell";
+import { Skeleton } from "~/components/ui/skeleton";
 
 export default function ProductsLoading() {
   return (
diff --git a/src/app/[locale]/(dashboard)/dashboard/stores/page.tsx b/src/app/[locale]/stores/page.tsx
similarity index 91%
rename from src/app/[locale]/(dashboard)/dashboard/stores/page.tsx
rename to src/app/[locale]/stores/page.tsx
index db9b7d70..03d3c4f5 100644
--- a/src/app/[locale]/(dashboard)/dashboard/stores/page.tsx
+++ b/src/app/[locale]/stores/page.tsx
@@ -1,8 +1,7 @@
 import { type Metadata } from "next";
-import { env } from "~/env.js";
+
 import type { SearchParams } from "~/types";
 
-import { getProducts } from "~/lib/queries/product";
 import { AlertCard } from "~/components/alert-card";
 import {
   PageHeader,
@@ -10,6 +9,8 @@ import {
   PageHeaderHeading,
 } from "~/components/page-header";
 import { Shell } from "~/components/shell";
+import { env } from "~/env.js";
+import { getProducts } from "~/server/queries/product";
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
@@ -17,9 +18,9 @@ export const metadata: Metadata = {
   description: "Discover products from our stores",
 };
 
-interface StoresPageProps {
+type StoresPageProps = {
   searchParams: SearchParams;
-}
+};
 
 export default async function StoresPage({ searchParams }: StoresPageProps) {
   const productsTransaction = await getProducts(searchParams);
diff --git a/src/app/api/email/newsletter/route.ts b/src/app/api/email/newsletter/route.ts
index 1a0f345a..a23b1527 100644
--- a/src/app/api/email/newsletter/route.ts
+++ b/src/app/api/email/newsletter/route.ts
@@ -1,13 +1,13 @@
-import { db } from "~/db";
-import { notifications } from "~/db/schema";
-import { env } from "~/env.js";
 import { currentUser } from "@clerk/nextjs/server";
 import { eq } from "drizzle-orm";
 import { z } from "zod";
 
-import { resend } from "~/lib/resend";
-import { joinNewsletterSchema } from "~/lib/validations/notification";
 import NewsletterWelcomeEmail from "~/components/emails/newsletter-welcome-email";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { notifications } from "~/server/db/schema";
+import { resend } from "~/server/resend";
+import { joinNewsletterSchema } from "~/server/validations/notification";
 
 export async function POST(req: Request) {
   const input = joinNewsletterSchema.parse(await req.json());
@@ -46,7 +46,6 @@ export async function POST(req: Request) {
       }),
       db
         .insert(notifications)
-        // @ts-expect-error TODO: fix ts
         .values({
           email: input.email,
           token: input.token,
@@ -55,7 +54,6 @@ export async function POST(req: Request) {
         .onConflictDoUpdate({
           target: [notifications.email],
           set: {
-            // @ts-expect-error TODO: fix ts
             newsletter: true,
           },
         }),
diff --git a/src/app/api/og/route.tsx b/src/app/api/og/route.tsx
index 22ce9f56..0220e0b9 100644
--- a/src/app/api/og/route.tsx
+++ b/src/app/api/og/route.tsx
@@ -1,17 +1,17 @@
 import { ImageResponse } from "next/og";
 
-import { cn } from "~/lib/utils";
-import { ogImageSchema } from "~/lib/validations/og";
+import { cn } from "~/server/utils";
+import { ogImageSchema } from "~/server/validations/og";
 
 // export const runtime = "edge"; // TODO: ensure api works without it
 
 export async function GET(req: Request) {
   try {
     const calSemiBoldData = await fetch(
-      new URL("../../../assets/fonts/CalSans-SemiBold.ttf", import.meta.url),
+      new URL("~/styles/fonts/CalSans-SemiBold.ttf", import.meta.url),
     ).then((res) => res.arrayBuffer());
     const interData = await fetch(
-      new URL("../../../assets/fonts/Inter-Regular.ttf", import.meta.url),
+      new URL("~/styles/fonts/Inter-Regular.ttf", import.meta.url),
     ).then((res) => res.arrayBuffer());
 
     const url = new URL(req.url);
diff --git a/src/app/api/revalidate/[tag]/route.ts b/src/app/api/revalidate/[tag]/route.ts
index f0588df4..a615522c 100644
--- a/src/app/api/revalidate/[tag]/route.ts
+++ b/src/app/api/revalidate/[tag]/route.ts
@@ -1,7 +1,8 @@
 import { revalidateTag } from "next/cache";
-import { env } from "~/env";
 import { z } from "zod";
 
+import { env } from "~/env";
+
 const schema = z.object({
   params: z.object({
     tag: z.string(),
diff --git a/src/app/api/revalidate/route.ts b/src/app/api/revalidate/route.ts
index b27ec3e1..2b3bd3c7 100644
--- a/src/app/api/revalidate/route.ts
+++ b/src/app/api/revalidate/route.ts
@@ -1,4 +1,5 @@
 import { revalidatePath } from "next/cache";
+
 import { env } from "~/env";
 
 export async function GET() {
diff --git a/src/app/api/uploadthing/core.ts b/src/app/api/uploadthing/core.ts
index b8711755..2a94fa5b 100644
--- a/src/app/api/uploadthing/core.ts
+++ b/src/app/api/uploadthing/core.ts
@@ -1,8 +1,6 @@
 import { currentUser } from "@clerk/nextjs/server";
 import { createUploadthing, type FileRouter } from "uploadthing/next";
 import { UploadThingError } from "uploadthing/server";
-import { ipAddress } from "@vercel/functions";
-import { ratelimit } from "~/lib/rate-limit";
 
 const f = createUploadthing();
 
@@ -13,19 +11,12 @@ export const ourFileRouter = {
     // Set permissions and file types for this FileRoute
     .middleware(async ({ req }) => {
       // This code runs on your server before upload
-
-      // Rate limit the upload
-      const ip = ipAddress(req) ?? "127.0.0.1";
-      const { success } = await ratelimit.limit(ip);
-
-      if (!success) {
-        throw new UploadThingError("Rate limit exceeded");
-      }
-
       const user = await currentUser();
 
       // If you throw, the user will not be able to upload
-      if (!user) throw new UploadThingError("Unauthorized");
+      if (!user) {
+        throw new UploadThingError("Unauthorized");
+      }
 
       // Whatever is returned here is accessible in onUploadComplete as `metadata`
       return { userId: user.id };
diff --git a/src/app/api/webhooks/stripe/route.ts b/src/app/api/webhooks/stripe/route.ts
index d50356ee..9d07f732 100644
--- a/src/app/api/webhooks/stripe/route.ts
+++ b/src/app/api/webhooks/stripe/route.ts
@@ -1,18 +1,25 @@
-import { revalidateTag } from "next/cache";
-import { headers } from "next/headers";
-import { db } from "~/db";
-import { addresses, carts, orders, payments, products } from "~/db/schema";
-import { env } from "~/env.js";
+import type Stripe from "stripe";
+
 import { clerkClient } from "@clerk/nextjs/server";
 import { eq } from "drizzle-orm";
-import type Stripe from "stripe";
+import { revalidateTag } from "next/cache";
+import { headers } from "next/headers";
 import { z } from "zod";
 
-import { stripe } from "~/lib/stripe";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import {
+  addresses,
+  carts,
+  orders,
+  payments,
+  products,
+} from "~/server/db/schema";
+import { stripe } from "~/server/stripe";
 import {
   checkoutItemSchema,
   type CheckoutItemSchema,
-} from "~/lib/validations/cart";
+} from "~/server/validations/cart";
 
 export async function POST(req: Request) {
   const body = await req.text();
@@ -117,7 +124,9 @@ export async function POST(req: Request) {
       // If there are items in metadata, then create order
       if (checkoutItems) {
         try {
-          if (!event.account) throw new Error("No account found.");
+          if (!event.account) {
+            throw new Error("No account found.");
+          }
 
           // Parsing items from metadata
           // Didn't parse before because can pass the unparsed data directly to the order table items json column in the db
@@ -159,11 +168,11 @@ export async function POST(req: Request) {
               insertedId: addresses.id,
             });
 
-          if (!newAddress[0]?.insertedId)
+          if (!newAddress[0]?.insertedId) {
             throw new Error("No address created.");
+          }
 
           // Create new order in db
-          // @ts-expect-error TODO: fix ts
           await db.insert(orders).values({
             storeId: payment.storeId,
             items: checkoutItems ?? [],
@@ -202,7 +211,6 @@ export async function POST(req: Request) {
             await db
               .update(products)
               .set({
-                // @ts-expect-error TODO: fix ts
                 inventory: product.inventory - item.quantity,
               })
               .where(eq(products.id, item.productId));
diff --git a/src/app/global-error.tsx b/src/app/global-error.tsx
deleted file mode 100644
index 3a833aa3..00000000
--- a/src/app/global-error.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-"use client";
-
-import Error from "next/error";
-
-export default function GlobalError(props: {
-  error: {
-    digest?: string;
-  } & Error;
-  params: {
-    locale: string;
-  };
-}) {
-  return (
-    <html lang={props.params.locale}>
-      <body>
-        <Error statusCode={undefined as any} />
-      </body>
-    </html>
-  );
-}
diff --git a/src/app/icon.png b/src/app/icon.png
deleted file mode 100644
index 4cc8dd24..00000000
Binary files a/src/app/icon.png and /dev/null differ
diff --git a/src/app/manifest.ts b/src/app/manifest.ts
deleted file mode 100644
index 617b695e..00000000
--- a/src/app/manifest.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import type { MetadataRoute } from "next";
-
-import { getTranslations } from "next-intl/server";
-
-export default async function manifest(): Promise<MetadataRoute.Manifest> {
-  const locale = "en-US";
-  const t = await getTranslations({ locale, namespace: "Manifest" });
-
-  return {
-    name: t("name"),
-    start_url: "/",
-    theme_color: "#fff",
-  };
-}
diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx
deleted file mode 100644
index 8f401271..00000000
--- a/src/app/not-found.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-"use client";
-
-import Error from "next/error";
-
-// Render the default Next.js 404 page when a route
-// is requested that doesn't match the middleware and
-// therefore doesn't have a locale associated with it.
-
-export default function NotFound() {
-  return (
-    <html lang="en-US">
-      <body>
-        <Error statusCode={404} />
-      </body>
-    </html>
-  );
-}
diff --git a/src/app/robots.ts b/src/app/robots.ts
deleted file mode 100644
index d70021c6..00000000
--- a/src/app/robots.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import { type MetadataRoute } from "next";
-
-import { absoluteUrl } from "~/lib/utils";
-
-export default function robots(): MetadataRoute.Robots {
-  return {
-    rules: {
-      userAgent: "*",
-      allow: "/",
-    },
-    sitemap: absoluteUrl("/sitemap.xml"),
-  };
-}
diff --git a/src/app/sitemap.ts b/src/app/sitemap.ts
deleted file mode 100644
index cf0a55a3..00000000
--- a/src/app/sitemap.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import type { MetadataRoute } from "next";
-import { env } from "~/env";
-
-const host = (() => {
-  if (env.NEXT_PUBLIC_APP_URL || "http://localhost:3000") {
-    return env.NEXT_PUBLIC_APP_URL || "http://localhost:3000";
-  }
-
-  if (env.VERCEL_URL) {
-    return `https://${env.VERCEL_URL}`;
-  }
-
-  const port = env.PORT || 3000;
-
-  return `http://localhost:${port}`;
-})();
-
-export default function sitemap(): MetadataRoute.Sitemap {
-  return [
-    {
-      url: host,
-      lastModified: new Date(),
-    },
-  ];
-}
diff --git a/src/components/alert-card.tsx b/src/components/alert-card.tsx
index f4ed7eb6..6939457f 100644
--- a/src/components/alert-card.tsx
+++ b/src/components/alert-card.tsx
@@ -1,17 +1,17 @@
-import React from "react";
-import Link from "next/link";
 import { RocketIcon } from "@radix-ui/react-icons";
+import Link from "next/link";
+import React from "react";
 
-import { siteConfig } from "~/config/site";
-import { cn } from "~/lib/utils";
-import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
 import { Icons } from "~/components/icons";
+import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
+import { siteConfig } from "~/config/site";
+import { cn } from "~/server/utils";
 
-interface AlertCardProps extends React.ComponentPropsWithoutRef<typeof Alert> {
+type AlertCardProps = {
   title?: string;
   description?: string;
   icon?: keyof typeof Icons;
-}
+} & React.ComponentPropsWithoutRef<typeof Alert>;
 
 export function AlertCard({
   title,
@@ -37,14 +37,15 @@ export function AlertCard({
       {children ?? (
         <div className="flex flex-col items-center space-y-2 text-center">
           <AlertTitle className="text-lg">
-            {title ?? "Rewriting with the latest Next.js 15 features"}
+            {title ??
+              "Rewriting with the latest Next.js 15 and React 19 features"}
           </AlertTitle>
           {description ? (
             <AlertDescription className="text-muted-foreground">
               {description}
             </AlertDescription>
           ) : (
-            <div className="flex items-center space-x-2 text-sm text-muted-foreground">
+            <div className="flex items-center space-x-1 text-sm text-muted-foreground">
               <AlertDescription>Follow along on</AlertDescription>
               <Link
                 href={siteConfig.links.discord}
diff --git a/src/components/app-footer.tsx b/src/components/app-footer.tsx
new file mode 100644
index 00000000..f76dac35
--- /dev/null
+++ b/src/components/app-footer.tsx
@@ -0,0 +1,29 @@
+import { ExternalLink } from "lucide-react";
+import Link from "next/link";
+
+export default function AppFooter() {
+  return (
+    <footer className="flex h-16 shrink-0 items-center gap-2 px-4 text-sm text-muted-foreground border-t border-border/60 pt-1">
+      <div className="flex-1 flex justify-center">
+        <nav className="flex space-x-4 rounded-full py-4 px-6">
+          <Link
+            href="https://docs.reliverse.org/relivator"
+            target="_blank"
+            className="inline-flex gap-0.5 items-center hover:text-foreground"
+          >
+            Relivator Docs
+            <ExternalLink className="w-3 h-3" />
+          </Link>
+          <Link
+            href="https://github.com/blefnk/relivator#readme"
+            target="_blank"
+            className="inline-flex gap-0.5 items-center hover:text-foreground"
+          >
+            Download Template
+            <ExternalLink className="w-3 h-3" />
+          </Link>
+        </nav>
+      </div>
+    </footer>
+  );
+}
diff --git a/src/components/app-header.tsx b/src/components/app-header.tsx
new file mode 100644
index 00000000..890496e5
--- /dev/null
+++ b/src/components/app-header.tsx
@@ -0,0 +1,39 @@
+import type { User } from "@clerk/nextjs/server";
+
+import Link from "next/link";
+
+import { CartSheet } from "~/components/checkout/cart-sheet";
+import { AuthDropdown } from "~/components/layouts/auth-dropdown";
+import { ProductsCombobox } from "~/components/products-combobox";
+import { siteConfig } from "~/config/site";
+
+import { ByBleverseSheet } from "./by-bleverse";
+import { LocaleSwitcher } from "./i18n/LocaleSwitcher";
+import { Icons } from "./icons";
+import { Navigation } from "./layouts/navigation";
+import { ThemeSwitcher } from "./theming";
+
+export default function AppHeader({ user }: { user: User | null }) {
+  return (
+    <header className="flex h-20 shrink-0 items-center justify-between gap-2 px-4 mt-2 pb-2 border-b">
+      <Link href="/" className="items-center space-x-2 hidden sm:flex">
+        <Icons.logo className="h-6 w-6" aria-hidden="true" />
+        <span className="font-bold text-base">{siteConfig.name}</span>
+        <span className="sr-only">Home</span>
+      </Link>
+
+      <div className="flex items-center space-x-2">
+        <Navigation items={siteConfig.mainNav} />
+        <ProductsCombobox />
+        <CartSheet />
+      </div>
+
+      <div className="flex items-center gap-2">
+        <AuthDropdown user={user} />
+        <LocaleSwitcher />
+        <ThemeSwitcher variant="outline" />
+        <ByBleverseSheet />
+      </div>
+    </header>
+  );
+}
diff --git a/src/components/app-sidebar.tsx b/src/components/app-sidebar.tsx
new file mode 100644
index 00000000..07b0dde3
--- /dev/null
+++ b/src/components/app-sidebar.tsx
@@ -0,0 +1,196 @@
+import type * as React from "react";
+
+import {
+  Sidebar,
+  SidebarContent,
+  SidebarGroup,
+  SidebarGroupContent,
+  SidebarGroupLabel,
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  SidebarMenuSub,
+  SidebarMenuSubButton,
+  SidebarMenuSubItem,
+  SidebarRail,
+} from "~/components/ui/sidebar";
+
+const data = {
+  navMain: [
+    {
+      title: "Reliverse",
+      url: "#",
+      items: [
+        {
+          title: "Docs",
+          url: "#",
+        },
+        {
+          title: "CLI",
+          url: "#",
+        },
+      ],
+    },
+    {
+      title: "Bleverse",
+      url: "#",
+      items: [
+        {
+          title: "Coming Soon",
+          url: "#",
+          isActive: true,
+        },
+        {
+          title: "...",
+          url: "#",
+        },
+        /* {
+          title: "Rendering",
+          url: "#",
+        },
+        {
+          title: "Caching",
+          url: "#",
+        },
+        {
+          title: "Styling",
+          url: "#",
+        },
+        {
+          title: "Optimizing",
+          url: "#",
+        },
+        {
+          title: "Configuring",
+          url: "#",
+        },
+        {
+          title: "Testing",
+          url: "#",
+        },
+        {
+          title: "Authentication",
+          url: "#",
+        },
+        {
+          title: "Deploying",
+          url: "#",
+        },
+        {
+          title: "Upgrading",
+          url: "#",
+        },
+        {
+          title: "Examples",
+          url: "#",
+        }, */
+      ],
+    },
+    /* {
+      title: "API Reference",
+      url: "#",
+      items: [
+        {
+          title: "Components",
+          url: "#",
+        },
+        {
+          title: "File Conventions",
+          url: "#",
+        },
+        {
+          title: "Functions",
+          url: "#",
+        },
+        {
+          title: "next.config.js Options",
+          url: "#",
+        },
+        {
+          title: "CLI",
+          url: "#",
+        },
+        {
+          title: "Edge Runtime",
+          url: "#",
+        },
+      ],
+    }, */
+    /* {
+      title: "Architecture",
+      url: "#",
+      items: [
+        {
+          title: "Accessibility",
+          url: "#",
+        },
+        {
+          title: "Fast Refresh",
+          url: "#",
+        },
+        {
+          title: "Next.js Compiler",
+          url: "#",
+        },
+        {
+          title: "Supported Browsers",
+          url: "#",
+        },
+        {
+          title: "Turbopack",
+          url: "#",
+        },
+      ],
+    }, */
+    /* {
+      title: "Community",
+      url: "#",
+      items: [
+        {
+          title: "Contribution Guide",
+          url: "#",
+        },
+      ],
+    }, */
+  ],
+};
+
+export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
+  return (
+    <Sidebar {...props}>
+      <SidebarContent>
+        <SidebarGroup>
+          <SidebarGroupLabel>© 2024 Bleverse</SidebarGroupLabel>
+          <SidebarGroupContent>
+            <SidebarMenu>
+              {data.navMain.map((item) => (
+                <SidebarMenuItem key={item.title}>
+                  <SidebarMenuButton asChild>
+                    <a href={item.url} className="font-medium">
+                      {item.title}
+                    </a>
+                  </SidebarMenuButton>
+                  {item.items?.length ? (
+                    <SidebarMenuSub>
+                      {item.items.map((item) => (
+                        <SidebarMenuSubItem key={item.title}>
+                          <SidebarMenuSubButton
+                            asChild
+                            isActive={item.isActive}
+                          >
+                            <a href={item.url}>{item.title}</a>
+                          </SidebarMenuSubButton>
+                        </SidebarMenuSubItem>
+                      ))}
+                    </SidebarMenuSub>
+                  ) : null}
+                </SidebarMenuItem>
+              ))}
+            </SidebarMenu>
+          </SidebarGroupContent>
+        </SidebarGroup>
+      </SidebarContent>
+      <SidebarRail />
+    </Sidebar>
+  );
+}
diff --git a/src/components/blur-image.tsx b/src/components/blur-image.tsx
index 7341ea18..5ec1a91f 100644
--- a/src/components/blur-image.tsx
+++ b/src/components/blur-image.tsx
@@ -2,12 +2,13 @@
 
 // Original source: https://github.com/vercel/platforms/blob/main/components/blur-image.tsx
 import type { ComponentProps } from "react";
-import * as React from "react";
+
 import Image from "next/image";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
-interface BlurImageProps extends ComponentProps<typeof Image> {}
+type BlurImageProps = {} & ComponentProps<typeof Image>;
 
 export function BlurImage({ className, alt, ...props }: BlurImageProps) {
   const [isLoading, setLoading] = React.useState(true);
diff --git a/src/components/board-builder.tsx b/src/components/board-builder.tsx
index 75263b43..96acc847 100644
--- a/src/components/board-builder.tsx
+++ b/src/components/board-builder.tsx
@@ -1,17 +1,12 @@
 "use client";
 
-import * as React from "react";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
-import { type Product } from "~/db/schema";
 import { ChevronDownIcon } from "@radix-ui/react-icons";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import * as React from "react";
 import { toast } from "sonner";
 
-import { queryConfig } from "~/config/query";
-import { addToCart, deleteCartItem } from "~/lib/actions/cart";
-import { showErrorToast } from "~/lib/handle-error";
-import { cn } from "~/lib/utils";
-import { type CartItemSchema } from "~/lib/validations/cart";
-import { useDebounce } from "~/hooks/use-debounce";
+import { PaginationButton } from "~/components/pagination-button";
+import { ProductCard } from "~/components/product-card";
 import { Button } from "~/components/ui/button";
 import { Card, CardDescription } from "~/components/ui/card";
 import {
@@ -35,15 +30,20 @@ import {
 } from "~/components/ui/sheet";
 import { Slider } from "~/components/ui/slider";
 import { Switch } from "~/components/ui/switch";
-import { PaginationButton } from "~/components/pagination-button";
-import { ProductCard } from "~/components/product-card";
+import { queryConfig } from "~/config/query";
+import { useDebounce } from "~/hooks/use-debounce";
+import { addToCart, deleteCartItem } from "~/server/actions/cart";
+import { type Product } from "~/server/db/schema";
+import { showErrorToast } from "~/server/handle-error";
+import { cn } from "~/server/utils";
+import { type CartItemSchema } from "~/server/validations/cart";
 
-interface BoardBuilderProps {
+type BoardBuilderProps = {
   products: Product[];
   pageCount: number;
   subcategory: string | null;
   cartItems: CartItemSchema[];
-}
+};
 
 export function BoardBuilder({
   products,
diff --git a/src/components/by-bleverse.tsx b/src/components/by-bleverse.tsx
new file mode 100644
index 00000000..bd4ecc2b
--- /dev/null
+++ b/src/components/by-bleverse.tsx
@@ -0,0 +1,120 @@
+import { GitHubLogoIcon } from "@radix-ui/react-icons";
+import { ExternalLink, File, ImageIcon, PanelLeft } from "lucide-react";
+import { Globe } from "lucide-react";
+import Link from "next/link";
+
+import { Button } from "~/components/ui/button";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import {
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger,
+} from "~/components/ui/sheet";
+
+import { Icons } from "./icons";
+import { Separator } from "./ui/separator";
+
+export function ByBleverseSheet() {
+  return (
+    <Sheet>
+      <SheetTrigger asChild>
+        <Button variant="ghost" size="icon" className="w-7 h-7">
+          <PanelLeft />
+        </Button>
+      </SheetTrigger>
+      <SheetContent side="right" className="w-[400px]">
+        <ScrollArea className="h-full">
+          <div className="flex flex-col gap-6 p-6">
+            <SheetHeader className="space-y-4">
+              <SheetTitle className="flex flex-col text-sm">
+                <div className="flex items-center justify-between w-full">
+                  <div className="flex flex-col">
+                    <span className="text-base font-semibold">Bleverse</span>
+                    <span className="text-muted-foreground text-sm">
+                      Products
+                    </span>
+                  </div>
+                  <SheetClose className="right-4 top-2 p-1 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none">
+                    <kbd className="inline-flex select-none items-center gap-1 rounded border bg-background px-2 py-1 font-mono font-medium opacity-100">
+                      <span className="text-xs">ESC</span>
+                      <span className="sr-only">Close</span>
+                    </kbd>
+                  </SheetClose>
+                </div>
+              </SheetTitle>
+            </SheetHeader>
+            <Separator />
+
+            <div>
+              <h3 className="mb-4 text-sm font-semibold">
+                ✨ Reliverse Spaces
+              </h3>
+              <div className="space-y-4">
+                <Link
+                  href="https://docs.reliverse.org"
+                  className="sheet-link"
+                  target="_blank"
+                >
+                  <File className="h-4 w-4" />
+                  Documentation
+                  <ExternalLink className="ml-auto h-4 w-4" />
+                </Link>
+              </div>
+            </div>
+
+            <div>
+              <h3 className="mb-4 text-sm font-semibold">🌌 Bleverse Spaces</h3>
+              <div className="space-y-4">
+                <Link
+                  href="https://discord.gg/Pb8uKbwpsJ"
+                  className="sheet-link"
+                  target="_blank"
+                >
+                  <Globe className="h-4 w-4" />
+                  Discord Server
+                  <ExternalLink className="ml-auto h-4 w-4" />
+                </Link>
+              </div>
+            </div>
+
+            <div>
+              <h3 className="mb-4 text-sm font-semibold">🧿 Nazar Kornienko</h3>
+              <div className="space-y-4">
+                <Link
+                  href="https://blefnk.reliverse.org"
+                  className="sheet-link"
+                  target="_blank"
+                >
+                  <ImageIcon className="h-4 w-4" />
+                  Portfolio
+                  <ExternalLink className="ml-auto h-4 w-4" />
+                </Link>
+                <Link
+                  href="https://x.com/blefnk"
+                  className="sheet-link"
+                  target="_blank"
+                >
+                  <Icons.x className="h-4 w-4" />
+                  Twitter
+                  <ExternalLink className="ml-auto h-4 w-4" />
+                </Link>
+                <Link
+                  href="https://github.com/blefnk"
+                  className="sheet-link"
+                  target="_blank"
+                >
+                  <GitHubLogoIcon className="h-4 w-4" />
+                  GitHub
+                  <ExternalLink className="ml-auto h-4 w-4" />
+                </Link>
+              </div>
+            </div>
+          </div>
+        </ScrollArea>
+      </SheetContent>
+    </Sheet>
+  );
+}
diff --git a/src/app/[locale]/(lobby)/_components/category-card-skeleton.tsx b/src/components/category-card-skeleton.tsx
similarity index 100%
rename from src/app/[locale]/(lobby)/_components/category-card-skeleton.tsx
rename to src/components/category-card-skeleton.tsx
diff --git a/src/app/[locale]/(lobby)/_components/category-card.tsx b/src/components/category-card.tsx
similarity index 91%
rename from src/app/[locale]/(lobby)/_components/category-card.tsx
rename to src/components/category-card.tsx
index c1bb5e70..3e26aa94 100644
--- a/src/app/[locale]/(lobby)/_components/category-card.tsx
+++ b/src/components/category-card.tsx
@@ -1,10 +1,7 @@
-import * as React from "react";
 import Link from "next/link";
+import * as React from "react";
 
-import {
-  getProductCountByCategory,
-  type getCategories,
-} from "~/lib/queries/product";
+import { Icons } from "~/components/icons";
 import {
   Card,
   CardContent,
@@ -13,11 +10,14 @@ import {
   CardTitle,
 } from "~/components/ui/card";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Icons } from "~/components/icons";
+import {
+  getProductCountByCategory,
+  type getCategories,
+} from "~/server/queries/product";
 
-interface CategoryCardProps {
+type CategoryCardProps = {
   category: Awaited<ReturnType<typeof getCategories>>[number];
-}
+};
 
 export function CategoryCard({ category }: CategoryCardProps) {
   const productCountPromise = getProductCountByCategory({
@@ -25,7 +25,7 @@ export function CategoryCard({ category }: CategoryCardProps) {
   });
 
   return (
-    <Link href={`/collections/${category.slug}`}>
+    <Link href={`/categories/${category.slug}`}>
       <Card className="h-full rounded-lg transition-colors hover:bg-muted/25">
         <CardHeader className="flex-1">
           <CardTitle className="capitalize">{category.name}</CardTitle>
@@ -43,9 +43,9 @@ export function CategoryCard({ category }: CategoryCardProps) {
   );
 }
 
-interface ProductCountProps {
+type ProductCountProps = {
   productCountPromise: ReturnType<typeof getProductCountByCategory>;
-}
+};
 
 async function ProductCount({ productCountPromise }: ProductCountProps) {
   const count = await productCountPromise;
diff --git a/src/components/checkout/cart-line-items.tsx b/src/components/checkout/cart-line-items.tsx
index cdb63159..e79bfa4b 100644
--- a/src/components/checkout/cart-line-items.tsx
+++ b/src/components/checkout/cart-line-items.tsx
@@ -1,19 +1,19 @@
-import Image from "next/image";
 import { Slot } from "@radix-ui/react-slot";
+import Image from "next/image";
 
-import { cn, formatPrice } from "~/lib/utils";
-import { type CartLineItemSchema } from "~/lib/validations/cart";
-import { ScrollArea } from "~/components/ui/scroll-area";
-import { Separator } from "~/components/ui/separator";
 import { UpdateCart } from "~/components/checkout/update-cart";
 import { Icons } from "~/components/icons";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import { Separator } from "~/components/ui/separator";
+import { cn, formatPrice } from "~/server/utils";
+import { type CartLineItemSchema } from "~/server/validations/cart";
 
-interface CartLineItemsProps extends React.HTMLAttributes<HTMLDivElement> {
+type CartLineItemsProps = {
   items: CartLineItemSchema[];
   isScrollable?: boolean;
   isEditable?: boolean;
   variant?: "default" | "minimal";
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function CartLineItems({
   items,
diff --git a/src/components/checkout/cart-sheet.tsx b/src/components/checkout/cart-sheet.tsx
index 72b67627..b9aa329b 100644
--- a/src/components/checkout/cart-sheet.tsx
+++ b/src/components/checkout/cart-sheet.tsx
@@ -1,20 +1,21 @@
 import Link from "next/link";
 
-import { getCart } from "~/lib/actions/cart";
-import { cn, formatPrice } from "~/lib/utils";
+import { CartLineItems } from "~/components/checkout/cart-line-items";
+import { Icons } from "~/components/icons";
 import { Badge } from "~/components/ui/badge";
 import { Button, buttonVariants } from "~/components/ui/button";
 import { Separator } from "~/components/ui/separator";
 import {
   Sheet,
+  SheetClose,
   SheetContent,
   SheetFooter,
   SheetHeader,
   SheetTitle,
   SheetTrigger,
 } from "~/components/ui/sheet";
-import { CartLineItems } from "~/components/checkout/cart-line-items";
-import { Icons } from "~/components/icons";
+import { getCart } from "~/server/actions/cart";
+import { cn, formatPrice } from "~/server/utils";
 
 export async function CartSheet() {
   const cartLineItems = await getCart();
@@ -51,7 +52,15 @@ export async function CartSheet() {
       </SheetTrigger>
       <SheetContent className="flex w-full flex-col pr-0 sm:max-w-lg">
         <SheetHeader className="space-y-2.5 pr-6">
-          <SheetTitle>Cart {itemCount > 0 && `(${itemCount})`}</SheetTitle>
+          <div className="flex items-center justify-between">
+            <SheetTitle>Cart {itemCount > 0 && `(${itemCount})`}</SheetTitle>
+            <SheetClose className="absolute right-4 top-4 p-1 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-1 disabled:pointer-events-none">
+              <kbd className="inline-flex select-none items-center gap-1 rounded border bg-background px-2 py-1 font-mono font-medium opacity-100">
+                <span className="text-xs">ESC</span>
+                <span className="sr-only">Close</span>
+              </kbd>
+            </SheetClose>
+          </div>
           <Separator />
         </SheetHeader>
         {itemCount > 0 ? (
diff --git a/src/components/checkout/checkout-card.tsx b/src/components/checkout/checkout-card.tsx
index 92842c3b..ad4e4ccb 100644
--- a/src/components/checkout/checkout-card.tsx
+++ b/src/components/checkout/checkout-card.tsx
@@ -1,7 +1,6 @@
 import Link from "next/link";
 
-import { getCart } from "~/lib/actions/cart";
-import { cn, formatPrice } from "~/lib/utils";
+import { CartLineItems } from "~/components/checkout/cart-line-items";
 import { buttonVariants } from "~/components/ui/button";
 import {
   Card,
@@ -11,11 +10,12 @@ import {
   CardTitle,
 } from "~/components/ui/card";
 import { Separator } from "~/components/ui/separator";
-import { CartLineItems } from "~/components/checkout/cart-line-items";
+import { getCart } from "~/server/actions/cart";
+import { cn, formatPrice } from "~/server/utils";
 
-interface CheckoutCardProps {
+type CheckoutCardProps = {
   storeId: string;
-}
+};
 
 export async function CheckoutCard({ storeId }: CheckoutCardProps) {
   const cartLineItems = await getCart({ storeId });
@@ -23,7 +23,6 @@ export async function CheckoutCard({ storeId }: CheckoutCardProps) {
   return (
     <Card
       key={storeId}
-      as="section"
       id={`checkout-store-${storeId}`}
       aria-labelledby={`checkout-store-${storeId}-heading`}
       className={cn(
diff --git a/src/components/checkout/checkout-form.tsx b/src/components/checkout/checkout-form.tsx
index 23225820..4f76c74f 100644
--- a/src/components/checkout/checkout-form.tsx
+++ b/src/components/checkout/checkout-form.tsx
@@ -1,6 +1,5 @@
 "use client";
 
-import * as React from "react";
 import {
   AddressElement,
   LinkAuthenticationElement,
@@ -8,17 +7,18 @@ import {
   useElements,
   useStripe,
 } from "@stripe/react-stripe-js";
+import * as React from "react";
 import { toast } from "sonner";
 
-import { absoluteUrl, cn } from "~/lib/utils";
-import { Button } from "~/components/ui/button";
 import { Icons } from "~/components/icons";
+import { Button } from "~/components/ui/button";
+import { absoluteUrl, cn } from "~/server/utils";
 
 // See the stripe playemnts docs: https://stripe.com/docs/payments/quickstart
 
-interface CheckoutFormProps extends React.ComponentPropsWithoutRef<"form"> {
+type CheckoutFormProps = {
   storeId: string;
-}
+} & React.ComponentPropsWithoutRef<"form">;
 
 export function CheckoutForm({
   storeId,
@@ -33,13 +33,17 @@ export function CheckoutForm({
   const [isLoading, setIsLoading] = React.useState(false);
 
   React.useEffect(() => {
-    if (!stripe) return;
+    if (!stripe) {
+      return;
+    }
 
     const clientSecret = new URLSearchParams(window.location.search).get(
       "payment_intent_client_secret",
     );
 
-    if (!clientSecret) return;
+    if (!clientSecret) {
+      return;
+    }
 
     void stripe
       .retrievePaymentIntent(clientSecret)
diff --git a/src/components/checkout/checkout-shell.tsx b/src/components/checkout/checkout-shell.tsx
index d68d82ed..c26551af 100644
--- a/src/components/checkout/checkout-shell.tsx
+++ b/src/components/checkout/checkout-shell.tsx
@@ -1,19 +1,18 @@
 "use client";
 
-import * as React from "react";
 import { Elements } from "@stripe/react-stripe-js";
 import { type StripeElementsOptions } from "@stripe/stripe-js";
+import * as React from "react";
 
-import { getStripe } from "~/lib/get-stripe";
-import { cn } from "~/lib/utils";
+import { getStripe } from "~/server/get-stripe";
+import { cn } from "~/server/utils";
 
 /**
  * See the Stripe documentation for more information:
  * @see https://stripe.com/docs/payments/quickstart
  */
 
-interface CheckoutShellProps
-  extends React.PropsWithChildren<React.HTMLAttributes<HTMLDivElement>> {
+type CheckoutShellProps = {
   storeStripeAccountId: string;
   paymentIntentPromise: Promise<{
     data: {
@@ -21,7 +20,7 @@ interface CheckoutShellProps
     } | null;
     error: string | null;
   }>;
-}
+} & React.PropsWithChildren<React.HTMLAttributes<HTMLDivElement>>;
 
 export function CheckoutShell({
   children,
diff --git a/src/components/checkout/update-cart.tsx b/src/components/checkout/update-cart.tsx
index 289b8b24..1aeae871 100644
--- a/src/components/checkout/update-cart.tsx
+++ b/src/components/checkout/update-cart.tsx
@@ -1,17 +1,17 @@
 "use client";
 
-import * as React from "react";
 import { MinusIcon, PlusIcon, TrashIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 
-import { deleteCartItem, updateCartItem } from "~/lib/actions/cart";
-import { showErrorToast } from "~/lib/handle-error";
-import { type CartLineItemSchema } from "~/lib/validations/cart";
 import { Button } from "~/components/ui/button";
 import { Input } from "~/components/ui/input";
+import { deleteCartItem, updateCartItem } from "~/server/actions/cart";
+import { showErrorToast } from "~/server/handle-error";
+import { type CartLineItemSchema } from "~/server/validations/cart";
 
-interface UpdateCartProps {
+type UpdateCartProps = {
   cartLineItem: CartLineItemSchema;
-}
+};
 
 export function UpdateCart({ cartLineItem }: UpdateCartProps) {
   const id = React.useId();
diff --git a/src/components/checkout/verify-order-form.tsx b/src/components/checkout/verify-order-form.tsx
index b1cc3b09..3fe3c313 100644
--- a/src/components/checkout/verify-order-form.tsx
+++ b/src/components/checkout/verify-order-form.tsx
@@ -1,13 +1,13 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
+import type { z } from "zod";
+
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
-import type { z } from "zod";
 
-import { cn } from "~/lib/utils";
-import { verifyOrderSchema } from "~/lib/validations/order";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -18,9 +18,10 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Input } from "~/components/ui/input";
-import { Icons } from "~/components/icons";
+import { cn } from "~/server/utils";
+import { verifyOrderSchema } from "~/server/validations/order";
 
-interface VerifyOderFormProps extends React.ComponentPropsWithoutRef<"form"> {}
+type VerifyOderFormProps = {} & React.ComponentPropsWithoutRef<"form">;
 type Inputs = z.infer<typeof verifyOrderSchema>;
 
 export function VerifyOderForm({ className, ...props }: VerifyOderFormProps) {
diff --git a/src/components/client-button.tsx b/src/components/client-button.tsx
index e9aedb25..1699bee8 100644
--- a/src/components/client-button.tsx
+++ b/src/components/client-button.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import { cn } from "~/lib/utils";
 import { Button, type ButtonProps } from "~/components/ui/button";
+import { cn } from "~/server/utils";
 
-interface ClientButtonProps extends ButtonProps {}
+type ClientButtonProps = {} & ButtonProps;
 
 export function ClientButton({ className, ...props }: ClientButtonProps) {
   return <Button className={cn(className)} {...props}></Button>;
diff --git a/src/components/connect-store-to-stripe-button.tsx b/src/components/connect-store-to-stripe-button.tsx
index 42ac04ee..eb09dc91 100644
--- a/src/components/connect-store-to-stripe-button.tsx
+++ b/src/components/connect-store-to-stripe-button.tsx
@@ -3,14 +3,14 @@
 import * as React from "react";
 import { toast } from "sonner";
 
-import { createAccountLink } from "~/lib/actions/stripe";
-import { cn } from "~/lib/utils";
-import { Button, type ButtonProps } from "~/components/ui/button";
 import { Icons } from "~/components/icons";
+import { Button, type ButtonProps } from "~/components/ui/button";
+import { createAccountLink } from "~/server/actions/stripe";
+import { cn } from "~/server/utils";
 
-interface ConnectToStripeButtonProps extends ButtonProps {
+type ConnectToStripeButtonProps = {
   storeId: string;
-}
+} & ButtonProps;
 
 export function ConnectStoreToStripeButton({
   storeId,
diff --git a/src/components/content-section.tsx b/src/components/content-section.tsx
index b95dc255..bb37d551 100644
--- a/src/components/content-section.tsx
+++ b/src/components/content-section.tsx
@@ -1,19 +1,19 @@
-import * as React from "react";
-import Link from "next/link";
 import { ArrowRightIcon } from "@radix-ui/react-icons";
 import { Slot } from "@radix-ui/react-slot";
+import Link from "next/link";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { Button } from "~/components/ui/button";
+import { cn } from "~/server/utils";
 
-interface ContentSectionProps extends React.HTMLAttributes<HTMLDivElement> {
+type ContentSectionProps = {
   title: string;
   description?: string;
   href: string;
   linkText?: string;
   children: React.ReactNode;
   asChild?: boolean;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function ContentSection({
   title,
diff --git a/src/components/copy-button.tsx b/src/components/copy-button.tsx
index 0006cca1..5b297d92 100644
--- a/src/components/copy-button.tsx
+++ b/src/components/copy-button.tsx
@@ -1,7 +1,7 @@
 "use client";
 
-import * as React from "react";
 import { CheckIcon, CopyIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 
 import { Button, type ButtonProps } from "~/components/ui/button";
 
@@ -14,7 +14,9 @@ export function CopyButton({ value, ...props }: ButtonProps) {
       size="sm"
       className="absolute right-5 top-4 z-20 size-6 px-0"
       onClick={() => {
-        if (typeof window === "undefined") return;
+        if (typeof window === "undefined") {
+          return;
+        }
         setIsCopied(true);
         void window.navigator.clipboard.writeText(value?.toString() ?? "");
         setTimeout(() => {
diff --git a/src/components/dashboard/loading.tsx b/src/components/dashboard/loading.tsx
new file mode 100644
index 00000000..2c4f0cfd
--- /dev/null
+++ b/src/components/dashboard/loading.tsx
@@ -0,0 +1,44 @@
+import type { SVGProps } from "react";
+
+export function Loading({
+  width = 24,
+  height = 24,
+  dur = "0.75s",
+}: SVGProps<SVGElement>) {
+  return (
+    <svg
+      className="fill-current"
+      width={width}
+      height={height}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <circle cx="4" cy="12" r="3">
+        <animate
+          id="a"
+          begin="0;b.end-0.25s"
+          attributeName="r"
+          dur={dur}
+          values="3;.2;3"
+        />
+      </circle>
+      <circle cx="12" cy="12" r="3">
+        <animate
+          begin="a.end-0.6s"
+          attributeName="r"
+          dur={dur}
+          values="3;.2;3"
+        />
+      </circle>
+      <circle cx="20" cy="12" r="3">
+        <animate
+          id="b"
+          begin="a.end-0.45s"
+          attributeName="r"
+          dur={dur}
+          values="3;.2;3"
+        />
+      </circle>
+    </svg>
+  );
+}
diff --git a/src/components/data-table/data-table-column-header.tsx b/src/components/data-table/data-table-column-header.tsx
index da3216d1..5428898e 100644
--- a/src/components/data-table/data-table-column-header.tsx
+++ b/src/components/data-table/data-table-column-header.tsx
@@ -6,7 +6,6 @@ import {
 } from "@radix-ui/react-icons";
 import { type Column } from "@tanstack/react-table";
 
-import { cn } from "~/lib/utils";
 import { Button } from "~/components/ui/button";
 import {
   DropdownMenu,
@@ -15,12 +14,12 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
+import { cn } from "~/server/utils";
 
-interface DataTableColumnHeaderProps<TData, TValue>
-  extends React.HTMLAttributes<HTMLDivElement> {
+type DataTableColumnHeaderProps<TData, TValue> = {
   column: Column<TData, TValue>;
   title: string;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function DataTableColumnHeader<TData, TValue>({
   column,
diff --git a/src/components/data-table/data-table-faceted-filter.tsx b/src/components/data-table/data-table-faceted-filter.tsx
index 47b6eb69..22073300 100644
--- a/src/components/data-table/data-table-faceted-filter.tsx
+++ b/src/components/data-table/data-table-faceted-filter.tsx
@@ -1,8 +1,9 @@
-import type { Option } from "~/types";
-import { CheckIcon, PlusCircledIcon } from "@radix-ui/react-icons";
 import type { Column } from "@tanstack/react-table";
 
-import { cn } from "~/lib/utils";
+import { CheckIcon, PlusCircledIcon } from "@radix-ui/react-icons";
+
+import type { Option } from "~/types";
+
 import { Badge } from "~/components/ui/badge";
 import { Button } from "~/components/ui/button";
 import {
@@ -20,12 +21,13 @@ import {
   PopoverTrigger,
 } from "~/components/ui/popover";
 import { Separator } from "~/components/ui/separator";
+import { cn } from "~/server/utils";
 
-interface DataTableFacetedFilterProps<TData, TValue> {
+type DataTableFacetedFilterProps<TData, TValue> = {
   column?: Column<TData, TValue>;
   title?: string;
   options: Option[];
-}
+};
 
 export function DataTableFacetedFilter<TData, TValue>({
   column,
diff --git a/src/components/data-table/data-table-pagination.tsx b/src/components/data-table/data-table-pagination.tsx
index d09fb8e3..0124e61f 100644
--- a/src/components/data-table/data-table-pagination.tsx
+++ b/src/components/data-table/data-table-pagination.tsx
@@ -15,10 +15,10 @@ import {
   SelectValue,
 } from "~/components/ui/select";
 
-interface DataTablePaginationProps<TData> {
+type DataTablePaginationProps<TData> = {
   table: Table<TData>;
   pageSizeOptions?: number[];
-}
+};
 
 export function DataTablePagination<TData>({
   table,
diff --git a/src/components/data-table/data-table-skeleton.tsx b/src/components/data-table/data-table-skeleton.tsx
index a6f79f20..04c107c8 100644
--- a/src/components/data-table/data-table-skeleton.tsx
+++ b/src/components/data-table/data-table-skeleton.tsx
@@ -1,4 +1,3 @@
-import { cn } from "~/lib/utils";
 import { Skeleton } from "~/components/ui/skeleton";
 import {
   Table,
@@ -8,8 +7,9 @@ import {
   TableHeader,
   TableRow,
 } from "~/components/ui/table";
+import { cn } from "~/server/utils";
 
-interface DataTableSkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
+type DataTableSkeletonProps = {
   /**
    * The number of columns in the table.
    * @type number
@@ -66,7 +66,7 @@ interface DataTableSkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
    * @type boolean | undefined
    */
   shrinkZero?: boolean;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function DataTableSkeleton(props: DataTableSkeletonProps) {
   const {
diff --git a/src/components/data-table/data-table-toolbar.tsx b/src/components/data-table/data-table-toolbar.tsx
index 65638c7a..be2649d0 100644
--- a/src/components/data-table/data-table-toolbar.tsx
+++ b/src/components/data-table/data-table-toolbar.tsx
@@ -1,21 +1,22 @@
 "use client";
 
+import type { Table } from "@tanstack/react-table";
+
+import { Cross2Icon } from "@radix-ui/react-icons";
 import * as React from "react";
+
 import type { DataTableFilterField } from "~/types";
-import { Cross2Icon } from "@radix-ui/react-icons";
-import type { Table } from "@tanstack/react-table";
 
-import { cn } from "~/lib/utils";
-import { Button } from "~/components/ui/button";
-import { Input } from "~/components/ui/input";
 import { DataTableFacetedFilter } from "~/components/data-table/data-table-faceted-filter";
 import { DataTableViewOptions } from "~/components/data-table/data-table-view-options";
+import { Button } from "~/components/ui/button";
+import { Input } from "~/components/ui/input";
+import { cn } from "~/server/utils";
 
-interface DataTableToolbarProps<TData>
-  extends React.HTMLAttributes<HTMLDivElement> {
+type DataTableToolbarProps<TData> = {
   table: Table<TData>;
   filterFields?: DataTableFilterField<TData>[];
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function DataTableToolbar<TData>({
   table,
diff --git a/src/components/data-table/data-table-view-options.tsx b/src/components/data-table/data-table-view-options.tsx
index 8474bf6f..e7274c32 100644
--- a/src/components/data-table/data-table-view-options.tsx
+++ b/src/components/data-table/data-table-view-options.tsx
@@ -1,8 +1,9 @@
 "use client";
 
-import { MixerHorizontalIcon } from "@radix-ui/react-icons";
 import type { Table } from "@tanstack/react-table";
 
+import { MixerHorizontalIcon } from "@radix-ui/react-icons";
+
 import { Button } from "~/components/ui/button";
 import {
   DropdownMenu,
@@ -13,9 +14,9 @@ import {
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
 
-interface DataTableViewOptionsProps<TData> {
+type DataTableViewOptionsProps<TData> = {
   table: Table<TData>;
-}
+};
 
 export function DataTableViewOptions<TData>({
   table,
diff --git a/src/components/data-table/data-table.tsx b/src/components/data-table/data-table.tsx
index 7b875f46..4a4f3fdc 100644
--- a/src/components/data-table/data-table.tsx
+++ b/src/components/data-table/data-table.tsx
@@ -1,5 +1,5 @@
-import * as React from "react";
 import { flexRender, type Table as TanstackTable } from "@tanstack/react-table";
+import * as React from "react";
 
 import {
   Table,
@@ -12,7 +12,7 @@ import {
 
 import { DataTablePagination } from "./data-table-pagination";
 
-interface DataTableProps<TData> {
+type DataTableProps<TData> = {
   /**
    * The table instance returned from useDataTable hook with pagination, sorting, filtering, etc.
    * @type TanstackTable<TData>
@@ -26,7 +26,7 @@ interface DataTableProps<TData> {
    * @example floatingBar={<TasksTableFloatingBar table={table} />}
    */
   floatingBar?: React.ReactNode | null;
-}
+};
 
 export function DataTable<TData>({
   table,
diff --git a/src/components/date-range-picker.tsx b/src/components/date-range-picker.tsx
index 3838e433..77a1d06a 100644
--- a/src/components/date-range-picker.tsx
+++ b/src/components/date-range-picker.tsx
@@ -1,12 +1,12 @@
 "use client";
 
-import * as React from "react";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import type { DateRange } from "react-day-picker";
+
 import { CalendarIcon } from "@radix-ui/react-icons";
 import { addDays, format } from "date-fns";
-import type { DateRange } from "react-day-picker";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { Button, type ButtonProps } from "~/components/ui/button";
 import { Calendar } from "~/components/ui/calendar";
 import {
@@ -14,9 +14,9 @@ import {
   PopoverContent,
   PopoverTrigger,
 } from "~/components/ui/popover";
+import { cn } from "~/server/utils";
 
-interface DateRangePickerProps
-  extends React.ComponentPropsWithoutRef<typeof PopoverContent> {
+type DateRangePickerProps = {
   /**
    * The selected date range.
    * @default undefined
@@ -60,7 +60,7 @@ interface DateRangePickerProps
    * @type string
    */
   triggerClassName?: string;
-}
+} & React.ComponentPropsWithoutRef<typeof PopoverContent>;
 
 export function DateRangePicker({
   dateRange,
diff --git a/src/components/debounce-input.tsx b/src/components/debounce-input.tsx
index aa688d31..054757e5 100644
--- a/src/components/debounce-input.tsx
+++ b/src/components/debounce-input.tsx
@@ -2,11 +2,13 @@
 
 import * as React from "react";
 
-import { Input, type InputProps } from "~/components/ui/input";
+import { Input } from "~/components/ui/input";
 
-interface DebounceInputProps extends InputProps {
+type InputProps = React.ComponentProps<typeof Input>;
+
+type DebounceInputProps = {
   debounce?: number;
-}
+} & InputProps;
 
 export function DebounceInput({
   onChange,
diff --git a/src/components/dialog-shell.tsx b/src/components/dialog-shell.tsx
index 968d3762..0cc0bf16 100644
--- a/src/components/dialog-shell.tsx
+++ b/src/components/dialog-shell.tsx
@@ -1,14 +1,14 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
 import { Cross2Icon } from "@radix-ui/react-icons";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
-import { useClickOutside } from "~/hooks/use-click-outside";
 import { Button } from "~/components/ui/button";
+import { useClickOutside } from "~/hooks/use-click-outside";
+import { cn } from "~/server/utils";
 
-interface DialogShellProps extends React.HTMLAttributes<HTMLDivElement> {}
+type DialogShellProps = {} & React.HTMLAttributes<HTMLDivElement>;
 
 export function DialogShell({
   children,
@@ -33,7 +33,7 @@ export function DialogShell({
 
   // Close the dialog when the user clicks outside of it
   useClickOutside({
-    ref: shellRef,
+    ref: shellRef as React.RefObject<HTMLElement>,
     handler: () => {
       router.back();
     },
diff --git a/src/components/emails/newsletter-welcome-email.tsx b/src/components/emails/newsletter-welcome-email.tsx
index c2c4bdfa..294e4e83 100644
--- a/src/components/emails/newsletter-welcome-email.tsx
+++ b/src/components/emails/newsletter-welcome-email.tsx
@@ -13,13 +13,14 @@ import {
   Tailwind,
   Text,
 } from "@react-email/components";
+
 import { env } from "~/env";
 
-interface NewsletterWelcomeEmailProps {
+type NewsletterWelcomeEmailProps = {
   firstName?: string;
   fromEmail: string;
   token: string;
-}
+};
 
 const baseUrl = (env.NEXT_PUBLIC_APP_URL || "http://localhost:3000") ?? "";
 
diff --git a/src/components/empty-card.tsx b/src/components/empty-card.tsx
index 4ff3ca51..52409254 100644
--- a/src/components/empty-card.tsx
+++ b/src/components/empty-card.tsx
@@ -1,12 +1,12 @@
-import { cn } from "~/lib/utils";
-import { Card, CardDescription, CardTitle } from "~/components/ui/card";
 import { Icons } from "~/components/icons";
+import { Card, CardDescription, CardTitle } from "~/components/ui/card";
+import { cn } from "~/server/utils";
 
-interface EmptyCardProps extends React.ComponentPropsWithoutRef<typeof Card> {
+type EmptyCardProps = {
   title: string;
   description?: string;
   icon?: keyof typeof Icons;
-}
+} & React.ComponentPropsWithoutRef<typeof Card>;
 
 export function EmptyCard({
   title,
diff --git a/src/components/error-card.tsx b/src/components/error-card.tsx
index 046cf05d..fec21bc3 100644
--- a/src/components/error-card.tsx
+++ b/src/components/error-card.tsx
@@ -1,22 +1,22 @@
 "use client";
 
-import * as React from "react";
-import Link from "next/link";
 import { ExclamationTriangleIcon } from "@radix-ui/react-icons";
+import Link from "next/link";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { ClientButton } from "~/components/client-button";
 import { buttonVariants } from "~/components/ui/button";
 import { Card, CardDescription, CardTitle } from "~/components/ui/card";
-import { ClientButton } from "~/components/client-button";
+import { cn } from "~/server/utils";
 
-interface ErrorCardProps extends React.ComponentPropsWithoutRef<typeof Card> {
+type ErrorCardProps = {
   icon?: React.ComponentType<{ className?: string }>;
   title: string;
   description: string;
   retryLink?: string;
   retryLinkText?: string;
   reset?: () => void;
-}
+} & React.ComponentPropsWithoutRef<typeof Card>;
 
 export function ErrorCard({
   icon: Icon = ExclamationTriangleIcon,
@@ -30,7 +30,6 @@ export function ErrorCard({
 }: ErrorCardProps) {
   return (
     <Card
-      as="section"
       role="alert"
       aria-live="assertive"
       aria-atomic="true"
diff --git a/src/components/faceted-filter.tsx b/src/components/faceted-filter.tsx
index 28d15cc1..05d78ba6 100644
--- a/src/components/faceted-filter.tsx
+++ b/src/components/faceted-filter.tsx
@@ -1,8 +1,6 @@
-import * as React from "react";
-import { type Option } from "~/types";
 import { CheckIcon, PlusCircledIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { Badge } from "~/components/ui/badge";
 import { Button } from "~/components/ui/button";
 import {
@@ -20,13 +18,15 @@ import {
   PopoverTrigger,
 } from "~/components/ui/popover";
 import { Separator } from "~/components/ui/separator";
+import { cn } from "~/server/utils";
+import { type Option } from "~/types";
 
-interface FacetedFilterProps {
+type FacetedFilterProps = {
   title?: string;
   filterValues: string[];
   setFilterValues: React.Dispatch<React.SetStateAction<string[]>>;
   options: Option[];
-}
+};
 
 export function FacetedFilter({
   title,
diff --git a/src/components/file-uploader.tsx b/src/components/file-uploader.tsx
index 4267e45a..7a4ec5b7 100644
--- a/src/components/file-uploader.tsx
+++ b/src/components/file-uploader.tsx
@@ -1,21 +1,21 @@
 "use client";
 
-import * as React from "react";
-import Image from "next/image";
 import { Cross2Icon, UploadIcon } from "@radix-ui/react-icons";
+import Image from "next/image";
+import * as React from "react";
 import Dropzone, {
   type DropzoneProps,
   type FileRejection,
 } from "react-dropzone";
 import { toast } from "sonner";
 
-import { cn, formatBytes } from "~/lib/utils";
-import { useControllableState } from "~/hooks/use-controllable-state";
 import { Button } from "~/components/ui/button";
 import { Progress } from "~/components/ui/progress";
 import { ScrollArea } from "~/components/ui/scroll-area";
+import { useControllableState } from "~/hooks/use-controllable-state";
+import { cn, formatBytes } from "~/server/utils";
 
-interface FileUploaderProps extends React.HTMLAttributes<HTMLDivElement> {
+type FileUploaderProps = {
   /**
    * Value of the uploader.
    * @type File[]
@@ -90,7 +90,7 @@ interface FileUploaderProps extends React.HTMLAttributes<HTMLDivElement> {
    * @example disabled
    */
   disabled?: boolean;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function FileUploader(props: FileUploaderProps) {
   const {
@@ -163,7 +163,9 @@ export function FileUploader(props: FileUploaderProps) {
   );
 
   function onRemove(index: number) {
-    if (!files) return;
+    if (!files) {
+      return;
+    }
     const newFiles = files.filter((_, i) => i !== index);
     setFiles(newFiles);
     onValueChange?.(newFiles);
@@ -172,7 +174,9 @@ export function FileUploader(props: FileUploaderProps) {
   // Revoke preview url when component unmounts
   React.useEffect(() => {
     return () => {
-      if (!files) return;
+      if (!files) {
+        return;
+      }
       files.forEach((file) => {
         if (isFileWithPreview(file)) {
           URL.revokeObjectURL(file.preview);
@@ -263,11 +267,11 @@ export function FileUploader(props: FileUploaderProps) {
   );
 }
 
-interface FileCardProps {
+type FileCardProps = {
   file: File;
   onRemove: () => void;
   progress?: number;
-}
+};
 
 function FileCard({ file, progress, onRemove }: FileCardProps) {
   return (
diff --git a/src/components/files.tsx b/src/components/files.tsx
index b10dee7e..2757da6a 100644
--- a/src/components/files.tsx
+++ b/src/components/files.tsx
@@ -1,6 +1,8 @@
 import Image from "next/image";
+
 import type { StoredFile } from "~/types";
 
+import { EmptyCard } from "~/components/empty-card";
 import {
   Card,
   CardContent,
@@ -9,11 +11,10 @@ import {
   CardTitle,
 } from "~/components/ui/card";
 import { ScrollArea, ScrollBar } from "~/components/ui/scroll-area";
-import { EmptyCard } from "~/components/empty-card";
 
-interface FilesProps {
+type FilesProps = {
   files: StoredFile[];
-}
+};
 
 export function Files({ files }: FilesProps) {
   return (
diff --git a/src/components/grid-pattern.tsx b/src/components/grid-pattern.tsx
index 818e2911..6cb2ce6a 100644
--- a/src/components/grid-pattern.tsx
+++ b/src/components/grid-pattern.tsx
@@ -1,12 +1,12 @@
 import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
-interface GridPatternProps extends React.SVGProps<SVGSVGElement> {
+type GridPatternProps = {
   squares?: [x: number, y: number][];
   width?: number;
   height?: number;
-}
+} & React.SVGProps<SVGSVGElement>;
 
 export function GridPattern({
   width = 40,
diff --git a/src/components/i18n/ExternalLink.tsx b/src/components/i18n/ExternalLink.tsx
new file mode 100644
index 00000000..fd5895d6
--- /dev/null
+++ b/src/components/i18n/ExternalLink.tsx
@@ -0,0 +1,21 @@
+type Props = {
+  title: string;
+  description: string;
+  href: string;
+};
+
+export default function ExternalLink({ description, href, title }: Props) {
+  return (
+    <a
+      className="inline-block rounded-md border border-gray-700 p-8 transition-colors hover:border-gray-400"
+      href={href}
+      rel="noreferrer"
+      target="_blank"
+    >
+      <p className="text-xl font-semibold text-white">
+        {title} <span className="ml-2 inline-block">→</span>
+      </p>
+      <p className="mt-2 max-w-[250px] text-gray-400">{description}</p>
+    </a>
+  );
+}
diff --git a/src/components/i18n/IntlPageLayout.tsx b/src/components/i18n/IntlPageLayout.tsx
new file mode 100644
index 00000000..e589532f
--- /dev/null
+++ b/src/components/i18n/IntlPageLayout.tsx
@@ -0,0 +1,43 @@
+import type { ReactNode } from "react";
+
+import { useTranslations } from "next-intl";
+
+import ExternalLink from "~/components/i18n/ExternalLink";
+
+type IntlPageLayoutProps = {
+  children?: ReactNode;
+  title: ReactNode;
+};
+
+export default function IntlPageLayout({
+  children,
+  title,
+}: IntlPageLayoutProps) {
+  const t = useTranslations("PageLayout");
+
+  return (
+    <div className="relative flex grow flex-col bg-slate-850 py-36">
+      <div className="absolute inset-0 overflow-hidden">
+        <div className="absolute left-0 top-1 size-[20500px] translate-x-[-47.5%] rounded-full bg-gradient-to-b from-slate-900 via-cyan-500" />
+      </div>
+      <div className="container relative flex grow flex-col px-4">
+        <h1 className="text-3xl font-semibold leading-tight tracking-tight text-white md:text-5xl">
+          {title}
+        </h1>
+        <div className="mt-6 text-gray-400 md:text-lg">{children}</div>
+        <div className="mt-auto grid grid-cols-1 gap-4 pt-20 md:grid-cols-2 lg:gap-12">
+          <ExternalLink
+            description={t("links.docs.description")}
+            href={t("links.docs.href")}
+            title={t("links.docs.title")}
+          />
+          <ExternalLink
+            description={t("links.source.description")}
+            href={t("links.source.href")}
+            title={t("links.source.title")}
+          />
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/layouts/LocaleSwitcher.tsx b/src/components/i18n/LocaleSwitcher.tsx
similarity index 64%
rename from src/components/layouts/LocaleSwitcher.tsx
rename to src/components/i18n/LocaleSwitcher.tsx
index fbb3d399..bc8fdade 100644
--- a/src/components/layouts/LocaleSwitcher.tsx
+++ b/src/components/i18n/LocaleSwitcher.tsx
@@ -1,16 +1,12 @@
 "use client";
 
-import type { Locale } from "~/i18n/routing";
-
 import type { FC, MouseEvent } from "react";
-import { Fragment, useState } from "react";
-
-import { usePathname, routing } from "~/i18n/routing";
 
+import { useLocale } from "next-intl";
 import Link from "next/link";
+import { Fragment, useState } from "react";
 
-import { labels, localeFlags } from "~/i18n/routing";
-import { useLocale, useTranslations } from "next-intl";
+import type { Locale } from "~/i18n/locales";
 
 import { Button, buttonVariants } from "~/components/ui/button";
 import {
@@ -21,7 +17,9 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
-import { cn } from "~/lib/utils";
+import { labels, localeFlags } from "~/i18n/locales";
+import { usePathname, routing } from "~/i18n/routing";
+import { cn } from "~/server/utils";
 
 const TRANSLATED = "⚙️ Translated";
 const NATIVE = "⚙️ Native";
@@ -30,7 +28,7 @@ const LANGUAGE_LABEL = "Language";
 export function LocaleSwitcher() {
   const pathname = usePathname();
   const locale = useLocale() as Locale;
-  const [translateLanguages, setTranslateLanguages] = useState(false);
+  const [translateLanguages, setTranslateLanguages] = useState(true);
 
   const filteredLocales = routing.locales.filter(
     (currentLocale) => currentLocale !== locale,
@@ -41,11 +39,10 @@ export function LocaleSwitcher() {
     setTranslateLanguages(!translateLanguages);
   };
 
-  // Helper function to strip current locale from pathname
   const getPathWithoutLocale = () => {
     const regex = new RegExp(`^/(${routing.locales.join("|")})`);
-
-    return pathname.replace(regex, ""); // Remove the locale part from the current pathname
+    // Remove the locale part from the current pathname
+    return pathname.replace(regex, "");
   };
 
   return (
@@ -53,18 +50,20 @@ export function LocaleSwitcher() {
       <DropdownMenuTrigger
         className={cn(
           buttonVariants({
-            size: "sm",
+            size: "icon",
             variant: "outline",
           }),
           "font-twemoji",
         )}
       >
+        <span className="sr-only">Language Switcher</span>
         <LocaleNames
           currentLocale={locale}
           translateLanguages={translateLanguages}
-          hideNamesOnSpecificBreakpoints
+          displayOnlyFlag={true}
         />
       </DropdownMenuTrigger>
+
       <DropdownMenuContent align="start">
         <DropdownMenuLabel>{LANGUAGE_LABEL}</DropdownMenuLabel>
         <DropdownMenuSeparator />
@@ -82,17 +81,14 @@ export function LocaleSwitcher() {
         {filteredLocales.map((currentLocale, index) => (
           <Fragment key={index}>
             <Link
-              href={`/${currentLocale}${getPathWithoutLocale()}`} // Correctly prepend the new locale
+              href={`/${currentLocale}${getPathWithoutLocale()}`}
               locale={currentLocale}
             >
-              <DropdownMenuItem
-                className={`
-          font-twemoji flex cursor-pointer items-center justify-start
-        `}
-              >
+              <DropdownMenuItem className="font-twemoji flex cursor-pointer items-center justify-start">
                 <LocaleNames
                   currentLocale={currentLocale}
                   translateLanguages={translateLanguages}
+                  displayOnlyFlag={false}
                 />
               </DropdownMenuItem>
             </Link>
@@ -106,58 +102,46 @@ export function LocaleSwitcher() {
 const determinateLocaleLabels = (translateLanguages: boolean) => {
   if (translateLanguages) {
     return {
-      "de-DE": "Deutsch",
-      "en-US": "English",
-      "es-ES": "Español",
-      "fr-FR": "Français",
-      "hi-IN": "हिन्दी",
-      "it-IT": "Italiano",
-      "ms-MY": "Melayu",
-      "pl-PL": "Polski",
-      "tr-TR": "Türkçe",
-      "uk-UA": "Українська",
-      "zh-CN": "中文",
+      de: "Deutsch",
+      en: "English",
+      es: "Español",
+      fr: "Français",
+      hi: "हिन्दी",
+      it: "Italiano",
+      ms: "Melayu",
+      pl: "Polski",
+      tr: "Türkçe",
+      uk: "Українська",
+      zh: "中文",
     } as const;
   }
 
   return labels;
 };
 
-interface LocaleNamesProps {
+type LocaleNamesProps = {
   currentLocale: Locale;
-  hideNamesOnSpecificBreakpoints?: boolean;
   translateLanguages: boolean;
-}
+  displayOnlyFlag: boolean;
+};
 
 const LocaleNames: FC<LocaleNamesProps> = ({
   currentLocale,
-  hideNamesOnSpecificBreakpoints,
   translateLanguages,
+  displayOnlyFlag,
 }) => {
-  const t = useTranslations();
   const localeLabels = determinateLocaleLabels(translateLanguages);
 
   return (
     <div className="flex items-center space-x-2">
-      <span aria-hidden="true">{localeFlags[currentLocale]}</span>
-      {hideNamesOnSpecificBreakpoints ? (
-        <span
-          className={`
-            hidden
-
-            md:flex
-
-            lg:hidden
-
-            2xl:flex
-          `}
-        >
-          {localeLabels[currentLocale]}
-        </span>
+      {displayOnlyFlag ? (
+        <span aria-hidden="true">{localeFlags[currentLocale]}</span>
       ) : (
-        <span>{localeLabels[currentLocale]}</span>
+        <>
+          <span aria-hidden="true">{localeFlags[currentLocale]}</span>
+          <span>{localeLabels[currentLocale]}</span>
+        </>
       )}
-      <span className="sr-only">{t("LocaleSwitcher.languages")}</span>
     </div>
   );
 };
diff --git a/src/components/icons.tsx b/src/components/icons.tsx
index fc306ead..a9ab6d0c 100644
--- a/src/components/icons.tsx
+++ b/src/components/icons.tsx
@@ -1,3 +1,6 @@
+export type Icons = {
+  logo: React.ComponentType<React.SVGProps<SVGSVGElement>>;
+};
 import {
   AvatarIcon,
   ChevronLeftIcon,
@@ -89,7 +92,10 @@ export const Icons = {
       xmlns="http://www.w3.org/2000/svg"
       {...props}
     >
-      <path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z" />
+      <path
+        fill="currentColor"
+        d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z"
+      />
     </svg>
   ),
   facebook: ({ ...props }: IconProps) => (
diff --git a/src/components/join-newsletter-form.tsx b/src/components/join-newsletter-form.tsx
index c51cc8f9..b7a444e8 100644
--- a/src/components/join-newsletter-form.tsx
+++ b/src/components/join-newsletter-form.tsx
@@ -1,13 +1,13 @@
 "use client";
 
-import * as React from "react";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { PaperPlaneIcon } from "@radix-ui/react-icons";
+import { ofetch } from "ofetch";
+import * as React from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 
-import { unknownError } from "~/lib/constants";
-import { emailSchema, type EmailSchema } from "~/lib/validations/notification";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -18,7 +18,11 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Input } from "~/components/ui/input";
-import { Icons } from "~/components/icons";
+import { unknownError } from "~/server/constants";
+import {
+  emailSchema,
+  type EmailSchema,
+} from "~/server/validations/notification";
 
 export function JoinNewsletterForm() {
   const [loading, setLoading] = React.useState(false);
@@ -34,7 +38,7 @@ export function JoinNewsletterForm() {
   async function onSubmit(data: EmailSchema) {
     setLoading(true);
     try {
-      const response = await fetch("/api/email/newsletter", {
+      const response = await ofetch("/api/email/newsletter", {
         method: "POST",
         body: JSON.stringify({
           email: data.email,
diff --git a/src/components/kbd.tsx b/src/components/kbd.tsx
index 37adfd30..41859fba 100644
--- a/src/components/kbd.tsx
+++ b/src/components/kbd.tsx
@@ -1,7 +1,7 @@
-import * as React from "react";
 import { cva, type VariantProps } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const kbdVariants = cva(
   "select-none rounded border px-1.5 py-px font-mono text-[0.7rem] font-normal shadow-sm disabled:opacity-50",
@@ -18,9 +18,7 @@ const kbdVariants = cva(
   },
 );
 
-export interface KbdProps
-  extends React.ComponentPropsWithoutRef<"kbd">,
-    VariantProps<typeof kbdVariants> {
+export type KbdProps = {
   /**
    * The title of the `abbr` element inside the `kbd` element.
    * @default undefined
@@ -28,7 +26,8 @@ export interface KbdProps
    * @example title="Command"
    */
   abbrTitle?: string;
-}
+} & React.ComponentPropsWithoutRef<"kbd"> &
+  VariantProps<typeof kbdVariants>;
 
 const Kbd = React.forwardRef<HTMLUnknownElement, KbdProps>(
   ({ abbrTitle, children, className, variant, ...props }, ref) => {
diff --git a/src/components/layouts/auth-dropdown.tsx b/src/components/layouts/auth-dropdown.tsx
index 4f5507de..9367d210 100644
--- a/src/components/layouts/auth-dropdown.tsx
+++ b/src/components/layouts/auth-dropdown.tsx
@@ -1,10 +1,11 @@
-import * as React from "react";
-import Link from "next/link";
 import type { User } from "@clerk/nextjs/server";
+
 import { DashboardIcon, ExitIcon, GearIcon } from "@radix-ui/react-icons";
+import { eq } from "drizzle-orm";
+import Link from "next/link";
+import * as React from "react";
 
-import { getStoreByUserId } from "~/lib/queries/store";
-import { cn, getUserEmail } from "~/lib/utils";
+import { Icons } from "~/components/icons";
 import { Avatar, AvatarFallback, AvatarImage } from "~/components/ui/avatar";
 import { Button, type ButtonProps } from "~/components/ui/button";
 import {
@@ -18,30 +19,39 @@ import {
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Icons } from "~/components/icons";
-import { db } from "~/db";
-import { usersTable } from "~/db/schema";
-import { eq } from "drizzle-orm";
+import { db } from "~/server/db";
+import { usersTable } from "~/server/db/schema";
+import { getStoreByUserId } from "~/server/queries/store";
+import { cn, getUserEmail } from "~/server/utils";
 
-interface AuthDropdownProps
-  extends React.ComponentPropsWithRef<typeof DropdownMenuTrigger>,
-    ButtonProps {
+type AuthDropdownProps = {
   user: User | null;
-}
+} & React.ComponentPropsWithRef<typeof DropdownMenuTrigger> &
+  ButtonProps;
 
-export async function AuthDropdown({
-  user,
-  className,
-  ...props
-}: AuthDropdownProps) {
+export async function AuthDropdown({ user, ...props }: AuthDropdownProps) {
   if (!user) {
     return (
-      <Button size="sm" className={cn(className)} {...props} asChild>
-        <Link href="/signin">
-          Sign In
-          <span className="sr-only">Sign In</span>
-        </Link>
-      </Button>
+      <>
+        <div className="flex items-center gap-2 sm:hidden">
+          <Button size="sm" variant="default" {...props} asChild>
+            <Link href="/signin">
+              Sign In<span className="sr-only">Sign In</span>
+            </Link>
+          </Button>
+        </div>
+
+        <div className="hidden items-center gap-2 sm:flex">
+          <Button size="sm" variant="outline" {...props} asChild>
+            <Link href="/signin">
+              Sign In<span className="sr-only">Sign In</span>
+            </Link>
+          </Button>
+          <Button size="sm" variant="default" {...props} asChild>
+            <Link href="/signup">Sign Up</Link>
+          </Button>
+        </div>
+      </>
     );
   }
 
@@ -63,11 +73,7 @@ export async function AuthDropdown({
   return (
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
-        <Button
-          variant="secondary"
-          className={cn("size-8 rounded-full", className)}
-          {...props}
-        >
+        <Button variant="outline" className="size-8 rounded-full" {...props}>
           <Avatar className="size-8">
             <AvatarImage src={user.imageUrl} alt={user.username ?? ""} />
             <AvatarFallback>{initials}</AvatarFallback>
@@ -113,10 +119,10 @@ export async function AuthDropdown({
   );
 }
 
-interface AuthDropdownGroupProps {
+type AuthDropdownGroupProps = {
   storePromise: ReturnType<typeof getStoreByUserId>;
   currentStoreId?: string;
-}
+};
 
 async function AuthDropdownGroup({
   storePromise,
diff --git a/src/components/layouts/main-nav.tsx b/src/components/layouts/main-nav.tsx
index f7135527..4eff9726 100644
--- a/src/components/layouts/main-nav.tsx
+++ b/src/components/layouts/main-nav.tsx
@@ -1,11 +1,11 @@
 "use client";
 
-import * as React from "react";
 import Link from "next/link";
+import * as React from "react";
+
 import type { MainNavItem } from "~/types";
 
-import { siteConfig } from "~/config/site";
-import { cn } from "~/lib/utils";
+import { Icons } from "~/components/icons";
 import {
   NavigationMenu,
   NavigationMenuContent,
@@ -15,11 +15,12 @@ import {
   NavigationMenuTrigger,
   navigationMenuTriggerStyle,
 } from "~/components/ui/navigation-menu";
-import { Icons } from "~/components/icons";
+import { siteConfig } from "~/config/site";
+import { cn } from "~/server/utils";
 
-interface MainNavProps {
+type MainNavProps = {
   items?: MainNavItem[];
-}
+};
 
 export function MainNav({ items }: MainNavProps) {
   return (
diff --git a/src/components/layouts/mobile-nav.tsx b/src/components/layouts/mobile-nav.tsx
index 52d8cd5c..1093a642 100644
--- a/src/components/layouts/mobile-nav.tsx
+++ b/src/components/layouts/mobile-nav.tsx
@@ -1,13 +1,12 @@
 "use client";
 
-import * as React from "react";
 import Link from "next/link";
 import { useSelectedLayoutSegment } from "next/navigation";
+import * as React from "react";
+
 import type { MainNavItem } from "~/types";
 
-import { siteConfig } from "~/config/site";
-import { cn } from "~/lib/utils";
-import { useMediaQuery } from "~/hooks/use-media-query";
+import { Icons } from "~/components/icons";
 import {
   Accordion,
   AccordionContent,
@@ -23,18 +22,22 @@ import {
   SheetTitle,
   SheetTrigger,
 } from "~/components/ui/sheet";
-import { Icons } from "~/components/icons";
+import { siteConfig } from "~/config/site";
+import { useMediaQuery } from "~/hooks/use-media-query";
+import { cn } from "~/server/utils";
 
-interface MobileNavProps {
+type MobileNavProps = {
   items?: MainNavItem[];
-}
+};
 
 export function MobileNav({ items }: MobileNavProps) {
   const isDesktop = useMediaQuery("(min-width: 1024px)");
   const segment = useSelectedLayoutSegment();
   const [open, setOpen] = React.useState(false);
 
-  if (isDesktop) return null;
+  if (isDesktop) {
+    return null;
+  }
 
   return (
     <Sheet open={open} onOpenChange={setOpen}>
@@ -108,13 +111,12 @@ export function MobileNav({ items }: MobileNavProps) {
   );
 }
 
-interface MobileLinkProps
-  extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+type MobileLinkProps = {
   href: string;
   disabled?: boolean;
   segment: string;
   setOpen: React.Dispatch<React.SetStateAction<boolean>>;
-}
+} & React.AnchorHTMLAttributes<HTMLAnchorElement>;
 
 function MobileLink({
   children,
diff --git a/src/components/layouts/navigation.tsx b/src/components/layouts/navigation.tsx
new file mode 100644
index 00000000..22fa1c7b
--- /dev/null
+++ b/src/components/layouts/navigation.tsx
@@ -0,0 +1,271 @@
+"use client";
+
+import Link from "next/link";
+import { useSelectedLayoutSegment } from "next/navigation";
+import * as React from "react";
+
+import type { MainNavItem } from "~/types";
+
+import { Icons } from "~/components/icons";
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+} from "~/components/ui/accordion";
+import { Button } from "~/components/ui/button";
+import {
+  NavigationMenu,
+  NavigationMenuContent,
+  NavigationMenuItem,
+  NavigationMenuLink,
+  NavigationMenuList,
+  NavigationMenuTrigger,
+  navigationMenuTriggerStyle,
+} from "~/components/ui/navigation-menu";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import {
+  Sheet,
+  SheetContent,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger,
+} from "~/components/ui/sheet";
+import { siteConfig } from "~/config/site";
+import { useMediaQuery } from "~/hooks/use-media-query";
+import { cn } from "~/server/utils";
+
+// ListItem component for NavigationMenu
+const ListItem = React.forwardRef<
+  React.ComponentRef<"a">,
+  React.ComponentPropsWithoutRef<"a"> & { title: string }
+>(({ className, title, children, href, ...props }, ref) => {
+  return (
+    <li>
+      <NavigationMenuLink asChild>
+        <Link
+          ref={ref}
+          href={String(href)}
+          className={cn(
+            "block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
+            className,
+          )}
+          {...props}
+        >
+          <div className="text-sm font-medium leading-none">{title}</div>
+          <p className="line-clamp-2 text-sm leading-snug text-muted-foreground">
+            {children}
+          </p>
+        </Link>
+      </NavigationMenuLink>
+    </li>
+  );
+});
+ListItem.displayName = "ListItem";
+
+// MobileLink component for Mobile Navigation
+type MobileLinkProps = {
+  href: string;
+  disabled?: boolean;
+  segment: string;
+  setOpen: React.Dispatch<React.SetStateAction<boolean>>;
+} & React.AnchorHTMLAttributes<HTMLAnchorElement>;
+
+function MobileLink({
+  children,
+  href,
+  disabled,
+  segment,
+  setOpen,
+  className,
+  ...props
+}: MobileLinkProps) {
+  return (
+    <Link
+      href={href}
+      className={cn(
+        "text-foreground/70 transition-colors hover:text-foreground",
+        href.includes(segment) && "text-foreground",
+        disabled && "pointer-events-none opacity-60",
+        className,
+      )}
+      onClick={() => {
+        setOpen(false);
+      }}
+      {...props}
+    >
+      {children}
+    </Link>
+  );
+}
+
+// Main Navigation Component
+type NavigationProps = {
+  items?: MainNavItem[];
+};
+
+export function Navigation({ items }: NavigationProps) {
+  const isDesktop = useMediaQuery("(min-width: 1024px)");
+  const segment = useSelectedLayoutSegment();
+  const [open, setOpen] = React.useState(false);
+
+  return (
+    <nav className="flex items-center justify-between p-4">
+      {/* Desktop Navigation */}
+      {isDesktop ? (
+        <NavigationMenu>
+          <NavigationMenuList>
+            {items?.[0]?.items ? (
+              <NavigationMenuItem>
+                <NavigationMenuTrigger className="h-auto">
+                  {items[0].title}
+                </NavigationMenuTrigger>
+                <NavigationMenuContent>
+                  <ul className="grid gap-3 p-6 md:w-[400px] lg:w-[500px] lg:grid-cols-2 lg:grid-rows-1">
+                    {/* Left Column */}
+                    <li className="flex flex-col justify-between row-span-full">
+                      <NavigationMenuLink asChild>
+                        <Link
+                          href="/"
+                          className="flex h-full w-full select-none flex-col justify-end rounded-md bg-gradient-to-b from-muted/50 to-muted p-6 no-underline outline-none focus:shadow-md"
+                        >
+                          <Icons.logo className="h-6 w-6" aria-hidden="true" />
+                          <div className="mb-2 mt-4 text-lg font-medium">
+                            {siteConfig.name}
+                          </div>
+                          <p className="text-sm leading-tight text-muted-foreground">
+                            {siteConfig.description}
+                          </p>
+                          <span className="sr-only">Home</span>
+                        </Link>
+                      </NavigationMenuLink>
+                    </li>
+
+                    {/* Right Column */}
+                    <div className="flex flex-col space-y-3">
+                      {items[0].items.map((item) => (
+                        <ListItem
+                          key={item.title}
+                          title={item.title}
+                          href={item.href}
+                        >
+                          {item.description}
+                        </ListItem>
+                      ))}
+                    </div>
+                  </ul>
+                </NavigationMenuContent>
+              </NavigationMenuItem>
+            ) : null}
+            {items
+              ?.filter((item) => item.title !== items[0]?.title)
+              .map((item) =>
+                item.items ? (
+                  <NavigationMenuItem key={item.title}>
+                    <NavigationMenuTrigger className="h-auto capitalize">
+                      {item.title}
+                    </NavigationMenuTrigger>
+                    <NavigationMenuContent>
+                      <ul className="grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2 lg:w-[600px]">
+                        {item.items.map((sub) => (
+                          <ListItem
+                            key={sub.title}
+                            title={sub.title}
+                            href={sub.href}
+                          >
+                            {sub.description}
+                          </ListItem>
+                        ))}
+                      </ul>
+                    </NavigationMenuContent>
+                  </NavigationMenuItem>
+                ) : (
+                  item.href && (
+                    <NavigationMenuItem key={item.title}>
+                      <Link href={item.href} legacyBehavior passHref>
+                        <NavigationMenuLink
+                          className={cn(navigationMenuTriggerStyle(), "h-auto")}
+                        >
+                          {item.title}
+                        </NavigationMenuLink>
+                      </Link>
+                    </NavigationMenuItem>
+                  )
+                ),
+              )}
+          </NavigationMenuList>
+        </NavigationMenu>
+      ) : (
+        /* Mobile Navigation */
+        <Sheet open={open} onOpenChange={setOpen}>
+          <SheetTrigger asChild>
+            <Button
+              variant="ghost"
+              size="icon"
+              className="h-8 w-8 hover:bg-transparent focus-visible:bg-transparent focus-visible:ring-0 focus-visible:ring-offset-0"
+            >
+              <Icons.menu aria-hidden="true" />
+              <span className="sr-only">Toggle Menu</span>
+            </Button>
+          </SheetTrigger>
+          <SheetContent side="left" className="pl-1 pr-0 pt-9">
+            <SheetHeader className="px-1 sr-only">
+              <SheetTitle>Menu</SheetTitle>
+            </SheetHeader>
+            <div className="w-full px-7 mb-4">
+              <Link
+                href="/"
+                className="flex items-center"
+                onClick={() => {
+                  setOpen(false);
+                }}
+              >
+                <Icons.logo className="mr-2 h-6 w-6" aria-hidden="true" />
+                <span className="font-bold text-lg">{siteConfig.name}</span>
+                <span className="sr-only">Home</span>
+              </Link>
+            </div>
+            <ScrollArea className="my-4 h-[calc(100vh-8rem)] pb-10 pl-6">
+              <div className="pl-1 pr-7">
+                <Accordion type="multiple" className="w-full">
+                  {items?.map((item, index) => (
+                    <AccordionItem value={item.title} key={index}>
+                      <AccordionTrigger className="text-sm capitalize">
+                        {item.title}
+                      </AccordionTrigger>
+                      <AccordionContent>
+                        <div className="flex flex-col space-y-2">
+                          {item.items?.map((subItem, i) =>
+                            subItem.href ? (
+                              <MobileLink
+                                key={i}
+                                href={String(subItem.href)}
+                                segment={String(segment)}
+                                setOpen={setOpen}
+                                disabled={subItem.disabled}
+                                className="m-1"
+                              >
+                                {subItem.title}
+                              </MobileLink>
+                            ) : (
+                              <div
+                                key={i}
+                                className="text-foreground/70 transition-colors"
+                              >
+                                {subItem.title}
+                              </div>
+                            ),
+                          )}
+                        </div>
+                      </AccordionContent>
+                    </AccordionItem>
+                  ))}
+                </Accordion>
+              </div>
+            </ScrollArea>
+          </SheetContent>
+        </Sheet>
+      )}
+    </nav>
+  );
+}
diff --git a/src/components/layouts/sidebar-nav.tsx b/src/components/layouts/sidebar-nav.tsx
index 1826956d..d91da389 100644
--- a/src/components/layouts/sidebar-nav.tsx
+++ b/src/components/layouts/sidebar-nav.tsx
@@ -1,20 +1,23 @@
 "use client";
 
 import Link from "next/link";
+
 import type { SidebarNavItem } from "~/types";
 
-import { cn } from "~/lib/utils";
 import { Icons } from "~/components/icons";
 import { useSidebar } from "~/components/layouts/sidebar-provider";
+import { cn } from "~/server/utils";
 
-export interface SidebarNavProps extends React.HTMLAttributes<HTMLDivElement> {
+export type SidebarNavProps = {
   items: SidebarNavItem[];
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function SidebarNav({ items, className, ...props }: SidebarNavProps) {
   const { open, setOpen } = useSidebar();
 
-  if (!items.length) return null;
+  if (!items.length) {
+    return null;
+  }
 
   return (
     <div
@@ -44,7 +47,9 @@ export function SidebarNav({ items, className, ...props }: SidebarNavProps) {
             target={item.external ? "_blank" : ""}
             rel={item.external ? "noreferrer" : ""}
             onClick={() => {
-              if (open) setOpen(false);
+              if (open) {
+                setOpen(false);
+              }
             }}
           >
             <span
diff --git a/src/components/layouts/sidebar-provider.tsx b/src/components/layouts/sidebar-provider.tsx
index 4f88f944..5b928fea 100644
--- a/src/components/layouts/sidebar-provider.tsx
+++ b/src/components/layouts/sidebar-provider.tsx
@@ -2,10 +2,10 @@
 
 import * as React from "react";
 
-interface SidebarContextProps {
+type SidebarContextProps = {
   open: boolean;
   setOpen: React.Dispatch<React.SetStateAction<boolean>>;
-}
+};
 
 const SidebarContext = React.createContext<SidebarContextProps>({
   open: false,
diff --git a/src/components/layouts/site-footer.tsx b/src/components/layouts/site-footer.tsx
index 332900fc..a2068f5b 100644
--- a/src/components/layouts/site-footer.tsx
+++ b/src/components/layouts/site-footer.tsx
@@ -1,12 +1,12 @@
 import Link from "next/link";
 
-import { siteConfig } from "~/config/site";
-import { cn } from "~/lib/utils";
-import { buttonVariants } from "~/components/ui/button";
 import { Icons } from "~/components/icons";
 import { JoinNewsletterForm } from "~/components/join-newsletter-form";
 import { ModeToggle } from "~/components/layouts/mode-toggle";
 import { Shell } from "~/components/shell";
+import { buttonVariants } from "~/components/ui/button";
+import { siteConfig } from "~/config/site";
+import { cn } from "~/server/utils";
 
 export function SiteFooter() {
   return (
diff --git a/src/components/layouts/site-header.tsx b/src/components/layouts/site-header.tsx
deleted file mode 100644
index c99608d2..00000000
--- a/src/components/layouts/site-header.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import type { User } from "@clerk/nextjs/server";
-
-import { siteConfig } from "~/config/site";
-import { CartSheet } from "~/components/checkout/cart-sheet";
-import { AuthDropdown } from "~/components/layouts/auth-dropdown";
-import { MainNav } from "~/components/layouts/main-nav";
-import { MobileNav } from "~/components/layouts/mobile-nav";
-import { ProductsCombobox } from "~/components/products-combobox";
-import { LocaleSwitcher } from "~/components/layouts/LocaleSwitcher";
-import { ModeToggle } from "~/components/layouts/mode-toggle";
-
-interface SiteHeaderProps {
-  user: User | null;
-}
-
-export function SiteHeader({ user }: SiteHeaderProps) {
-  return (
-    <header className="sticky top-0 z-50 w-full border-b bg-background">
-      <div className="container flex h-16 items-center">
-        <MainNav items={siteConfig.mainNav} />
-        <MobileNav items={siteConfig.mainNav} />
-        <div className="flex flex-1 items-center justify-end space-x-4">
-          <nav className="flex items-center space-x-2">
-            <ModeToggle />
-            <ProductsCombobox />
-            <CartSheet />
-            <LocaleSwitcher />
-            <AuthDropdown user={user} />
-          </nav>
-        </div>
-      </div>
-    </header>
-  );
-}
diff --git a/src/components/loading-button.tsx b/src/components/loading-button.tsx
index f4aa4ff3..3795cb41 100644
--- a/src/components/loading-button.tsx
+++ b/src/components/loading-button.tsx
@@ -3,19 +3,19 @@
 import * as React from "react";
 import { useFormStatus } from "react-dom";
 
-import { cn } from "~/lib/utils";
-import { useMounted } from "~/hooks/use-mounted";
+import { Icons } from "~/components/icons";
 import {
   Button,
   buttonVariants,
   type ButtonProps,
 } from "~/components/ui/button";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Icons } from "~/components/icons";
+import { useMounted } from "~/hooks/use-mounted";
+import { cn } from "~/server/utils";
 
-interface LoadingButtonProps extends ButtonProps {
+type LoadingButtonProps = {
   action: string;
-}
+} & ButtonProps;
 
 const LoadingButton = React.forwardRef<HTMLButtonElement, LoadingButtonProps>(
   ({ children, className, variant, size, action, ...props }, ref) => {
@@ -24,7 +24,7 @@ const LoadingButton = React.forwardRef<HTMLButtonElement, LoadingButtonProps>(
     const [update, setUpdate] = React.useState(false);
     const mounted = useMounted();
 
-    if (!mounted)
+    if (!mounted) {
       return (
         <Skeleton
           className={cn(
@@ -35,6 +35,7 @@ const LoadingButton = React.forwardRef<HTMLButtonElement, LoadingButtonProps>(
           {children}
         </Skeleton>
       );
+    }
 
     return (
       <Button
diff --git a/src/app/[locale]/(lobby)/_components/lobby-skeleton.tsx b/src/components/lobby-skeleton.tsx
similarity index 97%
rename from src/app/[locale]/(lobby)/_components/lobby-skeleton.tsx
rename to src/components/lobby-skeleton.tsx
index d5221bba..b19ca81f 100644
--- a/src/app/[locale]/(lobby)/_components/lobby-skeleton.tsx
+++ b/src/components/lobby-skeleton.tsx
@@ -1,8 +1,5 @@
 import Link from "next/link";
 
-import { cn } from "~/lib/utils";
-import { buttonVariants } from "~/components/ui/button";
-import { Skeleton } from "~/components/ui/skeleton";
 import { ContentSection } from "~/components/content-section";
 import {
   PageActions,
@@ -13,6 +10,9 @@ import {
 import { ProductCardSkeleton } from "~/components/product-card-skeleton";
 import { Shell } from "~/components/shell";
 import { StoreCardSkeleton } from "~/components/store-card-skeleton";
+import { buttonVariants } from "~/components/ui/button";
+import { Skeleton } from "~/components/ui/skeleton";
+import { cn } from "~/server/utils";
 
 import { CategoryCardSkeleton } from "./category-card-skeleton";
 
@@ -36,8 +36,8 @@ export function LobbySkeleton() {
           className="max-w-[46.875rem] animate-fade-up"
           style={{ animationDelay: "0.30s", animationFillMode: "both" }}
         >
-          Relivator Enhances your eCommerce with the Power of Next.js 15, React,
-          Tailwind, and more
+          Relivator Enhances your eCommerce with the Power of Next.js 15, React
+          19, Tailwind, and more
         </PageHeaderDescription>
         <PageActions
           className="animate-fade-up"
diff --git a/src/app/[locale]/(lobby)/_components/lobby.tsx b/src/components/lobby.tsx
similarity index 92%
rename from src/app/[locale]/(lobby)/_components/lobby.tsx
rename to src/components/lobby.tsx
index 635cc323..166e1602 100644
--- a/src/app/[locale]/(lobby)/_components/lobby.tsx
+++ b/src/components/lobby.tsx
@@ -1,12 +1,11 @@
+import { getTranslations } from "next-intl/server";
 import Link from "next/link";
 
-import { siteConfig } from "~/config/site";
-import { type getGithubStars } from "~/lib/queries/github";
-import type { getCategories, getFeaturedProducts } from "~/lib/queries/product";
-import { type getFeaturedStores } from "~/lib/queries/store";
-import { cn } from "~/lib/utils";
-import { Badge } from "~/components/ui/badge";
-import { buttonVariants } from "~/components/ui/button";
+import type {
+  getCategories,
+  getFeaturedProducts,
+} from "~/server/queries/product";
+
 import { ContentSection } from "~/components/content-section";
 import { Icons } from "~/components/icons";
 import {
@@ -18,16 +17,21 @@ import {
 import { ProductCard } from "~/components/product-card";
 import { Shell } from "~/components/shell";
 import { StoreCard } from "~/components/store-card";
+import { Badge } from "~/components/ui/badge";
+import { buttonVariants } from "~/components/ui/button";
+import { siteConfig } from "~/config/site";
+import { type getGithubStars } from "~/server/queries/github";
+import { type getFeaturedStores } from "~/server/queries/store";
+import { cn } from "~/server/utils";
 
 import { CategoryCard } from "./category-card";
-import { getTranslations } from "next-intl/server";
 
-interface LobbyProps {
+type LobbyProps = {
   githubStarsPromise: ReturnType<typeof getGithubStars>;
   productsPromise: ReturnType<typeof getFeaturedProducts>;
   categoriesPromise: ReturnType<typeof getCategories>;
   storesPromise: ReturnType<typeof getFeaturedStores>;
-}
+};
 
 export async function Lobby({
   githubStarsPromise,
@@ -46,7 +50,7 @@ export async function Lobby({
   ]);
 
   return (
-    <Shell className="max-w-6xl gap-0">
+    <Shell className="max-w-6xl gap-0 mb-14">
       <PageHeader
         as="section"
         className="mx-auto items-center gap-2 text-center"
@@ -84,8 +88,8 @@ export async function Lobby({
           className="max-w-[46.875rem] animate-fade-up"
           style={{ animationDelay: "0.30s", animationFillMode: "both" }}
         >
-          Relivator Enhances your eCommerce with the Power of Next.js 15, React,
-          Tailwind, and more
+          Relivator Enhances your eCommerce with the Power of Next.js 15, React
+          19, Tailwind, and more
         </PageHeaderDescription>
         <PageActions
           className="animate-fade-up"
diff --git a/src/app/[locale]/(auth)/_components/logout-buttons.tsx b/src/components/logout-buttons.tsx
similarity index 97%
rename from src/app/[locale]/(auth)/_components/logout-buttons.tsx
rename to src/components/logout-buttons.tsx
index 6ae76db8..88562897 100644
--- a/src/app/[locale]/(auth)/_components/logout-buttons.tsx
+++ b/src/components/logout-buttons.tsx
@@ -1,12 +1,12 @@
 "use client";
 
-import { useRouter } from "next/navigation";
 import { SignOutButton } from "@clerk/nextjs";
+import { useRouter } from "next/navigation";
 
-import { cn } from "~/lib/utils";
-import { useMounted } from "~/hooks/use-mounted";
 import { Button, buttonVariants } from "~/components/ui/button";
 import { Skeleton } from "~/components/ui/skeleton";
+import { useMounted } from "~/hooks/use-mounted";
+import { cn } from "~/utils";
 
 export function LogOutButtons() {
   const router = useRouter();
diff --git a/src/components/manage-plan-form.tsx b/src/components/manage-plan-form.tsx
index d2eb93d8..ef9b4c39 100644
--- a/src/components/manage-plan-form.tsx
+++ b/src/components/manage-plan-form.tsx
@@ -4,10 +4,10 @@ import * as React from "react";
 import { toast } from "sonner";
 import { type z } from "zod";
 
-import { managePlan } from "~/lib/actions/stripe";
-import { type managePlanSchema } from "~/lib/validations/stripe";
-import { Button } from "~/components/ui/button";
 import { Icons } from "~/components/icons";
+import { Button } from "~/components/ui/button";
+import { managePlan } from "~/server/actions/stripe";
+import { type managePlanSchema } from "~/server/validations/stripe";
 
 type ManagePlanFormProps = z.infer<typeof managePlanSchema>;
 
diff --git a/src/components/mdx/callout.tsx b/src/components/mdx/callout.tsx
index 51e00d49..a45408a9 100644
--- a/src/components/mdx/callout.tsx
+++ b/src/components/mdx/callout.tsx
@@ -5,10 +5,10 @@ import * as React from "react";
 
 import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
 
-interface CalloutProps extends React.PropsWithChildren {
+type CalloutProps = {
   icon?: string;
   title?: string;
-}
+} & React.PropsWithChildren;
 
 export function Callout({ title, children, icon, ...props }: CalloutProps) {
   return (
diff --git a/src/components/mdx/code-block.tsx b/src/components/mdx/code-block.tsx
index ab6f996f..34d87c9a 100644
--- a/src/components/mdx/code-block.tsx
+++ b/src/components/mdx/code-block.tsx
@@ -1,18 +1,18 @@
 "use client";
 
-import * as React from "react";
 import { CheckIcon, CopyIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import { ScrollArea } from "~/components/ui/scroll-area";
-import { Icons } from "~/components/icons";
 
-interface CodeBlockProps extends React.HTMLProps<HTMLPreElement> {
+type CodeBlockProps = {
   // set by `rehype-pretty-code`
   "data-language"?: string;
   // set by `rehype-pretty-code`
   "data-theme"?: string;
-}
+} & React.HTMLProps<HTMLPreElement>;
 
 export function CodeBlock({ children, ...props }: CodeBlockProps) {
   const language = props["data-language"];
@@ -21,6 +21,7 @@ export function CodeBlock({ children, ...props }: CodeBlockProps) {
     js: Icons.javascript,
     ts: Icons.typescript,
     bash: Icons.bash,
+    // @ts-expect-error TODO: fix ts
   }[language];
 
   const ref = React.useRef<HTMLSpanElement>(null);
@@ -50,7 +51,9 @@ export function CodeBlock({ children, ...props }: CodeBlockProps) {
         size="icon"
         className="size-6 hover:bg-zinc-200 hover:text-zinc-900 dark:hover:bg-zinc-700 dark:hover:text-zinc-50"
         onClick={() => {
-          if (typeof window === "undefined") return;
+          if (typeof window === "undefined") {
+            return;
+          }
           setIsCopied(true);
           void window.navigator.clipboard.writeText(
             ref.current?.innerText ?? "",
diff --git a/src/components/mdx/link-badge.tsx b/src/components/mdx/link-badge.tsx
index cefafefa..20876116 100644
--- a/src/components/mdx/link-badge.tsx
+++ b/src/components/mdx/link-badge.tsx
@@ -1,11 +1,11 @@
-import * as React from "react";
 import Link from "next/link";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
-interface LinkBadgeProps extends React.ComponentPropsWithoutRef<typeof Link> {
+type LinkBadgeProps = {
   children: React.ReactNode;
-}
+} & React.ComponentPropsWithoutRef<typeof Link>;
 
 export function LinkBadge({ children, className, ...props }: LinkBadgeProps) {
   return (
diff --git a/src/components/mdx/mdx-card.tsx b/src/components/mdx/mdx-card.tsx
index 7c4e1543..2dc40e3e 100644
--- a/src/components/mdx/mdx-card.tsx
+++ b/src/components/mdx/mdx-card.tsx
@@ -4,12 +4,12 @@
 
 import Link from "next/link";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
-interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
+type CardProps = {
   href?: string;
   disabled?: boolean;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function MdxCard({
   href,
diff --git a/src/components/mdx/mdx-image.tsx b/src/components/mdx/mdx-image.tsx
index 2fce1ff0..dc2bb26a 100644
--- a/src/components/mdx/mdx-image.tsx
+++ b/src/components/mdx/mdx-image.tsx
@@ -2,9 +2,9 @@
 
 import Image from "next/image";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
-interface MdxImageProps extends React.ComponentProps<typeof Image> {}
+type MdxImageProps = {} & React.ComponentProps<typeof Image>;
 
 export function MdxImage({ className, ...props }: MdxImageProps) {
   return (
diff --git a/src/components/mdx/mdx-pager.tsx b/src/components/mdx/mdx-pager.tsx
index 947413c9..c529e166 100644
--- a/src/components/mdx/mdx-pager.tsx
+++ b/src/components/mdx/mdx-pager.tsx
@@ -1,18 +1,18 @@
-import Link from "next/link";
 import { ChevronLeftIcon, ChevronRightIcon } from "@radix-ui/react-icons";
+import Link from "next/link";
 
-import { cn, truncate } from "~/lib/utils";
 import { buttonVariants } from "~/components/ui/button";
+import { cn, truncate } from "~/server/utils";
 
-interface MdxPagerItem {
+type MdxPagerItem = {
   title: string;
   slug: string;
-}
+};
 
-interface MdxPagerProps extends React.HTMLAttributes<HTMLDivElement> {
+type MdxPagerProps = {
   currentItem: MdxPagerItem;
   allItems: MdxPagerItem[];
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function MdxPager({
   currentItem,
diff --git a/src/components/metrics-card.tsx b/src/components/metrics-card.tsx
index 063e2615..737a125d 100644
--- a/src/components/metrics-card.tsx
+++ b/src/components/metrics-card.tsx
@@ -1,11 +1,12 @@
 // Original source: https://github.com/openstatusHQ/openstatus/blob/main/apps/web/src/app/app/%5BworkspaceSlug%5D/(dashboard)/monitors/%5Bid%5D/_components/metrics-card.tsx
 
-import { ChevronDownIcon, ChevronUpIcon } from "@radix-ui/react-icons";
 import type { VariantProps } from "class-variance-authority";
+
+import { ChevronDownIcon, ChevronUpIcon } from "@radix-ui/react-icons";
 import { cva } from "class-variance-authority";
 
-import { cn } from "~/lib/utils";
 import { Badge } from "~/components/ui/badge";
+import { cn } from "~/server/utils";
 
 const metricsCardVariants = cva("flex flex-col rounded-lg border px-3 py-2", {
   variants: {
@@ -29,7 +30,7 @@ const metricsCardVariants = cva("flex flex-col rounded-lg border px-3 py-2", {
   },
 });
 
-interface MetricsCardProps extends VariantProps<typeof metricsCardVariants> {
+type MetricsCardProps = {
   title: string;
   value?: number;
   suffix: string;
@@ -44,7 +45,7 @@ interface MetricsCardProps extends VariantProps<typeof metricsCardVariants> {
    */
   fading?: boolean;
   className?: string;
-}
+} & VariantProps<typeof metricsCardVariants>;
 
 export function MetricsCard({
   title,
@@ -92,12 +93,13 @@ const badgeVariants = cva("", {
   },
 });
 
-interface DeltaBadgeProps extends VariantProps<typeof badgeVariants> {
+type DeltaBadgeProps = {
   value: number;
   decimal?: number;
-}
+} & VariantProps<typeof badgeVariants>;
 
 function DeltaBadge({ value, decimal = 1 }: DeltaBadgeProps) {
+  // biome-ignore lint/style/useExponentiationOperator: <explanation>
   const round = Math.pow(10, decimal); // 10^1 = 10 (1 decimal), 10^2 = 100 (2 decimals), etc.
   const percentage = Math.round((value - 1) * round) / round;
 
diff --git a/src/components/motion.tsx b/src/components/motion.tsx
index ea8cf0b3..391bbdb0 100644
--- a/src/components/motion.tsx
+++ b/src/components/motion.tsx
@@ -1,13 +1,13 @@
 "use client";
 
-import * as React from "react";
 import { motion, AnimatePresence as MotionPresence } from "framer-motion";
+import * as React from "react";
 import {
   useInView,
   type IntersectionObserverProps,
 } from "react-intersection-observer";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 export const MotionDiv = motion.div;
 export const MotionSection = motion.section;
@@ -15,20 +15,18 @@ export const MotionH1 = motion.h1;
 export const MotionP = motion.p;
 export const AnimatePresence = MotionPresence;
 
-interface MotionShellProps
-  extends React.ComponentPropsWithoutRef<typeof motion.div> {
+type MotionShellProps = {
   delay?: IntersectionObserverProps["delay"];
   threshold?: IntersectionObserverProps["threshold"];
   once?: IntersectionObserverProps["triggerOnce"];
   margin?: IntersectionObserverProps["rootMargin"];
-}
+} & React.ComponentPropsWithoutRef<typeof motion.div>;
 
 export function MotionShell({
   delay = 100,
   threshold = 0.5,
   once = true,
   margin = "0px 0px 0px 0px",
-  className,
   ...props
 }: MotionShellProps) {
   const { ref, inView } = useInView({
@@ -41,7 +39,6 @@ export function MotionShell({
   return (
     <MotionDiv
       ref={ref}
-      className={cn(className)}
       initial="hidden"
       animate={inView ? "visible" : "hidden"}
       variants={{
diff --git a/src/components/multi-select.tsx b/src/components/multi-select.tsx
index dcbac949..ec74286c 100644
--- a/src/components/multi-select.tsx
+++ b/src/components/multi-select.tsx
@@ -1,21 +1,22 @@
 "use client";
 
-import * as React from "react";
-import type { Option } from "~/types";
 import { Cross2Icon } from "@radix-ui/react-icons";
 import { Command as CommandPrimitive } from "cmdk";
+import * as React from "react";
+
+import type { Option } from "~/types";
 
 import { Badge } from "~/components/ui/badge";
 import { Button } from "~/components/ui/button";
 import { Command, CommandGroup, CommandItem } from "~/components/ui/command";
 
-interface MultiSelectProps {
+type MultiSelectProps = {
   selected: Option[] | null;
   setSelected: React.Dispatch<React.SetStateAction<Option[] | null>>;
   onChange?: (value: Option[] | null) => void;
   placeholder?: string;
   options: Option[];
-}
+};
 
 export function MultiSelect({
   selected,
@@ -30,7 +31,9 @@ export function MultiSelect({
 
   // Register as input field to be used in react-hook-form
   React.useEffect(() => {
-    if (onChange) onChange(selected?.length ? selected : null);
+    if (onChange) {
+      onChange(selected?.length ? selected : null);
+    }
   }, [onChange, selected]);
 
   const handleSelect = React.useCallback(
@@ -49,7 +52,9 @@ export function MultiSelect({
 
   const handleKeyDown = React.useCallback(
     (event: React.KeyboardEvent<HTMLDivElement>) => {
-      if (!inputRef.current) return;
+      if (!inputRef.current) {
+        return;
+      }
 
       if (event.key === "Backspace" || event.key === "Delete") {
         setSelected((prev) => prev?.slice(0, -1) ?? []);
@@ -66,9 +71,13 @@ export function MultiSelect({
   // Memoize filtered options to avoid unnecessary re-renders
   const filteredOptions = React.useMemo(() => {
     return options.filter((option) => {
-      if (selected?.find((item) => item.value === option.value)) return false;
+      if (selected?.find((item) => item.value === option.value)) {
+        return false;
+      }
 
-      if (query.length === 0) return true;
+      if (query.length === 0) {
+        return true;
+      }
 
       return option.label.toLowerCase().includes(query.toLowerCase());
     });
diff --git a/src/app/[locale]/(auth)/_components/oauth-signin.tsx b/src/components/oauth-signin.tsx
similarity index 94%
rename from src/app/[locale]/(auth)/_components/oauth-signin.tsx
rename to src/components/oauth-signin.tsx
index cc54f75e..d12fef67 100644
--- a/src/app/[locale]/(auth)/_components/oauth-signin.tsx
+++ b/src/components/oauth-signin.tsx
@@ -1,12 +1,12 @@
 "use client";
 
-import * as React from "react";
 import { useSignIn } from "@clerk/nextjs";
 import { type OAuthStrategy } from "@clerk/types";
+import * as React from "react";
 
-import { showErrorToast } from "~/lib/handle-error";
-import { Button } from "~/components/ui/button";
 import { Icons } from "~/components/icons";
+import { Button } from "~/components/ui/button";
+import { showErrorToast } from "~/server/handle-error";
 
 const oauthProviders = [
   { name: "Google", strategy: "oauth_google", icon: "google" },
@@ -22,7 +22,9 @@ export function OAuthSignIn() {
   const { signIn, isLoaded: signInLoaded } = useSignIn();
 
   async function oauthSignIn(provider: OAuthStrategy) {
-    if (!signInLoaded) return null;
+    if (!signInLoaded) {
+      return null;
+    }
 
     try {
       setLoading(provider);
diff --git a/src/components/page-header.tsx b/src/components/page-header.tsx
index 73f7c205..0dd41978 100644
--- a/src/components/page-header.tsx
+++ b/src/components/page-header.tsx
@@ -1,11 +1,11 @@
 import { cva, type VariantProps } from "class-variance-authority";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
-interface PageHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+type PageHeaderProps = {
   as?: React.ElementType;
   withPadding?: boolean;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 function PageHeader({
   className,
@@ -44,11 +44,10 @@ const headingVariants = cva(
   },
 );
 
-interface PageHeaderHeadingProps
-  extends React.HTMLAttributes<HTMLHeadingElement>,
-    VariantProps<typeof headingVariants> {
+type PageHeaderHeadingProps = {
   as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
-}
+} & React.HTMLAttributes<HTMLHeadingElement> &
+  VariantProps<typeof headingVariants>;
 
 function PageHeaderHeading({
   className,
@@ -77,9 +76,9 @@ const descriptionVariants = cva(
   },
 );
 
-interface PageHeaderDescriptionProps
-  extends React.HTMLAttributes<HTMLParagraphElement>,
-    VariantProps<typeof descriptionVariants> {}
+type PageHeaderDescriptionProps =
+  {} & React.HTMLAttributes<HTMLParagraphElement> &
+    VariantProps<typeof descriptionVariants>;
 
 function PageHeaderDescription({
   className,
diff --git a/src/components/pagination-button.tsx b/src/components/pagination-button.tsx
index a4ac5402..6eb7e41f 100644
--- a/src/components/pagination-button.tsx
+++ b/src/components/pagination-button.tsx
@@ -1,23 +1,23 @@
-import * as React from "react";
-import { usePathname, useRouter } from "next/navigation";
 import {
   ChevronLeftIcon,
   ChevronRightIcon,
   DoubleArrowLeftIcon,
   DoubleArrowRightIcon,
 } from "@radix-ui/react-icons";
+import { usePathname, useRouter } from "next/navigation";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { Button } from "~/components/ui/button";
+import { cn } from "~/server/utils";
 
-interface PaginationButtonProps extends React.HTMLAttributes<HTMLDivElement> {
+type PaginationButtonProps = {
   pageCount: number;
   page?: string;
   per_page?: string;
   sort?: string;
   createQueryString: (params: Record<string, string | number | null>) => string;
   siblingCount?: number;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function PaginationButton({
   pageCount,
diff --git a/src/components/password-input.tsx b/src/components/password-input.tsx
index 991a041b..3abe3f74 100644
--- a/src/components/password-input.tsx
+++ b/src/components/password-input.tsx
@@ -1,11 +1,13 @@
 "use client";
 
-import * as React from "react";
 import { EyeNoneIcon, EyeOpenIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { Button } from "~/components/ui/button";
-import { Input, type InputProps } from "~/components/ui/input";
+import { Input } from "~/components/ui/input";
+import { cn } from "~/server/utils";
+
+type InputProps = React.ComponentProps<typeof Input>;
 
 const PasswordInput = React.forwardRef<HTMLInputElement, InputProps>(
   ({ className, ...props }, ref) => {
diff --git a/src/components/placeholder-image.tsx b/src/components/placeholder-image.tsx
index cb5c5540..06f2f288 100644
--- a/src/components/placeholder-image.tsx
+++ b/src/components/placeholder-image.tsx
@@ -1,15 +1,14 @@
 import { Slot } from "@radix-ui/react-slot";
 
-import { cn } from "~/lib/utils";
+import { Icons } from "~/components/icons";
 import { AspectRatio } from "~/components/ui/aspect-ratio";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Icons } from "~/components/icons";
+import { cn } from "~/server/utils";
 
-interface PlaceholderImageProps
-  extends React.ComponentPropsWithoutRef<typeof AspectRatio> {
+type PlaceholderImageProps = {
   isSkeleton?: boolean;
   asChild?: boolean;
-}
+} & React.ComponentPropsWithoutRef<typeof AspectRatio>;
 
 export function PlaceholderImage({
   isSkeleton = false,
diff --git a/src/components/product-card-skeleton.tsx b/src/components/product-card-skeleton.tsx
index a18e5027..c1d21c14 100644
--- a/src/components/product-card-skeleton.tsx
+++ b/src/components/product-card-skeleton.tsx
@@ -1,4 +1,4 @@
-import { cn } from "~/lib/utils";
+import { PlaceholderImage } from "~/components/placeholder-image";
 import { AspectRatio } from "~/components/ui/aspect-ratio";
 import {
   Card,
@@ -7,10 +7,11 @@ import {
   CardHeader,
 } from "~/components/ui/card";
 import { Skeleton } from "~/components/ui/skeleton";
-import { PlaceholderImage } from "~/components/placeholder-image";
+import { cn } from "~/server/utils";
 
-interface ProductCardSkeletonProps
-  extends React.ComponentPropsWithoutRef<typeof Card> {}
+type ProductCardSkeletonProps = {} & React.ComponentPropsWithoutRef<
+  typeof Card
+>;
 
 export function ProductCardSkeleton({
   className,
diff --git a/src/components/product-card.tsx b/src/components/product-card.tsx
index da4ac342..c61870e2 100644
--- a/src/components/product-card.tsx
+++ b/src/components/product-card.tsx
@@ -1,14 +1,13 @@
 "use client";
 
-import * as React from "react";
+import { CheckIcon, EyeOpenIcon, PlusIcon } from "@radix-ui/react-icons";
 import Image from "next/image";
 import Link from "next/link";
-import { type Product } from "~/db/schema";
-import { CheckIcon, EyeOpenIcon, PlusIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 import { toast } from "sonner";
 
-import { addToCart } from "~/lib/actions/cart";
-import { cn, formatPrice } from "~/lib/utils";
+import { Icons } from "~/components/icons";
+import { PlaceholderImage } from "~/components/placeholder-image";
 import { AspectRatio } from "~/components/ui/aspect-ratio";
 import { Button, buttonVariants } from "~/components/ui/button";
 import {
@@ -19,17 +18,18 @@ import {
   CardHeader,
   CardTitle,
 } from "~/components/ui/card";
-import { Icons } from "~/components/icons";
-import { PlaceholderImage } from "~/components/placeholder-image";
+import { addToCart } from "~/server/actions/cart";
+import { type Product } from "~/server/db/schema";
+import { cn, formatPrice } from "~/server/utils";
 
-interface ProductCardProps extends React.HTMLAttributes<HTMLDivElement> {
+type ProductCardProps = {
   product: Pick<Product, "id" | "name" | "price" | "images" | "inventory"> & {
     category: string | null;
   };
   variant?: "default" | "switchable";
   isAddedToCart?: boolean;
   onSwitch?: () => Promise<void>;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function ProductCard({
   product,
diff --git a/src/components/product-image-carousel.tsx b/src/components/product-image-carousel.tsx
index 2d64a0c4..cca9bee0 100644
--- a/src/components/product-image-carousel.tsx
+++ b/src/components/product-image-carousel.tsx
@@ -1,26 +1,25 @@
 "use client";
 
-import * as React from "react";
-import Image from "next/image";
-import { type StoredFile } from "~/types";
 import { ChevronLeftIcon, ChevronRightIcon } from "@radix-ui/react-icons";
 import useEmblaCarousel, {
   type UseEmblaCarouselType,
 } from "embla-carousel-react";
+import Image from "next/image";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
-import { Button } from "~/components/ui/button";
 import { Icons } from "~/components/icons";
+import { Button } from "~/components/ui/button";
+import { cn } from "~/server/utils";
+import { type StoredFile } from "~/types";
 
 type CarouselApi = UseEmblaCarouselType["1"];
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
 type CarouselOptions = UseCarouselParameters["0"];
 
-interface ProductImageCarouselProps
-  extends React.HTMLAttributes<HTMLDivElement> {
+type ProductImageCarouselProps = {
   images: StoredFile[];
   options?: CarouselOptions;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function ProductImageCarousel({
   images,
@@ -35,16 +34,16 @@ export function ProductImageCarousel({
   const [selectedIndex, setSelectedIndex] = React.useState(0);
 
   const scrollPrev = React.useCallback(
-    () => emblaApi && emblaApi.scrollPrev(),
+    () => emblaApi?.scrollPrev(),
     [emblaApi],
   );
   const scrollNext = React.useCallback(
-    () => emblaApi && emblaApi.scrollNext(),
+    () => emblaApi?.scrollNext(),
     [emblaApi],
   );
 
   const scrollTo = React.useCallback(
-    (index: number) => emblaApi && emblaApi.scrollTo(index),
+    (index: number) => emblaApi?.scrollTo(index),
     [emblaApi],
   );
 
@@ -60,7 +59,9 @@ export function ProductImageCarousel({
   );
 
   const onSelect = React.useCallback((emblaApi: CarouselApi) => {
-    if (!emblaApi) return;
+    if (!emblaApi) {
+      return;
+    }
 
     setSelectedIndex(emblaApi.selectedScrollSnap());
     setPrevBtnDisabled(!emblaApi.canScrollPrev());
@@ -68,7 +69,9 @@ export function ProductImageCarousel({
   }, []);
 
   React.useEffect(() => {
-    if (!emblaApi) return;
+    if (!emblaApi) {
+      return;
+    }
 
     onSelect(emblaApi);
     emblaApi.on("reInit", onSelect);
diff --git a/src/components/products-combobox.tsx b/src/components/products-combobox.tsx
index 6d774c0c..31a4be56 100644
--- a/src/components/products-combobox.tsx
+++ b/src/components/products-combobox.tsx
@@ -1,12 +1,11 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
 import { MagnifyingGlassIcon } from "@radix-ui/react-icons";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 
-import { filterProducts } from "~/lib/actions/product";
-import { cn, isMacOs } from "~/lib/utils";
-import { useDebounce } from "~/hooks/use-debounce";
+import { Icons } from "~/components/icons";
+import { Kbd } from "~/components/kbd";
 import { Button } from "~/components/ui/button";
 import {
   CommandDialog,
@@ -17,8 +16,9 @@ import {
   CommandList,
 } from "~/components/ui/command";
 import { Skeleton } from "~/components/ui/skeleton";
-import { Icons } from "~/components/icons";
-import { Kbd } from "~/components/kbd";
+import { useDebounce } from "~/hooks/use-debounce";
+import { filterProducts } from "~/server/actions/product";
+import { cn, isMacOs } from "~/server/utils";
 
 type ProductGroup = NonNullable<
   Awaited<ReturnType<typeof filterProducts>>["data"]
diff --git a/src/components/products.tsx b/src/components/products.tsx
index b5058315..d4af2ce2 100644
--- a/src/components/products.tsx
+++ b/src/components/products.tsx
@@ -1,22 +1,18 @@
 "use client";
 
-import * as React from "react";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
-import { type Product, type Store } from "~/db/schema";
-import type { Option } from "~/types";
 import {
   ChevronDownIcon,
   ChevronLeftIcon,
   ChevronRightIcon,
 } from "@radix-ui/react-icons";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import * as React from "react";
 
-import { queryConfig } from "~/config/query";
-import {
-  type getCategories,
-  type getSubcategoriesByCategory,
-} from "~/lib/queries/product";
-import { cn, toTitleCase, truncate } from "~/lib/utils";
-import { useDebounce } from "~/hooks/use-debounce";
+import type { Option } from "~/types";
+
+import { MultiSelect } from "~/components/multi-select";
+import { PaginationButton } from "~/components/pagination-button";
+import { ProductCard } from "~/components/product-card";
 import { Button } from "~/components/ui/button";
 import { Card, CardDescription } from "~/components/ui/card";
 import { Checkbox } from "~/components/ui/checkbox";
@@ -42,11 +38,16 @@ import {
 } from "~/components/ui/sheet";
 import { Slider } from "~/components/ui/slider";
 import { Switch } from "~/components/ui/switch";
-import { MultiSelect } from "~/components/multi-select";
-import { PaginationButton } from "~/components/pagination-button";
-import { ProductCard } from "~/components/product-card";
+import { queryConfig } from "~/config/query";
+import { useDebounce } from "~/hooks/use-debounce";
+import { type Product, type Store } from "~/server/db/schema";
+import {
+  type getCategories,
+  type getSubcategoriesByCategory,
+} from "~/server/queries/product";
+import { cn, toTitleCase, truncate } from "~/server/utils";
 
-interface ProductsProps {
+type ProductsProps = {
   products: Product[];
   pageCount: number;
   categories?: string[];
@@ -57,7 +58,7 @@ interface ProductsProps {
     "id" | "name" | "productCount"
   >[];
   storePageCount?: number;
-}
+};
 
 export function Products({
   products,
diff --git a/src/components/providers.tsx b/src/components/providers.tsx
index c182be5e..db094946 100644
--- a/src/components/providers.tsx
+++ b/src/components/providers.tsx
@@ -1,14 +1,18 @@
 "use client";
 
+import type * as React from "react";
+
 import { ThemeProvider as NextThemesProvider } from "next-themes";
-import type { ThemeProviderProps } from "next-themes/dist/types";
 
 import { TooltipProvider } from "~/components/ui/tooltip";
 
-export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
+export function ThemeProvider({
+  children,
+  ...props
+}: React.ComponentProps<typeof NextThemesProvider>) {
   return (
     <NextThemesProvider {...props}>
-      <TooltipProvider>{children}</TooltipProvider>
+      <TooltipProvider delayDuration={0}>{children}</TooltipProvider>
     </NextThemesProvider>
   );
 }
diff --git a/src/components/radial-gradient.tsx b/src/components/radial-gradient.tsx
index b43db541..b4aa70dd 100644
--- a/src/components/radial-gradient.tsx
+++ b/src/components/radial-gradient.tsx
@@ -1,4 +1,4 @@
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 type Type = "circle" | "ellipse";
 
@@ -13,7 +13,7 @@ type Origin =
   | "bottom left"
   | "bottom right";
 
-interface RadialGradientProps extends React.HTMLAttributes<HTMLDivElement> {
+type RadialGradientProps = {
   /**
    * The type of radial gradient
    * @default circle
@@ -47,7 +47,7 @@ interface RadialGradientProps extends React.HTMLAttributes<HTMLDivElement> {
    * @type string
    * */
   origin?: Origin;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function RadialGradient({
   type = "circle",
diff --git a/src/components/rate-limit-alert.tsx b/src/components/rate-limit-alert.tsx
index 5f589a31..4a4ab2e5 100644
--- a/src/components/rate-limit-alert.tsx
+++ b/src/components/rate-limit-alert.tsx
@@ -1,14 +1,14 @@
 import Link from "next/link";
 
-import { type getUserPlanMetrics } from "~/lib/queries/user";
-import { cn } from "~/lib/utils";
 import { buttonVariants } from "~/components/ui/button";
+import { type getUserPlanMetrics } from "~/server/queries/user";
+import { cn } from "~/server/utils";
 
 import { ManagePlanForm } from "./manage-plan-form";
 
-interface RateLimitAlertProps extends React.HTMLAttributes<HTMLDivElement> {
+type RateLimitAlertProps = {
   planMetrics: Awaited<ReturnType<typeof getUserPlanMetrics>>;
-}
+} & React.HTMLAttributes<HTMLDivElement>;
 
 export function RateLimitAlert({
   planMetrics,
diff --git a/src/components/rating.tsx b/src/components/rating.tsx
index e61a536a..a521a55e 100644
--- a/src/components/rating.tsx
+++ b/src/components/rating.tsx
@@ -1,10 +1,10 @@
 import { StarIcon } from "@radix-ui/react-icons";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
-interface RatingProps {
+type RatingProps = {
   rating: number;
-}
+};
 
 export function Rating({ rating }: RatingProps) {
   return (
diff --git a/src/app/[locale]/(auth)/_components/reset-password-confirm-form.tsx b/src/components/reset-password-confirm-form.tsx
similarity index 91%
rename from src/app/[locale]/(auth)/_components/reset-password-confirm-form.tsx
rename to src/components/reset-password-confirm-form.tsx
index 9ece7d46..50f0201e 100644
--- a/src/app/[locale]/(auth)/_components/reset-password-confirm-form.tsx
+++ b/src/components/reset-password-confirm-form.tsx
@@ -1,15 +1,15 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
+import type { z } from "zod";
+
 import { useSignIn } from "@clerk/nextjs";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import type { z } from "zod";
 
-import { showErrorToast } from "~/lib/handle-error";
-import { resetPasswordSchema } from "~/lib/validations/auth";
+import { Icons } from "~/components/icons";
+import { PasswordInput } from "~/components/password-input";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -25,8 +25,10 @@ import {
   InputOTPGroup,
   InputOTPSlot,
 } from "~/components/ui/input-otp";
-import { Icons } from "~/components/icons";
-import { PasswordInput } from "~/components/password-input";
+import { Toaster } from "~/components/ui/toaster";
+import { useToast } from "~/hooks/use-toast";
+import { showErrorToast } from "~/server/handle-error";
+import { resetPasswordSchema } from "~/server/validations/auth";
 
 type Inputs = z.infer<typeof resetPasswordSchema>;
 
@@ -34,6 +36,7 @@ export function ResetPasswordConfirmForm() {
   const router = useRouter();
   const { isLoaded, signIn, setActive } = useSignIn();
   const [loading, setLoading] = React.useState(false);
+  const { toast } = useToast();
 
   // react-hook-form
   const form = useForm<Inputs>({
@@ -46,7 +49,9 @@ export function ResetPasswordConfirmForm() {
   });
 
   async function onSubmit(data: Inputs) {
-    if (!isLoaded) return;
+    if (!isLoaded) {
+      return;
+    }
 
     setLoading(true);
 
@@ -64,7 +69,10 @@ export function ResetPasswordConfirmForm() {
           session: attemptFirstFactor.createdSessionId,
         });
         router.push(`${window.location.origin}/`);
-        toast.success("Password reset successfully.");
+        toast({
+          title: "Password reset",
+          description: `Password reset successfully.`,
+        });
       } else {
         console.error(attemptFirstFactor);
       }
diff --git a/src/app/[locale]/(auth)/_components/reset-password-form.tsx b/src/components/reset-password-form.tsx
similarity index 88%
rename from src/app/[locale]/(auth)/_components/reset-password-form.tsx
rename to src/components/reset-password-form.tsx
index fb4b7d08..c3c7648a 100644
--- a/src/app/[locale]/(auth)/_components/reset-password-form.tsx
+++ b/src/components/reset-password-form.tsx
@@ -1,15 +1,14 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
+import type { z } from "zod";
+
 import { useSignIn } from "@clerk/nextjs";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import type { z } from "zod";
 
-import { showErrorToast } from "~/lib/handle-error";
-import { checkEmailSchema } from "~/lib/validations/auth";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -20,7 +19,9 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Input } from "~/components/ui/input";
-import { Icons } from "~/components/icons";
+import { useToast } from "~/hooks/use-toast";
+import { showErrorToast } from "~/server/handle-error";
+import { checkEmailSchema } from "~/server/validations/auth";
 
 type Inputs = z.infer<typeof checkEmailSchema>;
 
@@ -28,7 +29,7 @@ export function ResetPasswordForm() {
   const router = useRouter();
   const { isLoaded, signIn } = useSignIn();
   const [loading, setLoading] = React.useState(false);
-
+  const { toast } = useToast();
   // react-hook-form
   const form = useForm<Inputs>({
     resolver: zodResolver(checkEmailSchema),
@@ -38,7 +39,9 @@ export function ResetPasswordForm() {
   });
 
   async function onSubmit(data: Inputs) {
-    if (!isLoaded) return;
+    if (!isLoaded) {
+      return;
+    }
 
     setLoading(true);
 
@@ -50,7 +53,8 @@ export function ResetPasswordForm() {
 
       if (firstFactor.status === "needs_first_factor") {
         router.push("/signin/reset-password/confirm");
-        toast.message("Check your email", {
+        toast({
+          title: "Check your email",
           description: "We sent you a 6-digit verification code.",
         });
       }
diff --git a/src/components/seed-products-button.tsx b/src/components/seed-products-button.tsx
index c13fb6e7..babede3b 100644
--- a/src/components/seed-products-button.tsx
+++ b/src/components/seed-products-button.tsx
@@ -3,15 +3,15 @@
 import * as React from "react";
 import { toast } from "sonner";
 
-import { seedProducts } from "~/lib/actions/seed";
-import { cn } from "~/lib/utils";
-import { Button, type ButtonProps } from "~/components/ui/button";
 import { Icons } from "~/components/icons";
+import { Button, type ButtonProps } from "~/components/ui/button";
+import { seedProducts } from "~/server/actions/seed";
+import { cn } from "~/server/utils";
 
-interface SeedProductsProps extends ButtonProps {
+type SeedProductsProps = {
   storeId: string;
   count?: number;
-}
+} & ButtonProps;
 
 export function SeedProducts({
   storeId,
diff --git a/src/components/shell.tsx b/src/components/shell.tsx
index d98c976b..04d1464a 100644
--- a/src/components/shell.tsx
+++ b/src/components/shell.tsx
@@ -1,7 +1,7 @@
-import * as React from "react";
 import { cva, type VariantProps } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const shellVariants = cva("grid items-center gap-8 pb-8 pt-6 lg:py-6", {
   variants: {
@@ -17,11 +17,10 @@ const shellVariants = cva("grid items-center gap-8 pb-8 pt-6 lg:py-6", {
   },
 });
 
-interface ShellProps
-  extends React.HTMLAttributes<HTMLDivElement>,
-    VariantProps<typeof shellVariants> {
+type ShellProps = {
   as?: React.ElementType;
-}
+} & React.HTMLAttributes<HTMLDivElement> &
+  VariantProps<typeof shellVariants>;
 
 function Shell({
   className,
diff --git a/src/app/[locale]/(auth)/_components/signin-form.tsx b/src/components/signin-form.tsx
similarity index 94%
rename from src/app/[locale]/(auth)/_components/signin-form.tsx
rename to src/components/signin-form.tsx
index 8bd50988..6461a842 100644
--- a/src/app/[locale]/(auth)/_components/signin-form.tsx
+++ b/src/components/signin-form.tsx
@@ -1,14 +1,15 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
+import type { z } from "zod";
+
 import { useSignIn } from "@clerk/nextjs";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
-import type { z } from "zod";
 
-import { showErrorToast } from "~/lib/handle-error";
-import { authSchema } from "~/lib/validations/auth";
+import { Icons } from "~/components/icons";
+import { PasswordInput } from "~/components/password-input";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -19,8 +20,8 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Input } from "~/components/ui/input";
-import { Icons } from "~/components/icons";
-import { PasswordInput } from "~/components/password-input";
+import { showErrorToast } from "~/server/handle-error";
+import { authSchema } from "~/server/validations/auth";
 
 type Inputs = z.infer<typeof authSchema>;
 
@@ -39,7 +40,9 @@ export function SignInForm() {
   });
 
   async function onSubmit(data: Inputs) {
-    if (!isLoaded) return;
+    if (!isLoaded) {
+      return;
+    }
 
     setLoading(true);
 
diff --git a/src/app/[locale]/(auth)/_components/signup-form.tsx b/src/components/signup-form.tsx
similarity index 90%
rename from src/app/[locale]/(auth)/_components/signup-form.tsx
rename to src/components/signup-form.tsx
index f38442b3..03eab81d 100644
--- a/src/app/[locale]/(auth)/_components/signup-form.tsx
+++ b/src/components/signup-form.tsx
@@ -1,15 +1,15 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
+import type { z } from "zod";
+
 import { useSignUp } from "@clerk/nextjs";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import type { z } from "zod";
 
-import { showErrorToast } from "~/lib/handle-error";
-import { authSchema } from "~/lib/validations/auth";
+import { Icons } from "~/components/icons";
+import { PasswordInput } from "~/components/password-input";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -20,8 +20,9 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Input } from "~/components/ui/input";
-import { Icons } from "~/components/icons";
-import { PasswordInput } from "~/components/password-input";
+import { useToast } from "~/hooks/use-toast";
+import { showErrorToast } from "~/server/handle-error";
+import { authSchema } from "~/server/validations/auth";
 
 type Inputs = z.infer<typeof authSchema>;
 
@@ -29,7 +30,7 @@ export function SignUpForm() {
   const router = useRouter();
   const { isLoaded, signUp } = useSignUp();
   const [loading, setLoading] = React.useState(false);
-
+  const { toast } = useToast();
   // react-hook-form
   const form = useForm<Inputs>({
     resolver: zodResolver(authSchema),
@@ -40,7 +41,9 @@ export function SignUpForm() {
   });
 
   async function onSubmit(data: Inputs) {
-    if (!isLoaded) return;
+    if (!isLoaded) {
+      return;
+    }
 
     setLoading(true);
 
@@ -56,7 +59,8 @@ export function SignUpForm() {
       });
 
       router.push("/signup/verify-email");
-      toast.message("Check your email", {
+      toast({
+        title: "Check your email",
         description: "We sent you a 6-digit verification code.",
       });
     } catch (err) {
diff --git a/src/app/[locale]/(auth)/_components/sso-callback.tsx b/src/components/sso-callback.tsx
similarity index 95%
rename from src/app/[locale]/(auth)/_components/sso-callback.tsx
rename to src/components/sso-callback.tsx
index d8d8f52b..61c811ba 100644
--- a/src/app/[locale]/(auth)/_components/sso-callback.tsx
+++ b/src/components/sso-callback.tsx
@@ -1,14 +1,14 @@
 "use client";
 
-import * as React from "react";
 import { useClerk } from "@clerk/nextjs";
 import { type HandleOAuthCallbackParams } from "@clerk/types";
+import * as React from "react";
 
 import { Icons } from "~/components/icons";
 
-interface SSOCallbackProps {
+type SSOCallbackProps = {
   searchParams: HandleOAuthCallbackParams;
-}
+};
 
 export function SSOCallback({ searchParams }: SSOCallbackProps) {
   const { handleRedirectCallback } = useClerk();
diff --git a/src/components/store-card.tsx b/src/components/store-card.tsx
index 9b96ceaa..56ab246e 100644
--- a/src/components/store-card.tsx
+++ b/src/components/store-card.tsx
@@ -1,7 +1,6 @@
 import Link from "next/link";
 
-import { type getStoresByUserId } from "~/lib/queries/store";
-import { cn } from "~/lib/utils";
+import { Icons } from "~/components/icons";
 import { Badge } from "~/components/ui/badge";
 import {
   Card,
@@ -15,15 +14,16 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from "~/components/ui/tooltip";
-import { Icons } from "~/components/icons";
+import { type getStoresByUserId } from "~/server/queries/store";
+import { cn } from "~/server/utils";
 
 type Store = Awaited<ReturnType<typeof getStoresByUserId>>[number];
 
-interface StoreCardProps {
+type StoreCardProps = {
   store: Omit<Store, "orderCount" | "customerCount"> &
     Partial<Pick<Store, "orderCount" | "customerCount">>;
   href: string;
-}
+};
 
 export function StoreCard({ store, href }: StoreCardProps) {
   const isUserStore = href.includes("dashboard");
diff --git a/src/components/store-tabs.tsx b/src/components/store-tabs.tsx
index ac3c0b45..0168d004 100644
--- a/src/components/store-tabs.tsx
+++ b/src/components/store-tabs.tsx
@@ -1,16 +1,16 @@
 "use client";
 
+import { Tabs, TabsList, TabsTrigger } from "@radix-ui/react-tabs";
 import Link from "next/link";
 import { useRouter, useSelectedLayoutSegment } from "next/navigation";
-import { Tabs, TabsList, TabsTrigger } from "@radix-ui/react-tabs";
 
-import { cn } from "~/lib/utils";
 import { ScrollArea } from "~/components/ui/scroll-area";
 import { Separator } from "~/components/ui/separator";
+import { cn } from "~/server/utils";
 
-interface StoreTabsProps {
+type StoreTabsProps = {
   storeId: string;
-}
+};
 
 export function StoreTabs({ storeId }: StoreTabsProps) {
   const router = useRouter();
@@ -59,6 +59,7 @@ export function StoreTabs({ storeId }: StoreTabsProps) {
       >
         <TabsList className="inline-flex items-center justify-center space-x-1.5 text-muted-foreground">
           {tabs.map((tab) => (
+            // biome-ignore lint/a11y/useValidAriaRole: <explanation>
             <div
               role="none"
               key={tab.href}
diff --git a/src/components/stores.tsx b/src/components/stores.tsx
index 05f7860b..1ddbe9cf 100644
--- a/src/components/stores.tsx
+++ b/src/components/stores.tsx
@@ -1,12 +1,12 @@
 "use client";
 
-import * as React from "react";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import { ChevronDownIcon, Cross2Icon } from "@radix-ui/react-icons";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import * as React from "react";
 
-import { queryConfig } from "~/config/query";
-import { type getStores } from "~/lib/queries/store";
-import { cn } from "~/lib/utils";
+import { FacetedFilter } from "~/components/faceted-filter";
+import { PaginationButton } from "~/components/pagination-button";
+import { StoreCard } from "~/components/store-card";
 import { Button } from "~/components/ui/button";
 import {
   DropdownMenu,
@@ -16,9 +16,9 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
-import { FacetedFilter } from "~/components/faceted-filter";
-import { PaginationButton } from "~/components/pagination-button";
-import { StoreCard } from "~/components/store-card";
+import { queryConfig } from "~/config/query";
+import { type getStores } from "~/server/queries/store";
+import { cn } from "~/server/utils";
 
 type StoresProps = Awaited<ReturnType<typeof getStores>>;
 
diff --git a/src/components/tables/customers-table.tsx b/src/components/tables/customers-table.tsx
index 143fc7a1..fac09a2d 100644
--- a/src/components/tables/customers-table.tsx
+++ b/src/components/tables/customers-table.tsx
@@ -1,11 +1,12 @@
 "use client";
 
-import * as React from "react";
-import Link from "next/link";
 import { DotsHorizontalIcon } from "@radix-ui/react-icons";
 import { type ColumnDef } from "@tanstack/react-table";
+import Link from "next/link";
+import * as React from "react";
 
-import { formatDate, formatPrice } from "~/lib/utils";
+import { DataTable } from "~/components/data-table/data-table";
+import { DataTableColumnHeader } from "~/components/data-table/data-table-column-header";
 import { Button } from "~/components/ui/button";
 import {
   DropdownMenu,
@@ -13,24 +14,23 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
-import { DataTable } from "~/components/data-table/data-table";
-import { DataTableColumnHeader } from "~/components/data-table/data-table-column-header";
+import { formatDate, formatPrice } from "~/server/utils";
 
-interface AwaitedCustomer {
+type AwaitedCustomer = {
   email: string | null;
   name: string | null;
   orderPlaced: number;
   totalSpent: number;
   createdAt: string;
-}
+};
 
-interface CustomersTableProps {
+type CustomersTableProps = {
   promise: Promise<{
     data: AwaitedCustomer[];
     pageCount: number;
   }>;
   storeId: string;
-}
+};
 
 export function CustomersTable({ promise, storeId }: CustomersTableProps) {
   const { data, pageCount } = React.use(promise);
diff --git a/src/components/tables/orders-table.tsx b/src/components/tables/orders-table.tsx
index 26f45511..61577139 100644
--- a/src/components/tables/orders-table.tsx
+++ b/src/components/tables/orders-table.tsx
@@ -1,17 +1,14 @@
 "use client";
 
-import * as React from "react";
-import Link from "next/link";
-import { type Order } from "~/db/schema";
-import type { StripePaymentStatus } from "~/types";
 import { DotsHorizontalIcon } from "@radix-ui/react-icons";
 import { type ColumnDef } from "@tanstack/react-table";
+import Link from "next/link";
+import * as React from "react";
 
-import {
-  getStripePaymentStatusColor,
-  stripePaymentStatuses,
-} from "~/lib/checkout";
-import { cn, formatDate, formatId, formatPrice } from "~/lib/utils";
+import type { StripePaymentStatus } from "~/types";
+
+import { DataTable } from "~/components/data-table/data-table";
+import { DataTableColumnHeader } from "~/components/data-table/data-table-column-header";
 import { Badge } from "~/components/ui/badge";
 import { Button } from "~/components/ui/button";
 import {
@@ -20,8 +17,12 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
-import { DataTable } from "~/components/data-table/data-table";
-import { DataTableColumnHeader } from "~/components/data-table/data-table-column-header";
+import {
+  getStripePaymentStatusColor,
+  stripePaymentStatuses,
+} from "~/server/checkout";
+import { type Order } from "~/server/db/schema";
+import { cn, formatDate, formatId, formatPrice } from "~/server/utils";
 
 type AwaitedOrder = Pick<Order, "id" | "quantity" | "amount" | "createdAt"> & {
   customer: string | null;
@@ -29,14 +30,14 @@ type AwaitedOrder = Pick<Order, "id" | "quantity" | "amount" | "createdAt"> & {
   paymentIntentId: string;
 };
 
-interface OrdersTableProps {
+type OrdersTableProps = {
   promise: Promise<{
     data: AwaitedOrder[];
     pageCount: number;
   }>;
   storeId: string;
   isSearchable?: boolean;
-}
+};
 
 export function OrdersTable({
   promise,
diff --git a/src/components/tables/products-table.tsx b/src/components/tables/products-table.tsx
index 831b9d50..2cd2c329 100644
--- a/src/components/tables/products-table.tsx
+++ b/src/components/tables/products-table.tsx
@@ -1,17 +1,13 @@
 "use client";
 
-import * as React from "react";
-import Link from "next/link";
-import { type Product } from "~/db/schema";
 import { DotsHorizontalIcon } from "@radix-ui/react-icons";
 import { type ColumnDef } from "@tanstack/react-table";
+import Link from "next/link";
+import * as React from "react";
 import { toast } from "sonner";
 
-import { deleteProduct } from "~/lib/actions/product";
-import { getErrorMessage } from "~/lib/handle-error";
-import { type getCategories } from "~/lib/queries/product";
-import { formatDate, formatPrice } from "~/lib/utils";
-import { useDataTable } from "~/hooks/use-data-table";
+import { DataTable } from "~/components/data-table/data-table";
+import { DataTableColumnHeader } from "~/components/data-table/data-table-column-header";
 import { Badge } from "~/components/ui/badge";
 import { Button } from "~/components/ui/button";
 import { Checkbox } from "~/components/ui/checkbox";
@@ -23,22 +19,26 @@ import {
   DropdownMenuShortcut,
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
-import { DataTable } from "~/components/data-table/data-table";
-import { DataTableColumnHeader } from "~/components/data-table/data-table-column-header";
+import { useDataTable } from "~/hooks/use-data-table";
+import { deleteProduct } from "~/server/actions/product";
+import { type Product } from "~/server/db/schema";
+import { getErrorMessage } from "~/server/handle-error";
+import { type getCategories } from "~/server/queries/product";
+import { formatDate, formatPrice } from "~/server/utils";
 
 type AwaitedProduct = Pick<
   Product,
   "id" | "name" | "categoryId" | "price" | "inventory" | "rating" | "createdAt"
 >;
 
-interface ProductsTableProps {
+type ProductsTableProps = {
   promise: Promise<{
     data: AwaitedProduct[];
     pageCount: number;
   }>;
   categoriesPromise: ReturnType<typeof getCategories>;
   storeId: string;
-}
+};
 
 export function ProductsTable({
   promise,
@@ -105,7 +105,9 @@ export function ProductsTable({
             (categoryData) => categoryData.name === category,
           );
 
-          if (!existingCategory) return null;
+          if (!existingCategory) {
+            return null;
+          }
 
           return (
             <Badge variant="outline" className="capitalize">
diff --git a/src/components/tables/purchases-table.tsx b/src/components/tables/purchases-table.tsx
index d5cc3e71..8eaef828 100644
--- a/src/components/tables/purchases-table.tsx
+++ b/src/components/tables/purchases-table.tsx
@@ -1,19 +1,15 @@
 "use client";
 
-import * as React from "react";
-import Link from "next/link";
-import { type Order } from "~/db/schema";
-import type { StripePaymentStatus } from "~/types";
 import { DotsHorizontalIcon } from "@radix-ui/react-icons";
 import { type ColumnDef } from "@tanstack/react-table";
+import Link from "next/link";
+import * as React from "react";
 import { z } from "zod";
 
-import {
-  getStripePaymentStatusColor,
-  stripePaymentStatuses,
-} from "~/lib/checkout";
-import { cn, formatDate, formatId, formatPrice } from "~/lib/utils";
-import { checkoutItemSchema } from "~/lib/validations/cart";
+import type { StripePaymentStatus } from "~/types";
+
+import { DataTable } from "~/components/data-table/data-table";
+import { DataTableColumnHeader } from "~/components/data-table/data-table-column-header";
 import { Badge } from "~/components/ui/badge";
 import { Button } from "~/components/ui/button";
 import {
@@ -22,8 +18,13 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
-import { DataTable } from "~/components/data-table/data-table";
-import { DataTableColumnHeader } from "~/components/data-table/data-table-column-header";
+import {
+  getStripePaymentStatusColor,
+  stripePaymentStatuses,
+} from "~/server/checkout";
+import { type Order } from "~/server/db/schema";
+import { cn, formatDate, formatId, formatPrice } from "~/server/utils";
+import { checkoutItemSchema } from "~/server/validations/cart";
 
 export type AwaitedOrder = Pick<
   Order,
@@ -33,12 +34,12 @@ export type AwaitedOrder = Pick<
   store: string | null;
 };
 
-interface PurchasesTableProps {
+type PurchasesTableProps = {
   promise: Promise<{
     data: AwaitedOrder[];
     pageCount: number;
   }>;
-}
+};
 
 export function PurchasesTable({ promise }: PurchasesTableProps) {
   const { data, pageCount } = React.use(promise);
diff --git a/src/components/tailwind-indicator.tsx b/src/components/tailwind-indicator.tsx
index ea9893ed..448512fd 100644
--- a/src/components/tailwind-indicator.tsx
+++ b/src/components/tailwind-indicator.tsx
@@ -1,7 +1,9 @@
 import { env } from "~/env.js";
 
 export function TailwindIndicator() {
-  if (env.NODE_ENV === "production") return null;
+  if (env.NODE_ENV === "production") {
+    return null;
+  }
 
   return (
     <div className="fixed bottom-1 left-1 z-50 flex size-6 items-center justify-center rounded-full bg-gray-800 p-3 font-mono text-xs text-white">
diff --git a/src/components/tailwind.tsx b/src/components/tailwind.tsx
new file mode 100644
index 00000000..05c2f2c0
--- /dev/null
+++ b/src/components/tailwind.tsx
@@ -0,0 +1,18 @@
+export function TailwindIndicator() {
+  if (process.env.NODE_ENV === "production") {
+    return null;
+  }
+
+  return (
+    <div className="fixed bottom-1 left-1 z-50 flex size-6 items-center justify-center rounded-full bg-gray-800 p-3 font-mono text-xs text-white">
+      <div className="block sm:hidden">xs</div>
+      <div className="hidden sm:block md:hidden lg:hidden xl:hidden 2xl:hidden">
+        sm
+      </div>
+      <div className="hidden md:block lg:hidden xl:hidden 2xl:hidden">md</div>
+      <div className="hidden lg:block xl:hidden 2xl:hidden">lg</div>
+      <div className="hidden xl:block 2xl:hidden">xl</div>
+      <div className="hidden 2xl:block">2xl</div>
+    </div>
+  );
+}
diff --git a/src/components/textarea-autosize.tsx b/src/components/textarea-autosize.tsx
index 4f99e584..68f3fa89 100644
--- a/src/components/textarea-autosize.tsx
+++ b/src/components/textarea-autosize.tsx
@@ -5,7 +5,7 @@ import ReactTextareaAutosize, {
   type TextareaAutosizeProps,
 } from "react-textarea-autosize";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const TextareaAutosize = React.forwardRef<
   HTMLTextAreaElement,
diff --git a/src/components/theming.tsx b/src/components/theming.tsx
new file mode 100644
index 00000000..d6a040fc
--- /dev/null
+++ b/src/components/theming.tsx
@@ -0,0 +1,60 @@
+"use client";
+
+import { LaptopIcon, MoonIcon, SunIcon } from "@radix-ui/react-icons";
+import { useTheme } from "next-themes";
+
+import type { ButtonProps } from "~/components/ui/button";
+
+import { Button } from "~/components/ui/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "~/components/ui/dropdown-menu";
+
+export function ThemeSwitcher({
+  variant,
+}: {
+  variant?: ButtonProps["variant"];
+}) {
+  const { setTheme } = useTheme();
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant={variant} size="icon" className="size-8">
+          <SunIcon className="rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
+          <MoonIcon className="absolute rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
+          <span className="sr-only">Toggle theme</span>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end">
+        <DropdownMenuItem
+          onClick={() => {
+            setTheme("light");
+          }}
+        >
+          <SunIcon className="mr-2 size-4" />
+          <span>Light</span>
+        </DropdownMenuItem>
+        <DropdownMenuItem
+          onClick={() => {
+            setTheme("dark");
+          }}
+        >
+          <MoonIcon className="mr-2 size-4" />
+          <span>Dark</span>
+        </DropdownMenuItem>
+        <DropdownMenuItem
+          onClick={() => {
+            setTheme("system");
+          }}
+        >
+          <LaptopIcon className="mr-2 size-4" />
+          <span>System</span>
+        </DropdownMenuItem>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}
diff --git a/src/components/ui/accordion.tsx b/src/components/ui/accordion.tsx
index cf6508b3..ee86de54 100644
--- a/src/components/ui/accordion.tsx
+++ b/src/components/ui/accordion.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import * as React from "react";
 import * as AccordionPrimitive from "@radix-ui/react-accordion";
 import { ChevronDownIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Accordion = AccordionPrimitive.Root;
 
diff --git a/src/components/ui/alert-dialog.tsx b/src/components/ui/alert-dialog.tsx
index c95d100c..7f552bff 100644
--- a/src/components/ui/alert-dialog.tsx
+++ b/src/components/ui/alert-dialog.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import * as React from "react";
 import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { buttonVariants } from "~/components/ui/button";
+import { cn } from "~/server/utils";
 
 const AlertDialog = AlertDialogPrimitive.Root;
 
diff --git a/src/components/ui/alert.tsx b/src/components/ui/alert.tsx
index 411d066a..35170b1c 100644
--- a/src/components/ui/alert.tsx
+++ b/src/components/ui/alert.tsx
@@ -1,7 +1,7 @@
-import * as React from "react";
 import { cva, type VariantProps } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const alertVariants = cva(
   "relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7",
diff --git a/src/components/ui/avatar.tsx b/src/components/ui/avatar.tsx
index 8be2b83b..e99dc49e 100644
--- a/src/components/ui/avatar.tsx
+++ b/src/components/ui/avatar.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Avatar = React.forwardRef<
   React.ElementRef<typeof AvatarPrimitive.Root>,
diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx
index ec46cbdf..37873b3b 100644
--- a/src/components/ui/badge.tsx
+++ b/src/components/ui/badge.tsx
@@ -1,7 +1,7 @@
-import * as React from "react";
 import { cva, type VariantProps } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const badgeVariants = cva(
   "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
@@ -23,9 +23,8 @@ const badgeVariants = cva(
   },
 );
 
-export interface BadgeProps
-  extends React.HTMLAttributes<HTMLDivElement>,
-    VariantProps<typeof badgeVariants> {}
+export type BadgeProps = {} & React.HTMLAttributes<HTMLDivElement> &
+  VariantProps<typeof badgeVariants>;
 
 function Badge({ className, variant, ...props }: BadgeProps) {
   return (
diff --git a/src/components/ui/breadcrumb.tsx b/src/components/ui/breadcrumb.tsx
index 53130383..04bba893 100644
--- a/src/components/ui/breadcrumb.tsx
+++ b/src/components/ui/breadcrumb.tsx
@@ -1,8 +1,8 @@
-import * as React from "react";
-import { ChevronRightIcon, DotsHorizontalIcon } from "@radix-ui/react-icons";
 import { Slot } from "@radix-ui/react-slot";
+import { ChevronRight, MoreHorizontal } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const Breadcrumb = React.forwardRef<
   HTMLElement,
@@ -80,10 +80,10 @@ const BreadcrumbSeparator = ({
   <li
     role="presentation"
     aria-hidden="true"
-    className={cn("[&>svg]:size-3.5", className)}
+    className={cn("[&>svg]:w-3.5 [&>svg]:h-3.5", className)}
     {...props}
   >
-    {children || <ChevronRightIcon />}
+    {children ?? <ChevronRight />}
   </li>
 );
 BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
@@ -95,10 +95,10 @@ const BreadcrumbEllipsis = ({
   <span
     role="presentation"
     aria-hidden="true"
-    className={cn("flex size-9 items-center justify-center", className)}
+    className={cn("flex h-9 w-9 items-center justify-center", className)}
     {...props}
   >
-    <DotsHorizontalIcon className="size-4" />
+    <MoreHorizontal className="h-4 w-4" />
     <span className="sr-only">More</span>
   </span>
 );
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index 4ee73085..4d0544dc 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -1,11 +1,11 @@
-import * as React from "react";
 import { Slot } from "@radix-ui/react-slot";
 import { cva, type VariantProps } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const buttonVariants = cva(
-  "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
   {
     variants: {
       variant: {
@@ -24,7 +24,7 @@ const buttonVariants = cva(
         default: "h-9 px-4 py-2",
         sm: "h-8 rounded-md px-3 text-xs",
         lg: "h-10 rounded-md px-8",
-        icon: "size-9",
+        icon: "h-9 w-9",
       },
     },
     defaultVariants: {
@@ -34,11 +34,10 @@ const buttonVariants = cva(
   },
 );
 
-export interface ButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-    VariantProps<typeof buttonVariants> {
+export type ButtonProps = {
   asChild?: boolean;
-}
+} & React.ButtonHTMLAttributes<HTMLButtonElement> &
+  VariantProps<typeof buttonVariants>;
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
diff --git a/src/components/ui/calendar.tsx b/src/components/ui/calendar.tsx
index e3469357..1dfdb61f 100644
--- a/src/components/ui/calendar.tsx
+++ b/src/components/ui/calendar.tsx
@@ -3,8 +3,8 @@
 import * as React from "react";
 import { DayPicker } from "react-day-picker";
 
-import { cn } from "~/lib/utils";
 import { buttonVariants } from "~/components/ui/button";
+import { cn } from "~/server/utils";
 
 export type CalendarProps = React.ComponentProps<typeof DayPicker>;
 
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
index 9639630a..7460dc47 100644
--- a/src/components/ui/card.tsx
+++ b/src/components/ui/card.tsx
@@ -1,14 +1,12 @@
 import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const Card = React.forwardRef<
   HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement> & {
-    as?: "div" | "section" | "article";
-  }
->(({ className, as: Comp = "div", ...props }, ref) => (
-  <Comp
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
     ref={ref}
     className={cn(
       "rounded-xl border bg-card text-card-foreground shadow",
@@ -32,22 +30,22 @@ const CardHeader = React.forwardRef<
 CardHeader.displayName = "CardHeader";
 
 const CardTitle = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLHeadingElement> & { as?: "h1" | "h2" | "h3" | "h4" }
->(({ className, as: Comp = "h3", ...props }, ref) => (
-  <Comp
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
     ref={ref}
-    className={cn("font-semibold leading-tight tracking-tight", className)}
+    className={cn("font-semibold leading-none tracking-tight", className)}
     {...props}
   />
 ));
 CardTitle.displayName = "CardTitle";
 
 const CardDescription = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLParagraphElement>
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
 >(({ className, ...props }, ref) => (
-  <p
+  <div
     ref={ref}
     className={cn("text-sm text-muted-foreground", className)}
     {...props}
@@ -77,9 +75,9 @@ CardFooter.displayName = "CardFooter";
 
 export {
   Card,
-  CardContent,
-  CardDescription,
-  CardFooter,
   CardHeader,
+  CardFooter,
   CardTitle,
+  CardDescription,
+  CardContent,
 };
diff --git a/src/components/ui/carousel.tsx b/src/components/ui/carousel.tsx
index e6082bf9..accb95cb 100644
--- a/src/components/ui/carousel.tsx
+++ b/src/components/ui/carousel.tsx
@@ -1,25 +1,25 @@
 "use client";
 
-import * as React from "react";
 import { ArrowLeftIcon, ArrowRightIcon } from "@radix-ui/react-icons";
 import useEmblaCarousel, {
   type UseEmblaCarouselType,
 } from "embla-carousel-react";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { Button } from "~/components/ui/button";
+import { cn } from "~/server/utils";
 
 type CarouselApi = UseEmblaCarouselType["1"];
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
 type CarouselOptions = UseCarouselParameters["0"];
 type CarouselPlugins = UseCarouselParameters["1"];
 
-interface CarouselProps {
+type CarouselProps = {
   opts?: CarouselOptions;
   plugins?: CarouselPlugins;
   orientation?: "horizontal" | "vertical";
   setApi?: (api: CarouselApi) => void;
-}
+};
 
 type CarouselContextProps = {
   carouselRef: ReturnType<typeof useEmblaCarousel>[0];
diff --git a/src/components/ui/chart.tsx b/src/components/ui/chart.tsx
new file mode 100644
index 00000000..42030fd9
--- /dev/null
+++ b/src/components/ui/chart.tsx
@@ -0,0 +1,368 @@
+"use client";
+
+import * as React from "react";
+import * as RechartsPrimitive from "recharts";
+import {
+  NameType,
+  Payload,
+  ValueType,
+} from "recharts/types/component/DefaultTooltipContent";
+
+import { cn } from "~/utils";
+
+// Format: { THEME_NAME: CSS_SELECTOR }
+const THEMES = { light: "", dark: ".dark" } as const;
+
+export type ChartConfig = Record<
+  string,
+  {
+    label?: React.ReactNode;
+    icon?: React.ComponentType;
+  } & (
+    | { color?: string; theme?: never }
+    | { color?: never; theme: Record<keyof typeof THEMES, string> }
+  )
+>;
+
+type ChartContextProps = {
+  config: ChartConfig;
+};
+
+const ChartContext = React.createContext<ChartContextProps | null>(null);
+
+function useChart() {
+  const context = React.useContext(ChartContext);
+
+  if (!context) {
+    throw new Error("useChart must be used within a <ChartContainer />");
+  }
+
+  return context;
+}
+
+const ChartContainer = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div"> & {
+    config: ChartConfig;
+    children: React.ComponentProps<
+      typeof RechartsPrimitive.ResponsiveContainer
+    >["children"];
+  }
+>(({ id, className, children, config, ...props }, ref) => {
+  const uniqueId = React.useId();
+  const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
+
+  return (
+    <ChartContext.Provider value={{ config }}>
+      <div
+        data-chart={chartId}
+        ref={ref}
+        className={cn(
+          "flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-none [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none",
+          className,
+        )}
+        {...props}
+      >
+        <ChartStyle id={chartId} config={config} />
+        <RechartsPrimitive.ResponsiveContainer>
+          {children}
+        </RechartsPrimitive.ResponsiveContainer>
+      </div>
+    </ChartContext.Provider>
+  );
+});
+ChartContainer.displayName = "Chart";
+
+const ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {
+  const colorConfig = Object.entries(config).filter(
+    ([_, config]) => config.theme || config.color,
+  );
+
+  if (!colorConfig.length) {
+    return null;
+  }
+
+  return (
+    <style
+      dangerouslySetInnerHTML={{
+        __html: Object.entries(THEMES)
+          .map(
+            ([theme, prefix]) => `
+${prefix} [data-chart=${id}] {
+${colorConfig
+  .map(([key, itemConfig]) => {
+    const color =
+      itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||
+      itemConfig.color;
+    return color ? `  --color-${key}: ${color};` : null;
+  })
+  .join("\n")}
+}
+`,
+          )
+          .join("\n"),
+      }}
+    />
+  );
+};
+
+const ChartTooltip = RechartsPrimitive.Tooltip;
+
+const ChartTooltipContent = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<typeof RechartsPrimitive.Tooltip> &
+    React.ComponentProps<"div"> & {
+      hideLabel?: boolean;
+      hideIndicator?: boolean;
+      indicator?: "line" | "dot" | "dashed";
+      nameKey?: string;
+      labelKey?: string;
+    }
+>(
+  (
+    {
+      active,
+      payload,
+      className,
+      indicator = "dot",
+      hideLabel = false,
+      hideIndicator = false,
+      label,
+      labelFormatter,
+      labelClassName,
+      formatter,
+      color,
+      nameKey,
+      labelKey,
+    },
+    ref,
+  ) => {
+    const { config } = useChart();
+
+    const tooltipLabel = React.useMemo(() => {
+      if (hideLabel || !payload?.length) {
+        return null;
+      }
+      const [item] = payload;
+      const key = `${labelKey || item?.dataKey || item?.name || "value"}`;
+      const itemConfig = getPayloadConfigFromPayload(config, item, key);
+      const value =
+        !labelKey && typeof label === "string"
+          ? config[label]?.label || label
+          : itemConfig?.label;
+
+      if (labelFormatter) {
+        return (
+          <div className={cn("font-medium", labelClassName)}>
+            {labelFormatter(value, payload)}
+          </div>
+        );
+      }
+
+      if (!value) {
+        return null;
+      }
+
+      return <div className={cn("font-medium", labelClassName)}>{value}</div>;
+    }, [
+      label,
+      labelFormatter,
+      payload,
+      hideLabel,
+      labelClassName,
+      config,
+      labelKey,
+    ]);
+
+    if (!active || !payload?.length) {
+      return null;
+    }
+
+    const nestLabel = payload.length === 1 && indicator !== "dot";
+
+    return (
+      <div
+        ref={ref}
+        className={cn(
+          "grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl",
+          className,
+        )}
+      >
+        {!nestLabel ? tooltipLabel : null}
+        <div className="grid gap-1.5">
+          {payload.map((item, index) => {
+            const key = `${nameKey || item.name || item.dataKey || "value"}`;
+            const itemConfig = getPayloadConfigFromPayload(config, item, key);
+            const indicatorColor = color || item.payload.fill || item.color;
+
+            return (
+              <div
+                key={item.dataKey}
+                className={cn(
+                  "flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground",
+                  indicator === "dot" && "items-center",
+                )}
+              >
+                {formatter && item?.value !== undefined && item.name ? (
+                  formatter(item.value, item.name, item, index, item.payload)
+                ) : (
+                  <>
+                    {itemConfig?.icon ? (
+                      <itemConfig.icon />
+                    ) : (
+                      !hideIndicator && (
+                        <div
+                          className={cn(
+                            "shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]",
+                            {
+                              "h-2.5 w-2.5": indicator === "dot",
+                              "w-1": indicator === "line",
+                              "w-0 border-[1.5px] border-dashed bg-transparent":
+                                indicator === "dashed",
+                              "my-0.5": nestLabel && indicator === "dashed",
+                            },
+                          )}
+                          style={
+                            {
+                              "--color-bg": indicatorColor,
+                              "--color-border": indicatorColor,
+                            } as React.CSSProperties
+                          }
+                        />
+                      )
+                    )}
+                    <div
+                      className={cn(
+                        "flex flex-1 justify-between leading-none",
+                        nestLabel ? "items-end" : "items-center",
+                      )}
+                    >
+                      <div className="grid gap-1.5">
+                        {nestLabel ? tooltipLabel : null}
+                        <span className="text-muted-foreground">
+                          {itemConfig?.label || item.name}
+                        </span>
+                      </div>
+                      {item.value && (
+                        <span className="font-mono font-medium tabular-nums text-foreground">
+                          {item.value.toLocaleString()}
+                        </span>
+                      )}
+                    </div>
+                  </>
+                )}
+              </div>
+            );
+          })}
+        </div>
+      </div>
+    );
+  },
+);
+ChartTooltipContent.displayName = "ChartTooltip";
+
+const ChartLegend = RechartsPrimitive.Legend;
+
+const ChartLegendContent = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div"> &
+    Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
+      hideIcon?: boolean;
+      nameKey?: string;
+    }
+>(
+  (
+    { className, hideIcon = false, payload, verticalAlign = "bottom", nameKey },
+    ref,
+  ) => {
+    const { config } = useChart();
+
+    if (!payload?.length) {
+      return null;
+    }
+
+    return (
+      <div
+        ref={ref}
+        className={cn(
+          "flex items-center justify-center gap-4",
+          verticalAlign === "top" ? "pb-3" : "pt-3",
+          className,
+        )}
+      >
+        {payload.map((item) => {
+          const key = `${nameKey || item.dataKey || "value"}`;
+          const itemConfig = getPayloadConfigFromPayload(config, item, key);
+
+          return (
+            <div
+              key={item.value}
+              className={cn(
+                "flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground",
+              )}
+            >
+              {itemConfig?.icon && !hideIcon ? (
+                <itemConfig.icon />
+              ) : (
+                <div
+                  className="h-2 w-2 shrink-0 rounded-[2px]"
+                  style={{
+                    backgroundColor: item.color,
+                  }}
+                />
+              )}
+              {itemConfig?.label}
+            </div>
+          );
+        })}
+      </div>
+    );
+  },
+);
+ChartLegendContent.displayName = "ChartLegend";
+
+// Helper to extract item config from a payload.
+function getPayloadConfigFromPayload(
+  config: ChartConfig,
+  payload: unknown,
+  key: string,
+) {
+  if (typeof payload !== "object" || payload === null) {
+    return undefined;
+  }
+
+  const payloadPayload =
+    "payload" in payload &&
+    typeof payload.payload === "object" &&
+    payload.payload !== null
+      ? payload.payload
+      : undefined;
+
+  let configLabelKey: string = key;
+
+  if (
+    key in payload &&
+    typeof payload[key as keyof typeof payload] === "string"
+  ) {
+    configLabelKey = payload[key as keyof typeof payload] as string;
+  } else if (
+    payloadPayload &&
+    key in payloadPayload &&
+    typeof payloadPayload[key as keyof typeof payloadPayload] === "string"
+  ) {
+    configLabelKey = payloadPayload[
+      key as keyof typeof payloadPayload
+    ] as string;
+  }
+
+  return configLabelKey in config ? config[configLabelKey] : config[key];
+}
+
+export {
+  ChartContainer,
+  ChartTooltip,
+  ChartTooltipContent,
+  ChartLegend,
+  ChartLegendContent,
+  ChartStyle,
+};
diff --git a/src/components/ui/checkbox.tsx b/src/components/ui/checkbox.tsx
index a28a37ab..5406d732 100644
--- a/src/components/ui/checkbox.tsx
+++ b/src/components/ui/checkbox.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import * as React from "react";
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 import { CheckIcon } from "@radix-ui/react-icons";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Checkbox = React.forwardRef<
   React.ElementRef<typeof CheckboxPrimitive.Root>,
diff --git a/src/components/ui/command.tsx b/src/components/ui/command.tsx
index 7185a6c5..5aa60ef6 100644
--- a/src/components/ui/command.tsx
+++ b/src/components/ui/command.tsx
@@ -1,12 +1,12 @@
 "use client";
 
-import * as React from "react";
 import { type DialogProps, DialogTitle } from "@radix-ui/react-dialog";
 import { MagnifyingGlassIcon } from "@radix-ui/react-icons";
 import { Command as CommandPrimitive } from "cmdk";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { Dialog, DialogContent } from "~/components/ui/dialog";
+import { cn } from "~/server/utils";
 
 const Command = React.forwardRef<
   React.ElementRef<typeof CommandPrimitive>,
@@ -23,7 +23,7 @@ const Command = React.forwardRef<
 ));
 Command.displayName = CommandPrimitive.displayName;
 
-interface CommandDialogProps extends DialogProps {}
+type CommandDialogProps = {} & DialogProps;
 
 const CommandDialog = ({ children, ...props }: CommandDialogProps) => {
   return (
diff --git a/src/components/ui/dialog.tsx b/src/components/ui/dialog.tsx
index 00efdd64..835f8c10 100644
--- a/src/components/ui/dialog.tsx
+++ b/src/components/ui/dialog.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import * as React from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import { Cross2Icon } from "@radix-ui/react-icons";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Dialog = DialogPrimitive.Root;
 
diff --git a/src/components/ui/drawer.tsx b/src/components/ui/drawer.tsx
index 0eab8552..7459961b 100644
--- a/src/components/ui/drawer.tsx
+++ b/src/components/ui/drawer.tsx
@@ -3,7 +3,7 @@
 import * as React from "react";
 import { Drawer as DrawerPrimitive } from "vaul";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const Drawer = ({
   shouldScaleBackground = true,
diff --git a/src/components/ui/dropdown-menu.tsx b/src/components/ui/dropdown-menu.tsx
index 6425c786..31f90c43 100644
--- a/src/components/ui/dropdown-menu.tsx
+++ b/src/components/ui/dropdown-menu.tsx
@@ -1,14 +1,10 @@
 "use client";
 
-import * as React from "react";
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
-import {
-  CheckIcon,
-  ChevronRightIcon,
-  DotFilledIcon,
-} from "@radix-ui/react-icons";
+import { Check, ChevronRight, Circle } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const DropdownMenu = DropdownMenuPrimitive.Root;
 
@@ -31,14 +27,14 @@ const DropdownMenuSubTrigger = React.forwardRef<
   <DropdownMenuPrimitive.SubTrigger
     ref={ref}
     className={cn(
-      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
+      "flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
       inset && "pl-8",
       className,
     )}
     {...props}
   >
     {children}
-    <ChevronRightIcon className="ml-auto size-4" />
+    <ChevronRight className="ml-auto" />
   </DropdownMenuPrimitive.SubTrigger>
 ));
 DropdownMenuSubTrigger.displayName =
@@ -51,7 +47,7 @@ const DropdownMenuSubContent = React.forwardRef<
   <DropdownMenuPrimitive.SubContent
     ref={ref}
     className={cn(
-      "z-50 min-w-32 overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       className,
     )}
     {...props}
@@ -69,7 +65,7 @@ const DropdownMenuContent = React.forwardRef<
       ref={ref}
       sideOffset={sideOffset}
       className={cn(
-        "z-50 min-w-32 overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md",
+        "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md",
         "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         className,
       )}
@@ -88,7 +84,7 @@ const DropdownMenuItem = React.forwardRef<
   <DropdownMenuPrimitive.Item
     ref={ref}
     className={cn(
-      "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0",
       inset && "pl-8",
       className,
     )}
@@ -110,9 +106,9 @@ const DropdownMenuCheckboxItem = React.forwardRef<
     checked={checked}
     {...props}
   >
-    <span className="absolute left-2 flex size-3.5 items-center justify-center">
+    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
       <DropdownMenuPrimitive.ItemIndicator>
-        <CheckIcon className="size-4" />
+        <Check className="h-4 w-4" />
       </DropdownMenuPrimitive.ItemIndicator>
     </span>
     {children}
@@ -133,9 +129,9 @@ const DropdownMenuRadioItem = React.forwardRef<
     )}
     {...props}
   >
-    <span className="absolute left-2 flex size-3.5 items-center justify-center">
+    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
       <DropdownMenuPrimitive.ItemIndicator>
-        <DotFilledIcon className="size-4 fill-current" />
+        <Circle className="h-2 w-2 fill-current" />
       </DropdownMenuPrimitive.ItemIndicator>
     </span>
     {children}
diff --git a/src/components/ui/form.tsx b/src/components/ui/form.tsx
index 868abccd..3bf843f1 100644
--- a/src/components/ui/form.tsx
+++ b/src/components/ui/form.tsx
@@ -1,6 +1,7 @@
-import * as React from "react";
 import type * as LabelPrimitive from "@radix-ui/react-label";
+
 import { Slot } from "@radix-ui/react-slot";
+import * as React from "react";
 import {
   Controller,
   FormProvider,
@@ -10,17 +11,17 @@ import {
   type FieldValues,
 } from "react-hook-form";
 
-import { cn } from "~/lib/utils";
 import { Label } from "~/components/ui/label";
+import { cn } from "~/server/utils";
 
 const Form = FormProvider;
 
-interface FormFieldContextValue<
+type FormFieldContextValue<
   TFieldValues extends FieldValues = FieldValues,
   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
-> {
+> = {
   name: TName;
-}
+};
 
 const FormFieldContext = React.createContext<FormFieldContextValue>(
   {} as FormFieldContextValue,
@@ -62,9 +63,9 @@ const useFormField = () => {
   };
 };
 
-interface FormItemContextValue {
+type FormItemContextValue = {
   id: string;
-}
+};
 
 const FormItemContext = React.createContext<FormItemContextValue>(
   {} as FormItemContextValue,
diff --git a/src/components/ui/hover-card.tsx b/src/components/ui/hover-card.tsx
index 15c8291d..3f94bd18 100644
--- a/src/components/ui/hover-card.tsx
+++ b/src/components/ui/hover-card.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const HoverCard = HoverCardPrimitive.Root;
 
diff --git a/src/components/ui/input-otp.tsx b/src/components/ui/input-otp.tsx
index 5130db4f..d304d2af 100644
--- a/src/components/ui/input-otp.tsx
+++ b/src/components/ui/input-otp.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import * as React from "react";
 import { DashIcon } from "@radix-ui/react-icons";
 import { OTPInput, OTPInputContext } from "input-otp";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const InputOTP = React.forwardRef<
   React.ElementRef<typeof OTPInput>,
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
index 8ee178c4..1b32db34 100644
--- a/src/components/ui/input.tsx
+++ b/src/components/ui/input.tsx
@@ -1,17 +1,14 @@
 import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
-export interface InputProps
-  extends React.InputHTMLAttributes<HTMLInputElement> {}
-
-const Input = React.forwardRef<HTMLInputElement, InputProps>(
+const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<"input">>(
   ({ className, type, ...props }, ref) => {
     return (
       <input
         type={type}
         className={cn(
-          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
           className,
         )}
         ref={ref}
diff --git a/src/components/ui/label.tsx b/src/components/ui/label.tsx
index 38dc5adf..3209101b 100644
--- a/src/components/ui/label.tsx
+++ b/src/components/ui/label.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import * as React from "react";
 import * as LabelPrimitive from "@radix-ui/react-label";
 import { cva, type VariantProps } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const labelVariants = cva(
   "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
diff --git a/src/components/ui/navigation-menu.tsx b/src/components/ui/navigation-menu.tsx
index 014bb4ec..411c3200 100644
--- a/src/components/ui/navigation-menu.tsx
+++ b/src/components/ui/navigation-menu.tsx
@@ -1,9 +1,9 @@
-import * as React from "react";
-import { ChevronDownIcon } from "@radix-ui/react-icons";
 import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 import { cva } from "class-variance-authority";
+import { ChevronDown } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const NavigationMenu = React.forwardRef<
   React.ElementRef<typeof NavigationMenuPrimitive.Root>,
@@ -54,8 +54,8 @@ const NavigationMenuTrigger = React.forwardRef<
     {...props}
   >
     {children}{" "}
-    <ChevronDownIcon
-      className="relative top-px ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180"
+    <ChevronDown
+      className="relative top-[1px] ml-1 h-3 w-3 transition duration-300 group-data-[state=open]:rotate-180"
       aria-hidden="true"
     />
   </NavigationMenuPrimitive.Trigger>
@@ -69,7 +69,7 @@ const NavigationMenuContent = React.forwardRef<
   <NavigationMenuPrimitive.Content
     ref={ref}
     className={cn(
-      "left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto",
+      "left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto ",
       className,
     )}
     {...props}
@@ -109,7 +109,7 @@ const NavigationMenuIndicator = React.forwardRef<
     )}
     {...props}
   >
-    <div className="relative top-[60%] size-2 rotate-45 rounded-tl-sm bg-border shadow-md" />
+    <div className="relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" />
   </NavigationMenuPrimitive.Indicator>
 ));
 NavigationMenuIndicator.displayName =
diff --git a/src/components/ui/pagination.tsx b/src/components/ui/pagination.tsx
index 8eb2ef92..31891fbb 100644
--- a/src/components/ui/pagination.tsx
+++ b/src/components/ui/pagination.tsx
@@ -1,13 +1,13 @@
-import * as React from "react";
-import Link from "next/link";
 import {
   ChevronLeftIcon,
   ChevronRightIcon,
   DotsHorizontalIcon,
 } from "@radix-ui/react-icons";
+import Link from "next/link";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
 import { buttonVariants, type ButtonProps } from "~/components/ui/button";
+import { cn } from "~/server/utils";
 
 const Pagination = ({ className, ...props }: React.ComponentProps<"nav">) => (
   <nav
diff --git a/src/components/ui/popover.tsx b/src/components/ui/popover.tsx
index 1a477d6c..51e50819 100644
--- a/src/components/ui/popover.tsx
+++ b/src/components/ui/popover.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Popover = PopoverPrimitive.Root;
 
diff --git a/src/components/ui/progress.tsx b/src/components/ui/progress.tsx
index 17e4d024..a5b207ff 100644
--- a/src/components/ui/progress.tsx
+++ b/src/components/ui/progress.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Progress = React.forwardRef<
   React.ElementRef<typeof ProgressPrimitive.Root>,
diff --git a/src/components/ui/scroll-area.tsx b/src/components/ui/scroll-area.tsx
index 223d5370..6eecf4c2 100644
--- a/src/components/ui/scroll-area.tsx
+++ b/src/components/ui/scroll-area.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const ScrollArea = React.forwardRef<
   React.ElementRef<typeof ScrollAreaPrimitive.Root>,
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index 98afb395..1230c443 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import * as React from "react";
 import { CaretSortIcon, CheckIcon } from "@radix-ui/react-icons";
 import * as SelectPrimitive from "@radix-ui/react-select";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Select = SelectPrimitive.Root;
 
diff --git a/src/components/ui/separator.tsx b/src/components/ui/separator.tsx
index 3fe94a58..03551579 100644
--- a/src/components/ui/separator.tsx
+++ b/src/components/ui/separator.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const Separator = React.forwardRef<
   React.ElementRef<typeof SeparatorPrimitive.Root>,
@@ -19,7 +19,7 @@ const Separator = React.forwardRef<
       orientation={orientation}
       className={cn(
         "shrink-0 bg-border",
-        orientation === "horizontal" ? "h-px w-full" : "h-full w-px",
+        orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
         className,
       )}
       {...props}
diff --git a/src/components/ui/sheet.tsx b/src/components/ui/sheet.tsx
index c887ff8b..ae93be08 100644
--- a/src/components/ui/sheet.tsx
+++ b/src/components/ui/sheet.tsx
@@ -1,11 +1,11 @@
 "use client";
 
-import * as React from "react";
 import * as SheetPrimitive from "@radix-ui/react-dialog";
-import { Cross2Icon } from "@radix-ui/react-icons";
 import { cva, type VariantProps } from "class-variance-authority";
+import { X } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const Sheet = SheetPrimitive.Root;
 
@@ -21,7 +21,7 @@ const SheetOverlay = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Overlay
     className={cn(
-      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "fixed inset-0 z-50 bg-background/90 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       className,
     )}
     {...props}
@@ -31,7 +31,7 @@ const SheetOverlay = React.forwardRef<
 SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
 
 const sheetVariants = cva(
-  "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",
+  "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=open]:border-border/40",
   {
     variants: {
       side: {
@@ -49,9 +49,10 @@ const sheetVariants = cva(
   },
 );
 
-interface SheetContentProps
-  extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
-    VariantProps<typeof sheetVariants> {}
+type SheetContentProps = {} & React.ComponentPropsWithoutRef<
+  typeof SheetPrimitive.Content
+> &
+  VariantProps<typeof sheetVariants>;
 
 const SheetContent = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Content>,
@@ -64,11 +65,13 @@ const SheetContent = React.forwardRef<
       className={cn(sheetVariants({ side }), className)}
       {...props}
     >
+      {/* <SheetPrimitive.Close className="right-4 top-2 p-1 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none">
+        <kbd className="inline-flex select-none items-center gap-1 rounded border bg-muted px-2 py-1 font-mono font-medium opacity-100">
+          <span className="text-xs">ESC</span>
+          <span className="sr-only">Close</span>
+        </kbd>
+      </SheetPrimitive.Close> */}
       {children}
-      <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
-        <Cross2Icon className="size-4" />
-        <span className="sr-only">Close</span>
-      </SheetPrimitive.Close>
     </SheetPrimitive.Content>
   </SheetPortal>
 ));
diff --git a/src/components/ui/sidebar.tsx b/src/components/ui/sidebar.tsx
new file mode 100644
index 00000000..9125115a
--- /dev/null
+++ b/src/components/ui/sidebar.tsx
@@ -0,0 +1,771 @@
+"use client";
+
+import { Slot } from "@radix-ui/react-slot";
+import { type VariantProps, cva } from "class-variance-authority";
+import { PanelLeft } from "lucide-react";
+import * as React from "react";
+
+import { Button } from "~/components/ui/button";
+import { Input } from "~/components/ui/input";
+import { Separator } from "~/components/ui/separator";
+import { Sheet, SheetContent } from "~/components/ui/sheet";
+import { Skeleton } from "~/components/ui/skeleton";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "~/components/ui/tooltip";
+import { useIsMobile } from "~/hooks/use-mobile";
+import { cn } from "~/utils";
+
+const SIDEBAR_COOKIE_NAME = "sidebar:state";
+const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
+const SIDEBAR_WIDTH = "16rem";
+const SIDEBAR_WIDTH_MOBILE = "18rem";
+const SIDEBAR_WIDTH_ICON = "3rem";
+const SIDEBAR_KEYBOARD_SHORTCUT = "b";
+
+type SidebarContext = {
+  state: "expanded" | "collapsed";
+  open: boolean;
+  setOpen: (open: boolean) => void;
+  openMobile: boolean;
+  setOpenMobile: (open: boolean) => void;
+  isMobile: boolean;
+  toggleSidebar: () => void;
+};
+
+const SidebarContext = React.createContext<SidebarContext | null>(null);
+
+function useSidebar() {
+  const context = React.useContext(SidebarContext);
+  if (!context) {
+    throw new Error("useSidebar must be used within a SidebarProvider.");
+  }
+
+  return context;
+}
+
+const SidebarProvider = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div"> & {
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+  }
+>(
+  (
+    {
+      defaultOpen = true,
+      open: openProp,
+      onOpenChange: setOpenProp,
+      className,
+      style,
+      children,
+      ...props
+    },
+    ref,
+  ) => {
+    const isMobile = useIsMobile();
+    const [openMobile, setOpenMobile] = React.useState(false);
+
+    // This is the internal state of the sidebar.
+    // We use openProp and setOpenProp for control from outside the component.
+    const [_open, _setOpen] = React.useState(defaultOpen);
+    const open = openProp ?? _open;
+    const setOpen = React.useCallback(
+      (value: boolean | ((value: boolean) => boolean)) => {
+        const openState = typeof value === "function" ? value(open) : value;
+        if (setOpenProp) {
+          setOpenProp(openState);
+        } else {
+          _setOpen(openState);
+        }
+
+        // This sets the cookie to keep the sidebar state.
+        document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+      },
+      [setOpenProp, open],
+    );
+
+    // Helper to toggle the sidebar.
+    const toggleSidebar = React.useCallback(() => {
+      return isMobile
+        ? setOpenMobile((open) => !open)
+        : setOpen((open) => !open);
+    }, [isMobile, setOpen, setOpenMobile]);
+
+    // Adds a keyboard shortcut to toggle the sidebar.
+    React.useEffect(() => {
+      const handleKeyDown = (event: KeyboardEvent) => {
+        if (
+          event.key === SIDEBAR_KEYBOARD_SHORTCUT &&
+          (event.metaKey || event.ctrlKey)
+        ) {
+          event.preventDefault();
+          toggleSidebar();
+        }
+      };
+
+      window.addEventListener("keydown", handleKeyDown);
+      return () => window.removeEventListener("keydown", handleKeyDown);
+    }, [toggleSidebar]);
+
+    // We add a state so that we can do data-state="expanded" or "collapsed".
+    // This makes it easier to style the sidebar with Tailwind classes.
+    const state = open ? "expanded" : "collapsed";
+
+    const contextValue = React.useMemo<SidebarContext>(
+      () => ({
+        state,
+        open,
+        setOpen,
+        isMobile,
+        openMobile,
+        setOpenMobile,
+        toggleSidebar,
+      }),
+      [
+        state,
+        open,
+        setOpen,
+        isMobile,
+        openMobile,
+        setOpenMobile,
+        toggleSidebar,
+      ],
+    );
+
+    return (
+      <SidebarContext.Provider value={contextValue}>
+        <TooltipProvider delayDuration={0}>
+          <div
+            style={
+              {
+                "--sidebar-width": SIDEBAR_WIDTH,
+                "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
+                ...style,
+              } as React.CSSProperties
+            }
+            className={cn(
+              "group/sidebar-wrapper flex min-h-svh w-full has-[[data-variant=inset]]:bg-sidebar",
+              className,
+            )}
+            ref={ref}
+            {...props}
+          >
+            {children}
+          </div>
+        </TooltipProvider>
+      </SidebarContext.Provider>
+    );
+  },
+);
+SidebarProvider.displayName = "SidebarProvider";
+
+const Sidebar = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div"> & {
+    side?: "left" | "right";
+    variant?: "sidebar" | "floating" | "inset";
+    collapsible?: "offcanvas" | "icon" | "none";
+  }
+>(
+  (
+    {
+      side = "left",
+      variant = "sidebar",
+      collapsible = "offcanvas",
+      className,
+      children,
+      ...props
+    },
+    ref,
+  ) => {
+    const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
+
+    if (collapsible === "none") {
+      return (
+        <div
+          className={cn(
+            "flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground",
+            className,
+          )}
+          ref={ref}
+          {...props}
+        >
+          {children}
+        </div>
+      );
+    }
+
+    if (isMobile) {
+      return (
+        <Sheet open={openMobile} onOpenChange={setOpenMobile} {...props}>
+          <SheetContent
+            data-sidebar="sidebar"
+            data-mobile="true"
+            className="w-[--sidebar-width] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden"
+            style={
+              {
+                "--sidebar-width": SIDEBAR_WIDTH_MOBILE,
+              } as React.CSSProperties
+            }
+            side={side}
+          >
+            <div className="flex h-full w-full flex-col">{children}</div>
+          </SheetContent>
+        </Sheet>
+      );
+    }
+
+    return (
+      <div
+        ref={ref}
+        className="group peer hidden md:block text-sidebar-foreground"
+        data-state={state}
+        data-collapsible={state === "collapsed" ? collapsible : ""}
+        data-variant={variant}
+        data-side={side}
+      >
+        {/* This is what handles the sidebar gap on desktop */}
+        <div
+          className={cn(
+            "duration-200 relative h-svh w-[--sidebar-width] bg-transparent transition-[width] ease-linear",
+            "group-data-[collapsible=offcanvas]:w-0",
+            "group-data-[side=right]:rotate-180",
+            variant === "floating" || variant === "inset"
+              ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]"
+              : "group-data-[collapsible=icon]:w-[--sidebar-width-icon]",
+          )}
+        />
+        <div
+          className={cn(
+            "duration-200 fixed inset-y-0 z-10 hidden h-svh w-[--sidebar-width] transition-[left,right,width] ease-linear md:flex",
+            side === "left"
+              ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]"
+              : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
+            // Adjust the padding for floating and inset variants.
+            variant === "floating" || variant === "inset"
+              ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]"
+              : "group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",
+            className,
+          )}
+          {...props}
+        >
+          <div
+            data-sidebar="sidebar"
+            className="flex h-full w-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow"
+          >
+            {children}
+          </div>
+        </div>
+      </div>
+    );
+  },
+);
+Sidebar.displayName = "Sidebar";
+
+const SidebarTrigger = React.forwardRef<
+  React.ElementRef<typeof Button>,
+  React.ComponentProps<typeof Button>
+>(({ className, onClick, ...props }, ref) => {
+  const { toggleSidebar } = useSidebar();
+
+  return (
+    <Button
+      ref={ref}
+      data-sidebar="trigger"
+      variant="ghost"
+      size="icon"
+      className={cn("h-7 w-7", className)}
+      onClick={(event) => {
+        onClick?.(event);
+        toggleSidebar();
+      }}
+      {...props}
+    >
+      <PanelLeft />
+      <span className="sr-only">Toggle Sidebar</span>
+    </Button>
+  );
+});
+SidebarTrigger.displayName = "SidebarTrigger";
+
+const SidebarRail = React.forwardRef<
+  HTMLButtonElement,
+  React.ComponentProps<"button">
+>(({ className, ...props }, ref) => {
+  const { toggleSidebar } = useSidebar();
+
+  return (
+    <button
+      ref={ref}
+      data-sidebar="rail"
+      aria-label="Toggle Sidebar"
+      tabIndex={-1}
+      onClick={toggleSidebar}
+      title="Toggle Sidebar"
+      className={cn(
+        "absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex",
+        "[[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize",
+        "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
+        "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar",
+        "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
+        "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+SidebarRail.displayName = "SidebarRail";
+
+const SidebarInset = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"main">
+>(({ className, ...props }, ref) => {
+  return (
+    <main
+      ref={ref}
+      className={cn(
+        "relative flex min-h-svh flex-1 flex-col bg-background",
+        "peer-data-[variant=inset]:min-h-[calc(100svh-theme(spacing.4))] md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow",
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+SidebarInset.displayName = "SidebarInset";
+
+const SidebarInput = React.forwardRef<
+  React.ElementRef<typeof Input>,
+  React.ComponentProps<typeof Input>
+>(({ className, ...props }, ref) => {
+  return (
+    <Input
+      ref={ref}
+      data-sidebar="input"
+      className={cn(
+        "h-8 w-full bg-background shadow-none focus-visible:ring-2 focus-visible:ring-sidebar-ring",
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+SidebarInput.displayName = "SidebarInput";
+
+const SidebarHeader = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div">
+>(({ className, ...props }, ref) => {
+  return (
+    <div
+      ref={ref}
+      data-sidebar="header"
+      className={cn("flex flex-col gap-2 p-2", className)}
+      {...props}
+    />
+  );
+});
+SidebarHeader.displayName = "SidebarHeader";
+
+const SidebarFooter = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div">
+>(({ className, ...props }, ref) => {
+  return (
+    <div
+      ref={ref}
+      data-sidebar="footer"
+      className={cn("flex flex-col gap-2 p-2", className)}
+      {...props}
+    />
+  );
+});
+SidebarFooter.displayName = "SidebarFooter";
+
+const SidebarSeparator = React.forwardRef<
+  React.ElementRef<typeof Separator>,
+  React.ComponentProps<typeof Separator>
+>(({ className, ...props }, ref) => {
+  return (
+    <Separator
+      ref={ref}
+      data-sidebar="separator"
+      className={cn("mx-2 w-auto bg-sidebar-border", className)}
+      {...props}
+    />
+  );
+});
+SidebarSeparator.displayName = "SidebarSeparator";
+
+const SidebarContent = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div">
+>(({ className, ...props }, ref) => {
+  return (
+    <div
+      ref={ref}
+      data-sidebar="content"
+      className={cn(
+        "flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+SidebarContent.displayName = "SidebarContent";
+
+const SidebarGroup = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div">
+>(({ className, ...props }, ref) => {
+  return (
+    <div
+      ref={ref}
+      data-sidebar="group"
+      className={cn("relative flex w-full min-w-0 flex-col p-2", className)}
+      {...props}
+    />
+  );
+});
+SidebarGroup.displayName = "SidebarGroup";
+
+const SidebarGroupLabel = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div"> & { asChild?: boolean }
+>(({ className, asChild = false, ...props }, ref) => {
+  const Comp = asChild ? Slot : "div";
+
+  return (
+    <Comp
+      ref={ref}
+      data-sidebar="group-label"
+      className={cn(
+        "duration-200 flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 outline-none ring-sidebar-ring transition-[margin,opa] ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+SidebarGroupLabel.displayName = "SidebarGroupLabel";
+
+const SidebarGroupAction = React.forwardRef<
+  HTMLButtonElement,
+  React.ComponentProps<"button"> & { asChild?: boolean }
+>(({ className, asChild = false, ...props }, ref) => {
+  const Comp = asChild ? Slot : "button";
+
+  return (
+    <Comp
+      ref={ref}
+      data-sidebar="group-action"
+      className={cn(
+        "absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        // Increases the hit area of the button on mobile.
+        "after:absolute after:-inset-2 after:md:hidden",
+        "group-data-[collapsible=icon]:hidden",
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+SidebarGroupAction.displayName = "SidebarGroupAction";
+
+const SidebarGroupContent = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div">
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    data-sidebar="group-content"
+    className={cn("w-full text-sm", className)}
+    {...props}
+  />
+));
+SidebarGroupContent.displayName = "SidebarGroupContent";
+
+const SidebarMenu = React.forwardRef<
+  HTMLUListElement,
+  React.ComponentProps<"ul">
+>(({ className, ...props }, ref) => (
+  <ul
+    ref={ref}
+    data-sidebar="menu"
+    className={cn("flex w-full min-w-0 flex-col gap-1", className)}
+    {...props}
+  />
+));
+SidebarMenu.displayName = "SidebarMenu";
+
+const SidebarMenuItem = React.forwardRef<
+  HTMLLIElement,
+  React.ComponentProps<"li">
+>(({ className, ...props }, ref) => (
+  <li
+    ref={ref}
+    data-sidebar="menu-item"
+    className={cn("group/menu-item relative", className)}
+    {...props}
+  />
+));
+SidebarMenuItem.displayName = "SidebarMenuItem";
+
+const sidebarMenuButtonVariants = cva(
+  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+        outline:
+          "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]",
+      },
+      size: {
+        default: "h-8 text-sm",
+        sm: "h-7 text-xs",
+        lg: "h-12 text-sm group-data-[collapsible=icon]:!p-0",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  },
+);
+
+const SidebarMenuButton = React.forwardRef<
+  HTMLButtonElement,
+  React.ComponentProps<"button"> & {
+    asChild?: boolean;
+    isActive?: boolean;
+    tooltip?: string | React.ComponentProps<typeof TooltipContent>;
+  } & VariantProps<typeof sidebarMenuButtonVariants>
+>(
+  (
+    {
+      asChild = false,
+      isActive = false,
+      variant = "default",
+      size = "default",
+      tooltip,
+      className,
+      ...props
+    },
+    ref,
+  ) => {
+    const Comp = asChild ? Slot : "button";
+    const { isMobile, state } = useSidebar();
+
+    const button = (
+      <Comp
+        ref={ref}
+        data-sidebar="menu-button"
+        data-size={size}
+        data-active={isActive}
+        className={cn(sidebarMenuButtonVariants({ variant, size }), className)}
+        {...props}
+      />
+    );
+
+    if (!tooltip) {
+      return button;
+    }
+
+    if (typeof tooltip === "string") {
+      tooltip = {
+        children: tooltip,
+      };
+    }
+
+    return (
+      <Tooltip>
+        <TooltipTrigger asChild>{button}</TooltipTrigger>
+        <TooltipContent
+          side="right"
+          align="center"
+          hidden={state !== "collapsed" || isMobile}
+          {...tooltip}
+        />
+      </Tooltip>
+    );
+  },
+);
+SidebarMenuButton.displayName = "SidebarMenuButton";
+
+const SidebarMenuAction = React.forwardRef<
+  HTMLButtonElement,
+  React.ComponentProps<"button"> & {
+    asChild?: boolean;
+    showOnHover?: boolean;
+  }
+>(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
+  const Comp = asChild ? Slot : "button";
+
+  return (
+    <Comp
+      ref={ref}
+      data-sidebar="menu-action"
+      className={cn(
+        "absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
+        // Increases the hit area of the button on mobile.
+        "after:absolute after:-inset-2 after:md:hidden",
+        "peer-data-[size=sm]/menu-button:top-1",
+        "peer-data-[size=default]/menu-button:top-1.5",
+        "peer-data-[size=lg]/menu-button:top-2.5",
+        "group-data-[collapsible=icon]:hidden",
+        showOnHover &&
+          "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground md:opacity-0",
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+SidebarMenuAction.displayName = "SidebarMenuAction";
+
+const SidebarMenuBadge = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div">
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    data-sidebar="menu-badge"
+    className={cn(
+      "absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums text-sidebar-foreground select-none pointer-events-none",
+      "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
+      "peer-data-[size=sm]/menu-button:top-1",
+      "peer-data-[size=default]/menu-button:top-1.5",
+      "peer-data-[size=lg]/menu-button:top-2.5",
+      "group-data-[collapsible=icon]:hidden",
+      className,
+    )}
+    {...props}
+  />
+));
+SidebarMenuBadge.displayName = "SidebarMenuBadge";
+
+const SidebarMenuSkeleton = React.forwardRef<
+  HTMLDivElement,
+  React.ComponentProps<"div"> & {
+    showIcon?: boolean;
+  }
+>(({ className, showIcon = false, ...props }, ref) => {
+  // Random width between 50 to 90%.
+  const width = React.useMemo(() => {
+    return `${Math.floor(Math.random() * 40) + 50}%`;
+  }, []);
+
+  return (
+    <div
+      ref={ref}
+      data-sidebar="menu-skeleton"
+      className={cn("rounded-md h-8 flex gap-2 px-2 items-center", className)}
+      {...props}
+    >
+      {showIcon && (
+        <Skeleton
+          className="size-4 rounded-md"
+          data-sidebar="menu-skeleton-icon"
+        />
+      )}
+      <Skeleton
+        className="h-4 flex-1 max-w-[--skeleton-width]"
+        data-sidebar="menu-skeleton-text"
+        style={
+          {
+            "--skeleton-width": width,
+          } as React.CSSProperties
+        }
+      />
+    </div>
+  );
+});
+SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
+
+const SidebarMenuSub = React.forwardRef<
+  HTMLUListElement,
+  React.ComponentProps<"ul">
+>(({ className, ...props }, ref) => (
+  <ul
+    ref={ref}
+    data-sidebar="menu-sub"
+    className={cn(
+      "mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5",
+      "group-data-[collapsible=icon]:hidden",
+      className,
+    )}
+    {...props}
+  />
+));
+SidebarMenuSub.displayName = "SidebarMenuSub";
+
+const SidebarMenuSubItem = React.forwardRef<
+  HTMLLIElement,
+  React.ComponentProps<"li">
+>(({ ...props }, ref) => <li ref={ref} {...props} />);
+SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
+
+const SidebarMenuSubButton = React.forwardRef<
+  HTMLAnchorElement,
+  React.ComponentProps<"a"> & {
+    asChild?: boolean;
+    size?: "sm" | "md";
+    isActive?: boolean;
+  }
+>(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
+  const Comp = asChild ? Slot : "a";
+
+  return (
+    <Comp
+      ref={ref}
+      data-sidebar="menu-sub-button"
+      data-size={size}
+      data-active={isActive}
+      className={cn(
+        "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
+        "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
+        size === "sm" && "text-xs",
+        size === "md" && "text-sm",
+        "group-data-[collapsible=icon]:hidden",
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
+
+export {
+  Sidebar,
+  SidebarContent,
+  SidebarFooter,
+  SidebarGroup,
+  SidebarGroupAction,
+  SidebarGroupContent,
+  SidebarGroupLabel,
+  SidebarHeader,
+  SidebarInput,
+  SidebarInset,
+  SidebarMenu,
+  SidebarMenuAction,
+  SidebarMenuBadge,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  SidebarMenuSkeleton,
+  SidebarMenuSub,
+  SidebarMenuSubButton,
+  SidebarMenuSubItem,
+  SidebarProvider,
+  SidebarRail,
+  SidebarSeparator,
+  SidebarTrigger,
+  useSidebar,
+};
diff --git a/src/components/ui/skeleton.tsx b/src/components/ui/skeleton.tsx
index fb68d30a..60b3720a 100644
--- a/src/components/ui/skeleton.tsx
+++ b/src/components/ui/skeleton.tsx
@@ -1,4 +1,4 @@
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 function Skeleton({
   className,
diff --git a/src/components/ui/slider.tsx b/src/components/ui/slider.tsx
index 1b54df88..27544588 100644
--- a/src/components/ui/slider.tsx
+++ b/src/components/ui/slider.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as SliderPrimitive from "@radix-ui/react-slider";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Slider = React.forwardRef<
   React.ElementRef<typeof SliderPrimitive.Root>,
diff --git a/src/components/ui/sonner.tsx b/src/components/ui/sonner.tsx
new file mode 100644
index 00000000..549cf841
--- /dev/null
+++ b/src/components/ui/sonner.tsx
@@ -0,0 +1,31 @@
+"use client";
+
+import { useTheme } from "next-themes";
+import { Toaster as Sonner } from "sonner";
+
+type ToasterProps = React.ComponentProps<typeof Sonner>;
+
+const Toaster = ({ ...props }: ToasterProps) => {
+  const { theme = "system" } = useTheme();
+
+  return (
+    <Sonner
+      theme={theme as ToasterProps["theme"]}
+      className="toaster group"
+      toastOptions={{
+        classNames: {
+          toast:
+            "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
+          description: "group-[.toast]:text-muted-foreground",
+          actionButton:
+            "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
+          cancelButton:
+            "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
+        },
+      }}
+      {...props}
+    />
+  );
+};
+
+export { Toaster };
diff --git a/src/components/ui/switch.tsx b/src/components/ui/switch.tsx
index 86ffe03a..56e301f7 100644
--- a/src/components/ui/switch.tsx
+++ b/src/components/ui/switch.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as SwitchPrimitives from "@radix-ui/react-switch";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Switch = React.forwardRef<
   React.ElementRef<typeof SwitchPrimitives.Root>,
diff --git a/src/components/ui/table.tsx b/src/components/ui/table.tsx
index 351b933c..005822d9 100644
--- a/src/components/ui/table.tsx
+++ b/src/components/ui/table.tsx
@@ -1,6 +1,6 @@
 import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Table = React.forwardRef<
   HTMLTableElement,
diff --git a/src/components/ui/tabs.tsx b/src/components/ui/tabs.tsx
index a79e73a9..32eee283 100644
--- a/src/components/ui/tabs.tsx
+++ b/src/components/ui/tabs.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
 const Tabs = TabsPrimitive.Root;
 
diff --git a/src/components/ui/textarea.tsx b/src/components/ui/textarea.tsx
index 7bfe407d..c45ff2ed 100644
--- a/src/components/ui/textarea.tsx
+++ b/src/components/ui/textarea.tsx
@@ -1,9 +1,9 @@
 import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/server/utils";
 
-export interface TextareaProps
-  extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
+export type TextareaProps =
+  {} & React.TextareaHTMLAttributes<HTMLTextAreaElement>;
 
 const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
   ({ className, ...props }, ref) => {
diff --git a/src/components/ui/toast.tsx b/src/components/ui/toast.tsx
new file mode 100644
index 00000000..2ea9f8e9
--- /dev/null
+++ b/src/components/ui/toast.tsx
@@ -0,0 +1,129 @@
+"use client";
+
+import * as ToastPrimitives from "@radix-ui/react-toast";
+import { cva, type VariantProps } from "class-variance-authority";
+import { X } from "lucide-react";
+import * as React from "react";
+
+import { cn } from "~/utils";
+
+const ToastProvider = ToastPrimitives.Provider;
+
+const ToastViewport = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Viewport>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Viewport
+    ref={ref}
+    className={cn(
+      "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
+      className,
+    )}
+    {...props}
+  />
+));
+ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
+
+const toastVariants = cva(
+  "group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border p-4 pr-6 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
+  {
+    variants: {
+      variant: {
+        default: "border bg-background text-foreground",
+        destructive:
+          "destructive group border-destructive bg-destructive text-destructive-foreground",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  },
+);
+
+const Toast = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Root>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
+    VariantProps<typeof toastVariants>
+>(({ className, variant, ...props }, ref) => {
+  return (
+    <ToastPrimitives.Root
+      ref={ref}
+      className={cn(toastVariants({ variant }), className)}
+      {...props}
+    />
+  );
+});
+Toast.displayName = ToastPrimitives.Root.displayName;
+
+const ToastAction = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Action>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Action
+    ref={ref}
+    className={cn(
+      "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
+      className,
+    )}
+    {...props}
+  />
+));
+ToastAction.displayName = ToastPrimitives.Action.displayName;
+
+const ToastClose = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Close>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Close
+    ref={ref}
+    className={cn(
+      "absolute right-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
+      className,
+    )}
+    toast-close=""
+    {...props}
+  >
+    <X className="h-4 w-4" />
+  </ToastPrimitives.Close>
+));
+ToastClose.displayName = ToastPrimitives.Close.displayName;
+
+const ToastTitle = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Title>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Title
+    ref={ref}
+    className={cn("text-sm font-semibold [&+div]:text-xs", className)}
+    {...props}
+  />
+));
+ToastTitle.displayName = ToastPrimitives.Title.displayName;
+
+const ToastDescription = React.forwardRef<
+  React.ElementRef<typeof ToastPrimitives.Description>,
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
+>(({ className, ...props }, ref) => (
+  <ToastPrimitives.Description
+    ref={ref}
+    className={cn("text-sm opacity-90", className)}
+    {...props}
+  />
+));
+ToastDescription.displayName = ToastPrimitives.Description.displayName;
+
+type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
+
+type ToastActionElement = React.ReactElement<typeof ToastAction>;
+
+export {
+  type ToastProps,
+  type ToastActionElement,
+  ToastProvider,
+  ToastViewport,
+  Toast,
+  ToastTitle,
+  ToastDescription,
+  ToastClose,
+  ToastAction,
+};
diff --git a/src/components/ui/toaster.tsx b/src/components/ui/toaster.tsx
index 79926117..b8e21f5d 100644
--- a/src/components/ui/toaster.tsx
+++ b/src/components/ui/toaster.tsx
@@ -1,31 +1,31 @@
 "use client";
 
-import { useTheme } from "next-themes";
-import { Toaster as Sonner } from "sonner";
+import {
+  Toast,
+  ToastClose,
+  ToastDescription,
+  ToastProvider,
+  ToastTitle,
+  ToastViewport,
+} from "~/components/ui/toast";
+import { useToast } from "~/hooks/use-toast";
 
-type ToasterProps = React.ComponentProps<typeof Sonner>;
-
-function Toaster({ ...props }: ToasterProps) {
-  const { theme = "system" } = useTheme();
+export function Toaster() {
+  const { toasts } = useToast();
 
   return (
-    <Sonner
-      theme={theme as ToasterProps["theme"]}
-      className="toaster group"
-      toastOptions={{
-        classNames: {
-          toast:
-            "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
-          description: "group-[.toast]:text-muted-foreground",
-          actionButton:
-            "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
-          cancelButton:
-            "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
-        },
-      }}
-      {...props}
-    />
+    <ToastProvider>
+      {toasts.map(({ id, title, description, action, ...props }) => (
+        <Toast key={id} {...props}>
+          <div className="grid gap-1">
+            {title && <ToastTitle>{title}</ToastTitle>}
+            {description && <ToastDescription>{description}</ToastDescription>}
+          </div>
+          {action}
+          <ToastClose />
+        </Toast>
+      ))}
+      <ToastViewport />
+    </ToastProvider>
   );
 }
-
-export { Toaster };
diff --git a/src/components/ui/tooltip.tsx b/src/components/ui/tooltip.tsx
index ddadda6f..8cc91d58 100644
--- a/src/components/ui/tooltip.tsx
+++ b/src/components/ui/tooltip.tsx
@@ -1,9 +1,9 @@
 "use client";
 
-import * as React from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import * as React from "react";
 
-import { cn } from "~/lib/utils";
+import { cn } from "~/utils";
 
 const TooltipProvider = TooltipPrimitive.Provider;
 
@@ -15,15 +15,17 @@ const TooltipContent = React.forwardRef<
   React.ElementRef<typeof TooltipPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
 >(({ className, sideOffset = 4, ...props }, ref) => (
-  <TooltipPrimitive.Content
-    ref={ref}
-    sideOffset={sideOffset}
-    className={cn(
-      "z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className,
-    )}
-    {...props}
-  />
+  <TooltipPrimitive.Portal>
+    <TooltipPrimitive.Content
+      ref={ref}
+      sideOffset={sideOffset}
+      className={cn(
+        "z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className,
+      )}
+      {...props}
+    />
+  </TooltipPrimitive.Portal>
 ));
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
diff --git a/src/components/usage-card.tsx b/src/components/usage-card.tsx
index 55395c1f..37c9bcb2 100644
--- a/src/components/usage-card.tsx
+++ b/src/components/usage-card.tsx
@@ -1,6 +1,5 @@
 import { QuestionMarkCircledIcon } from "@radix-ui/react-icons";
 
-import { cn } from "~/lib/utils";
 import { Button } from "~/components/ui/button";
 import {
   Card,
@@ -15,13 +14,14 @@ import {
   HoverCardTrigger,
 } from "~/components/ui/hover-card";
 import { Progress } from "~/components/ui/progress";
+import { cn } from "~/server/utils";
 
-interface UsageCardProps extends React.ComponentPropsWithoutRef<typeof Card> {
+type UsageCardProps = {
   title: string;
   count: number;
   limit: number;
   moreInfo?: string;
-}
+} & React.ComponentPropsWithoutRef<typeof Card>;
 
 export function UsageCard({
   title,
diff --git a/src/app/[locale]/(auth)/_components/verify-email-form.tsx b/src/components/verify-email-form.tsx
similarity index 94%
rename from src/app/[locale]/(auth)/_components/verify-email-form.tsx
rename to src/components/verify-email-form.tsx
index af1ff7f8..d2d117eb 100644
--- a/src/app/[locale]/(auth)/_components/verify-email-form.tsx
+++ b/src/components/verify-email-form.tsx
@@ -1,14 +1,14 @@
 "use client";
 
-import * as React from "react";
-import { useRouter } from "next/navigation";
+import type { z } from "zod";
+
 import { useSignUp } from "@clerk/nextjs";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useRouter } from "next/navigation";
+import * as React from "react";
 import { useForm } from "react-hook-form";
-import type { z } from "zod";
 
-import { showErrorToast } from "~/lib/handle-error";
-import { verifyEmailSchema } from "~/lib/validations/auth";
+import { Icons } from "~/components/icons";
 import { Button } from "~/components/ui/button";
 import {
   Form,
@@ -19,7 +19,8 @@ import {
   FormMessage,
 } from "~/components/ui/form";
 import { Input } from "~/components/ui/input";
-import { Icons } from "~/components/icons";
+import { showErrorToast } from "~/server/handle-error";
+import { verifyEmailSchema } from "~/server/validations/auth";
 
 type Inputs = z.infer<typeof verifyEmailSchema>;
 
@@ -37,7 +38,9 @@ export function VerifyEmailForm() {
   });
 
   async function onSubmit(data: Inputs) {
-    if (!isLoaded) return;
+    if (!isLoaded) {
+      return;
+    }
 
     setLoading(true);
 
diff --git a/src/config/dashboard.ts b/src/config/dashboard.ts
index 8d506ff9..57a3205e 100644
--- a/src/config/dashboard.ts
+++ b/src/config/dashboard.ts
@@ -1,8 +1,8 @@
 import { type SidebarNavItem } from "~/types";
 
-export interface DashboardConfig {
+export type DashboardConfig = {
   sidebarNav: SidebarNavItem[];
-}
+};
 
 export const dashboardConfig: DashboardConfig = {
   sidebarNav: [
diff --git a/src/config/pricing.ts b/src/config/pricing.ts
index df9ee56d..f3fa3963 100644
--- a/src/config/pricing.ts
+++ b/src/config/pricing.ts
@@ -18,12 +18,13 @@ export const pricingConfig = {
         variants: 5,
       },
     },
-    standard: {
-      id: "standard",
-      title: "Standard",
-      description: "Perfect for midsize businesses that want to sell online.",
+    pro: {
+      id: "pro",
+      title: "Pro",
+      description:
+        "Perfect for midsize and big businesses that want to sell online.",
       features: ["Create up to 3 store", "Create up to 50 products/store"],
-      stripePriceId: env.STRIPE_STD_MONTHLY_PRICE_ID || "",
+      stripePriceId: env.STRIPE_PRO_MONTHLY_PRICE_ID || "",
       limits: {
         stores: 3,
         products: 25,
@@ -31,18 +32,18 @@ export const pricingConfig = {
         variants: 10,
       },
     },
-    pro: {
-      id: "pro",
-      title: "Pro",
-      description: "Perfect for big businesses that want to sell online.",
-      features: ["Create up to 5 stores", "Create up to 100 products/store"],
-      stripePriceId: env.STRIPE_PRO_MONTHLY_PRICE_ID || "",
-      limits: {
-        stores: 5,
-        products: 100,
-        tags: 50,
-        variants: 15,
-      },
-    },
+    // pro: {
+    //   id: "pro",
+    //   title: "Pro",
+    //   description: "Perfect for big businesses that want to sell online.",
+    //   features: ["Create up to 5 stores", "Create up to 100 products/store"],
+    //   stripePriceId: env.STRIPE_PRO_MONTHLY_PRICE_ID || "",
+    //   limits: {
+    //     stores: 5,
+    //     products: 100,
+    //     tags: 50,
+    //     variants: 15,
+    //   },
+    // },
   } satisfies Record<Plan["id"], Plan>,
 };
diff --git a/src/config/product.ts b/src/config/product.ts
index 036c852d..6702de8a 100644
--- a/src/config/product.ts
+++ b/src/config/product.ts
@@ -1,6 +1,6 @@
-import type { Category, Subcategory } from "~/db/schema";
+import type { Category, Subcategory } from "~/server/db/schema";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 export type ProductConfig = typeof productConfig;
 
diff --git a/src/config/site.ts b/src/config/site.ts
index 6e008f8e..271e78cc 100644
--- a/src/config/site.ts
+++ b/src/config/site.ts
@@ -1,7 +1,7 @@
 import type { FooterItem, MainNavItem } from "~/types";
 
 import { productConfig } from "~/config/product";
-import { slugify } from "~/lib/utils";
+import { slugify } from "~/server/utils";
 
 export type SiteConfig = typeof siteConfig;
 
diff --git a/src/content/pages/about.mdx b/src/content/pages/about.mdx
index d1a1dfac..66f7c172 100644
--- a/src/content/pages/about.mdx
+++ b/src/content/pages/about.mdx
@@ -33,7 +33,7 @@ The project is still in development. You can follow the progress on [Twitter](ht
 
 ## About the author
 
-Hi, I'm [blefnk](https://x.com/blefnk). Self-taught web developer building websites with AI and [Next.js](https://nextjs.org/). My socials are below.
+Hi, I'm [blefnk](https://x.com/blefnk). Self-taught web developer building websites with [Next.js](https://nextjs.org/). My socials are below.
 
 - [Twitter](https://x.com/blefnk)
 - [GitHub](https://github.com/blefnk)
diff --git a/src/db/index.ts b/src/db/index.ts
deleted file mode 100644
index 155244c1..00000000
--- a/src/db/index.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-import "dotenv/config";
-import { drizzle } from "drizzle-orm/node-postgres";
-import postgres from "postgres";
-
-import { env } from "~/env";
-import * as schema from "./schema";
-
-/**
- * Cache the database connection in development. This
- * avoids creating a new connection on every HMR update.
- */
-const globalForDb = globalThis as unknown as {
-  conn: postgres.Sql | undefined;
-};
-
-const conn = globalForDb.conn ?? postgres(env.DATABASE_URL);
-if (env.NODE_ENV !== "production") globalForDb.conn = conn;
-
-export const db = drizzle({
-  connection: {
-    connectionString: env.DATABASE_URL,
-    ssl: true,
-  },
-  schema,
-});
-
-//////
-// import { drizzle } from "drizzle-orm/node-postgres";
-// import { env } from "~/env";
-
-// export const db = drizzle({
-//   connection: {
-//     connectionString: env.DATABASE_URL,
-//     ssl: true,
-//   },
-// });
-
-//////
-
-// import { env } from "~/env.js";
-// import { drizzle } from "drizzle-orm/postgres-js";
-// import postgres from "postgres";
-
-// import * as schema from "./schema";
-
-// const client = postgres(env.DATABASE_URL || "");
-// export const db = drizzle(client, { schema });
diff --git a/src/env.js b/src/env.js
index cc92e060..1cadb92c 100644
--- a/src/env.js
+++ b/src/env.js
@@ -1,3 +1,5 @@
+// @ts-check
+
 import { createEnv } from "@t3-oss/env-nextjs";
 import { vercel } from "@t3-oss/env-nextjs/presets";
 import { z } from "zod";
@@ -5,26 +7,28 @@ import { z } from "zod";
 export const env = createEnv({
   extends: [vercel()],
   /**
-   * Specify your server-side environment variables schema here. This way you can ensure the app
-   * isn't built with invalid env vars.
+   * Specify your server-side environment variables schema here.
+   * This way you can ensure the app isn't built with invalid env vars.
    */
   server: {
+    // REQUIRED
+    DATABASE_URL: z.string().url(),
+    CLERK_SECRET_KEY: z.string().min(1),
+    CLERK_ENCRYPTION_KEY: z.string().min(1),
+    STRIPE_API_KEY: z.string().min(1),
+    STRIPE_WEBHOOK_SECRET: z.string().min(1),
+    STRIPE_PRO_MONTHLY_PRICE_ID: z.string().min(1),
+    UPLOADTHING_TOKEN: z.string().min(1),
+    UPLOADTHING_SECRET: z.string().min(1),
+    RESEND_API_KEY: z.string().min(1),
+    EMAIL_FROM_ADDRESS: z.string().email(),
+
+    // AUTOMATICALLY GENERATED, DO NOT EDIT
+    // YOU DO NEED TO SET THIS IN ENV FILE
     NODE_ENV: z
       .enum(["development", "test", "production"])
       .default("development"),
     PORT: z.coerce.number().default(3000),
-    DATABASE_URL: z.string().url(),
-    CLERK_SECRET_KEY: z.string().min(1),
-    RESEND_API_KEY: z.string().min(1).optional(),
-    EMAIL_FROM_ADDRESS: z.string().email().optional(),
-    UPLOADTHING_SECRET: z.string().min(1).optional(),
-    UPLOADTHING_APP_ID: z.string().min(1).optional(),
-    UPSTASH_REDIS_REST_URL: z.string().url().optional(),
-    UPSTASH_REDIS_REST_TOKEN: z.string().min(1).optional(),
-    STRIPE_API_KEY: z.string().min(1).optional(),
-    STRIPE_WEBHOOK_SECRET: z.string().min(1).optional(),
-    STRIPE_STD_MONTHLY_PRICE_ID: z.string().min(1).optional(),
-    STRIPE_PRO_MONTHLY_PRICE_ID: z.string().min(1).optional(),
   },
 
   /**
@@ -33,11 +37,10 @@ export const env = createEnv({
    * `NEXT_PUBLIC_`.
    */
   client: {
-    NEXT_PUBLIC_APP_URL: z.string().url().optional(),
-    NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY: z.string().optional(),
-    NEXT_PUBLIC_CLERK_SIGN_IN_URL: z.string().min(1).optional(),
-    NEXT_PUBLIC_CLERK_SIGN_UP_URL: z.string().min(1).optional(),
-    NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY: z.string().optional(),
+    // REQUIRED
+    NEXT_PUBLIC_APP_URL: z.string().url(),
+    NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY: z.string(),
+    NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY: z.string(),
   },
 
   /**
@@ -45,28 +48,28 @@ export const env = createEnv({
    * middlewares) or client-side so we need to destruct manually.
    */
   runtimeEnv: {
-    PORT: process.env.PORT,
-    NODE_ENV: process.env.NODE_ENV,
-    DATABASE_URL: process.env.DATABASE_URL,
+    // REQUIRED
     NEXT_PUBLIC_APP_URL:
       process.env.NEXT_PUBLIC_APP_URL || "http://localhost:3000",
+    DATABASE_URL: process.env.DATABASE_URL,
     NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY:
       process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY,
-    NEXT_PUBLIC_CLERK_SIGN_IN_URL: process.env.NEXT_PUBLIC_CLERK_SIGN_IN_URL,
-    NEXT_PUBLIC_CLERK_SIGN_UP_URL: process.env.NEXT_PUBLIC_CLERK_SIGN_UP_URL,
     CLERK_SECRET_KEY: process.env.CLERK_SECRET_KEY,
-    RESEND_API_KEY: process.env.RESEND_API_KEY,
-    EMAIL_FROM_ADDRESS: process.env.EMAIL_FROM_ADDRESS,
-    UPLOADTHING_SECRET: process.env.UPLOADTHING_SECRET,
-    UPLOADTHING_APP_ID: process.env.UPLOADTHING_APP_ID,
-    UPSTASH_REDIS_REST_URL: process.env.UPSTASH_REDIS_REST_URL,
-    UPSTASH_REDIS_REST_TOKEN: process.env.UPSTASH_REDIS_REST_TOKEN,
+    CLERK_ENCRYPTION_KEY: process.env.CLERK_ENCRYPTION_KEY,
     NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY:
       process.env.NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY,
     STRIPE_API_KEY: process.env.STRIPE_API_KEY,
     STRIPE_WEBHOOK_SECRET: process.env.STRIPE_WEBHOOK_SECRET,
-    STRIPE_STD_MONTHLY_PRICE_ID: process.env.STRIPE_STD_MONTHLY_PRICE_ID,
     STRIPE_PRO_MONTHLY_PRICE_ID: process.env.STRIPE_PRO_MONTHLY_PRICE_ID,
+    UPLOADTHING_TOKEN: process.env.UPLOADTHING_TOKEN,
+    UPLOADTHING_SECRET: process.env.UPLOADTHING_SECRET,
+    RESEND_API_KEY: process.env.RESEND_API_KEY,
+    EMAIL_FROM_ADDRESS: process.env.EMAIL_FROM_ADDRESS,
+
+    // AUTOMATICALLY GENERATED, DO NOT EDIT
+    // YOU DO NEED TO SET THIS IN ENV FILE
+    PORT: process.env.PORT,
+    NODE_ENV: process.env.NODE_ENV,
   },
   /**
    * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially
diff --git a/src/hooks/use-click-outside.ts b/src/hooks/use-click-outside.ts
index 51c74a84..54798953 100644
--- a/src/hooks/use-click-outside.ts
+++ b/src/hooks/use-click-outside.ts
@@ -1,9 +1,9 @@
 import * as React from "react";
 
-interface UseClickOutsideProps {
+type UseClickOutsideProps = {
   ref: React.RefObject<HTMLElement>;
   handler: (event: MouseEvent | TouchEvent) => void;
-}
+};
 
 export function useClickOutside({ ref, handler }: UseClickOutsideProps) {
   React.useEffect(() => {
diff --git a/src/hooks/use-controllable-state.ts b/src/hooks/use-controllable-state.ts
index a71c9eed..c3c10213 100644
--- a/src/hooks/use-controllable-state.ts
+++ b/src/hooks/use-controllable-state.ts
@@ -6,11 +6,11 @@ import { useCallbackRef } from "~/hooks/use-callback-ref";
  * @see https://github.com/radix-ui/primitives/blob/main/packages/react/use-controllable-state/src/useControllableState.tsx
  */
 
-interface UseControllableStateParams<T> {
+type UseControllableStateParams<T> = {
   prop?: T | undefined;
   defaultProp?: T | undefined;
   onChange?: (state: T) => void;
-}
+};
 
 type SetStateFn<T> = (prevState?: T) => T;
 
@@ -33,8 +33,10 @@ function useControllableState<T>({
         if (isControlled) {
           const setter = nextValue as SetStateFn<T>;
           const value =
-            typeof nextValue === "function" ? setter(prop) : nextValue;
-          if (value !== prop) handleChange(value);
+            typeof nextValue === "function" ? setter(prop!) : nextValue;
+          if (value !== prop) {
+            handleChange(value as T);
+          }
         } else {
           setUncontrolledProp(nextValue);
         }
@@ -55,7 +57,7 @@ function useUncontrolledState<T>({
   const handleChange = useCallbackRef(onChange);
 
   React.useEffect(() => {
-    if (prevValueRef.current !== value) {
+    if (prevValueRef.current !== value && value !== undefined) {
       handleChange(value);
       prevValueRef.current = value;
     }
diff --git a/src/hooks/use-data-table.ts b/src/hooks/use-data-table.ts
index 4742c17f..c79edf5e 100644
--- a/src/hooks/use-data-table.ts
+++ b/src/hooks/use-data-table.ts
@@ -1,8 +1,5 @@
 "use client";
 
-import * as React from "react";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
-import type { DataTableFilterField } from "~/types";
 import {
   getCoreRowModel,
   getFacetedRowModel,
@@ -17,11 +14,15 @@ import {
   type SortingState,
   type VisibilityState,
 } from "@tanstack/react-table";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import * as React from "react";
 import { z } from "zod";
 
+import type { DataTableFilterField } from "~/types";
+
 import { useDebounce } from "~/hooks/use-debounce";
 
-interface UseDataTableProps<TData, TValue> {
+type UseDataTableProps<TData, TValue> = {
   /**
    * The data for the table.
    * @default []
@@ -96,7 +97,7 @@ interface UseDataTableProps<TData, TValue> {
    * @type boolean
    */
   enableAdvancedFilter?: boolean;
-}
+};
 
 const schema = z.object({
   page: z.coerce.number().default(1),
@@ -252,7 +253,9 @@ export function useDataTable<TData, TValue>({
 
   React.useEffect(() => {
     // Opt out when advanced filter is enabled, because it contains additional params
-    if (enableAdvancedFilter) return;
+    if (enableAdvancedFilter) {
+      return;
+    }
 
     // Prevent resetting the page on initial render
     if (!mounted) {
diff --git a/src/hooks/use-enter-submit.ts b/src/hooks/use-enter-submit.ts
index 3aaeb882..be1a6e6d 100644
--- a/src/hooks/use-enter-submit.ts
+++ b/src/hooks/use-enter-submit.ts
@@ -19,5 +19,8 @@ export function useEnterSubmit(): {
     }
   };
 
-  return { formRef, onKeyDown: handleKeyDown };
+  return {
+    formRef: formRef as RefObject<HTMLFormElement>,
+    onKeyDown: handleKeyDown,
+  };
 }
diff --git a/src/hooks/use-mobile.tsx b/src/hooks/use-mobile.tsx
new file mode 100644
index 00000000..a93d5839
--- /dev/null
+++ b/src/hooks/use-mobile.tsx
@@ -0,0 +1,21 @@
+import * as React from "react";
+
+const MOBILE_BREAKPOINT = 768;
+
+export function useIsMobile() {
+  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(
+    undefined,
+  );
+
+  React.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+
+  return !!isMobile;
+}
diff --git a/src/hooks/use-toast.ts b/src/hooks/use-toast.ts
new file mode 100644
index 00000000..41ac75b4
--- /dev/null
+++ b/src/hooks/use-toast.ts
@@ -0,0 +1,192 @@
+"use client";
+
+import * as React from "react";
+
+import type { ToastActionElement, ToastProps } from "~/components/ui/toast";
+
+const TOAST_LIMIT = 1;
+const TOAST_REMOVE_DELAY = 1000000;
+
+type ToasterToast = ToastProps & {
+  id: string;
+  title?: React.ReactNode;
+  description?: React.ReactNode;
+  action?: ToastActionElement;
+};
+
+const actionTypes = {
+  ADD_TOAST: "ADD_TOAST",
+  UPDATE_TOAST: "UPDATE_TOAST",
+  DISMISS_TOAST: "DISMISS_TOAST",
+  REMOVE_TOAST: "REMOVE_TOAST",
+} as const;
+
+let count = 0;
+
+function genId() {
+  count = (count + 1) % Number.MAX_SAFE_INTEGER;
+  return count.toString();
+}
+
+type ActionType = typeof actionTypes;
+
+type Action =
+  | {
+      type: ActionType["ADD_TOAST"];
+      toast: ToasterToast;
+    }
+  | {
+      type: ActionType["UPDATE_TOAST"];
+      toast: Partial<ToasterToast>;
+    }
+  | {
+      type: ActionType["DISMISS_TOAST"];
+      toastId?: ToasterToast["id"];
+    }
+  | {
+      type: ActionType["REMOVE_TOAST"];
+      toastId?: ToasterToast["id"];
+    };
+
+type State = {
+  toasts: ToasterToast[];
+};
+
+const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>();
+
+const addToRemoveQueue = (toastId: string) => {
+  if (toastTimeouts.has(toastId)) {
+    return;
+  }
+
+  const timeout = setTimeout(() => {
+    toastTimeouts.delete(toastId);
+    dispatch({
+      type: "REMOVE_TOAST",
+      toastId: toastId,
+    });
+  }, TOAST_REMOVE_DELAY);
+
+  toastTimeouts.set(toastId, timeout);
+};
+
+export const reducer = (state: State, action: Action): State => {
+  switch (action.type) {
+    case "ADD_TOAST":
+      return {
+        ...state,
+        toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
+      };
+
+    case "UPDATE_TOAST":
+      return {
+        ...state,
+        toasts: state.toasts.map((t) =>
+          t.id === action.toast.id ? { ...t, ...action.toast } : t,
+        ),
+      };
+
+    case "DISMISS_TOAST": {
+      const { toastId } = action;
+
+      // ! Side effects ! - This could be extracted into a dismissToast() action,
+      // but I'll keep it here for simplicity
+      if (toastId) {
+        addToRemoveQueue(toastId);
+      } else {
+        for (const toast of state.toasts) {
+          addToRemoveQueue(toast.id);
+        }
+      }
+
+      return {
+        ...state,
+        toasts: state.toasts.map((t) =>
+          t.id === toastId || toastId === undefined
+            ? {
+                ...t,
+                open: false,
+              }
+            : t,
+        ),
+      };
+    }
+    case "REMOVE_TOAST":
+      if (action.toastId === undefined) {
+        return {
+          ...state,
+          toasts: [],
+        };
+      }
+      return {
+        ...state,
+        toasts: state.toasts.filter((t) => t.id !== action.toastId),
+      };
+  }
+};
+
+const listeners: ((state: State) => void)[] = [];
+
+let memoryState: State = { toasts: [] };
+
+function dispatch(action: Action) {
+  memoryState = reducer(memoryState, action);
+  for (const listener of listeners) {
+    listener(memoryState);
+  }
+}
+
+type Toast = Omit<ToasterToast, "id">;
+
+function toast({ ...props }: Toast) {
+  const id = genId();
+
+  const update = (props: ToasterToast) =>
+    dispatch({
+      type: "UPDATE_TOAST",
+      toast: { ...props, id },
+    });
+  const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
+
+  dispatch({
+    type: "ADD_TOAST",
+    toast: {
+      ...props,
+      id,
+      open: true,
+      onOpenChange: (open) => {
+        if (!open) {
+          dismiss();
+        }
+      },
+    },
+  });
+
+  return {
+    id: id,
+    dismiss,
+    update,
+  };
+}
+
+function useToast() {
+  const [state, setState] = React.useState<State>(memoryState);
+
+  React.useEffect(() => {
+    listeners.push(setState);
+    return () => {
+      const index = listeners.indexOf(setState);
+      if (index > -1) {
+        listeners.splice(index, 1);
+      }
+    };
+  }, [state]);
+
+  return {
+    ...state,
+    toast,
+    dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }),
+  };
+}
+
+export { useToast, toast };
diff --git a/src/hooks/use-upload-file.ts b/src/hooks/use-upload-file.ts
index e76ac873..0afff642 100644
--- a/src/hooks/use-upload-file.ts
+++ b/src/hooks/use-upload-file.ts
@@ -1,19 +1,20 @@
+import type { UploadFilesOptions } from "uploadthing/types";
+
 import * as React from "react";
-import type { StoredFile } from "~/types";
 import { toast } from "sonner";
-import type { UploadFilesOptions } from "uploadthing/types";
 
-import { getErrorMessage } from "~/lib/handle-error";
-import { uploadFiles } from "~/lib/uploadthing";
+import type { StoredFile } from "~/types";
+
 import { type OurFileRouter } from "~/app/api/uploadthing/core";
+import { getErrorMessage } from "~/server/handle-error";
+import { uploadFiles } from "~/server/uploadthing";
 
-interface UseUploadFileProps
-  extends Pick<
-    UploadFilesOptions<OurFileRouter, keyof OurFileRouter>,
-    "headers" | "onUploadBegin" | "onUploadProgress" | "skipPolling"
-  > {
+type UseUploadFileProps = {
   defaultUploadedFiles?: StoredFile[];
-}
+} & Pick<
+  UploadFilesOptions<any>,
+  "headers" | "onUploadBegin" | "onUploadProgress" | "skipPolling"
+>;
 
 export function useUploadFile(
   endpoint: keyof OurFileRouter,
diff --git a/src/i18n/locales.ts b/src/i18n/locales.ts
new file mode 100644
index 00000000..5d706522
--- /dev/null
+++ b/src/i18n/locales.ts
@@ -0,0 +1,43 @@
+export const locales = [
+  "en",
+  "de",
+  "es",
+  "fr",
+  "hi",
+  "it",
+  "ms",
+  "pl",
+  "tr",
+  "uk",
+  "zh",
+] as const;
+
+export type Locale = (typeof locales)[number];
+
+export const labels = {
+  de: "German",
+  en: "English",
+  es: "Spanish",
+  fr: "French",
+  hi: "Hindi",
+  it: "Italian",
+  ms: "Malay",
+  pl: "Polish",
+  tr: "Turkish",
+  uk: "Ukrainian",
+  zh: "Chinese",
+};
+
+export const localeFlags: Record<Locale, string> = {
+  de: "🇩🇪",
+  en: "🇬🇧",
+  es: "🇪🇸",
+  fr: "🇫🇷",
+  hi: "🇮🇳",
+  it: "🇮🇹",
+  ms: "🇲🇾",
+  pl: "🇵🇱",
+  tr: "🇹🇷",
+  uk: "🇺🇦",
+  zh: "🇨🇳",
+};
diff --git a/src/i18n/request.ts b/src/i18n/request.ts
index 73a2b6d4..05272032 100644
--- a/src/i18n/request.ts
+++ b/src/i18n/request.ts
@@ -1,12 +1,13 @@
 import { getRequestConfig } from "next-intl/server";
+
 import { routing } from "./routing";
 
 export default getRequestConfig(async ({ requestLocale }) => {
-  // This typically corresponds to the `[locale]` segment
+  // Corresponds to the `[locale]` segment
   let locale = await requestLocale;
 
   // Ensure that a valid locale is used
-  if (!locale || !routing.locales.includes(locale as any)) {
+  if (!locale || !routing.locales.includes(locale as "en" | "uk")) {
     locale = routing.defaultLocale;
   }
 
diff --git a/src/i18n/routing.ts b/src/i18n/routing.ts
index 11de0759..322679ea 100644
--- a/src/i18n/routing.ts
+++ b/src/i18n/routing.ts
@@ -1,57 +1,12 @@
-import { defineRouting } from "next-intl/routing";
 import { createNavigation } from "next-intl/navigation";
+import { defineRouting } from "next-intl/routing";
 
-export const routing = defineRouting({
-  // A list of all locales that are supported
-  locales: [
-    "de-DE",
-    "en-US",
-    "es-ES",
-    "fr-FR",
-    "hi-IN",
-    "it-IT",
-    "ms-MY",
-    "pl-PL",
-    "tr-TR",
-    "uk-UA",
-    "zh-CN",
-  ],
+import { locales } from "./locales";
 
-  // Used when no locale matches
-  defaultLocale: "en-US",
+export const routing = defineRouting({
+  defaultLocale: "en",
+  locales,
 });
 
-export type Locale = (typeof routing.locales)[number];
-
-export const labels = {
-  "de-DE": "German",
-  "en-US": "English",
-  "es-ES": "Spanish",
-  "fr-FR": "French",
-  "hi-IN": "Hindi",
-  "it-IT": "Italian",
-  "ms-MY": "Malay",
-  "pl-PL": "Polish",
-  "tr-TR": "Turkish",
-  "uk-UA": "Ukrainian",
-  "zh-CN": "Chinese",
-};
-
-export const localeFlags: Record<Locale, string> = {
-  "de-DE": "🇩🇪",
-  "en-US": "🇬🇧",
-  "es-ES": "🇪🇸",
-  "fr-FR": "🇫🇷",
-  "hi-IN": "🇮🇳",
-  "it-IT": "🇮🇹",
-  "ms-MY": "🇲🇾",
-  "pl-PL": "🇵🇱",
-  "tr-TR": "🇹🇷",
-  "uk-UA": "🇺🇦",
-  "zh-CN": "🇨🇳",
-};
-
-// Lightweight wrappers around Next.js' navigation APIs
-// that will consider the routing configuration
-// ..., redirect, useRouter
-export const { Link, usePathname, getPathname } = createNavigation(routing);
+export const { Link, redirect, usePathname, useRouter, getPathname } =
+  createNavigation(routing);
diff --git a/src/layout.tsx b/src/layout.tsx
new file mode 100644
index 00000000..c8f9cee0
--- /dev/null
+++ b/src/layout.tsx
@@ -0,0 +1,7 @@
+export default function Layout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  );
+}
diff --git a/src/lib/openai.ts b/src/lib/openai.ts
deleted file mode 100644
index 34f36e46..00000000
--- a/src/lib/openai.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { OpenAI } from "openai";
-
-export const openai = new OpenAI({
-  apiKey: process.env.OPENAI_API_KEY,
-});
diff --git a/src/lib/rate-limit.ts b/src/lib/rate-limit.ts
deleted file mode 100644
index b3b59278..00000000
--- a/src/lib/rate-limit.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Ratelimit } from "@upstash/ratelimit"; // for deno: see above
-import { Redis } from "@upstash/redis"; // see below for cloudflare and fastly adapters
-
-export const ratelimit = new Ratelimit({
-  redis: Redis.fromEnv(),
-  // Rate limit to 10 requests per 10 seconds
-  limiter: Ratelimit.slidingWindow(10, "10 s"),
-  analytics: true,
-  /**
-   * Optional prefix for the keys used in redis. This is useful if you want to share a redis
-   * instance with other applications and want to avoid key collisions. The default prefix is
-   * "@upstash/ratelimit"
-   */
-  prefix: "relivator/ratelimit",
-});
diff --git a/src/mdx-components.tsx b/src/mdx-components.tsx
index 1b3babde..78bd189e 100644
--- a/src/mdx-components.tsx
+++ b/src/mdx-components.tsx
@@ -1,13 +1,14 @@
 import type { MDXComponents } from "mdx/types";
-import { cn } from "~/lib/utils";
-import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
-import { AspectRatio } from "~/components/ui/aspect-ratio";
-import { ScrollArea } from "~/components/ui/scroll-area";
+
 import { Callout } from "~/components/mdx/callout";
 import { CodeBlock } from "~/components/mdx/code-block";
 import { LinkBadge } from "~/components/mdx/link-badge";
 import { MdxCard } from "~/components/mdx/mdx-card";
 import { MdxImage } from "~/components/mdx/mdx-image";
+import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
+import { AspectRatio } from "~/components/ui/aspect-ratio";
+import { ScrollArea } from "~/components/ui/scroll-area";
+import { cn } from "~/server/utils";
 
 // export function useMDXComponents(components: MDXComponents): MDXComponents {
 //   return components;
@@ -154,14 +155,14 @@ export function useMDXComponents(components: MDXComponents): MDXComponents {
   };
 }
 
-interface MdxProps {
+type MdxProps = {
   code: string;
-}
+};
 
 export function Mdx({ code }: MdxProps) {
   const Component = useMDXComponents({}) as unknown as (props: {
     components: MDXComponents;
-  }) => JSX.Element;
+  }) => React.ReactElement;
 
   return (
     <div className="mdx overflow-hidden">
@@ -208,7 +209,7 @@ export const allPages = [
   },
 ];
 
-export interface Post {
+export type Post = {
   slug: string;
   slugAsParams: string;
   title: string;
@@ -219,7 +220,7 @@ export interface Post {
   body: { code: string };
   image: string;
   description: string;
-}
+};
 
 // TODO: [temporary] Simulate allPosts
 export const allPosts: Post[] = [
diff --git a/src/middleware.ts b/src/middleware.ts
index 60284262..b5bb0f96 100644
--- a/src/middleware.ts
+++ b/src/middleware.ts
@@ -3,28 +3,44 @@ import type {
   NextFetchEvent,
   NextRequest,
 } from "next/server";
+
 import { clerkMiddleware, createRouteMatcher } from "@clerk/nextjs/server";
-import { NextResponse } from "next/server";
 import createMiddleware from "next-intl/middleware";
+import { NextResponse } from "next/server";
+
 import { routing } from "~/i18n/routing";
 
 const isProtectedRoute = createRouteMatcher(["/dashboard(.*)"]);
 
+// Define routes to exclude from next-intl and Clerk middleware
+const excludedRoutes = ["/api/unkey"];
+
 const shouldUseClerk = true; // TODO: consider `const shouldUseClerk = Boolean(env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY);`
 const shouldUseIntl = true;
 
-const createIntlMiddleware = createMiddleware(routing);
+const createIntlMiddlewareInstance = createMiddleware(routing);
 
 function handleClerkMiddleware(request: NextRequest, event: NextFetchEvent) {
   return clerkMiddleware(async (auth, request) => {
     if (isProtectedRoute(request)) {
       await auth.protect();
     }
-    return shouldUseIntl ? createIntlMiddleware(request) : NextResponse.next();
+    return shouldUseIntl
+      ? createIntlMiddlewareInstance(request)
+      : NextResponse.next();
   })(request, event);
 }
 
 export function middleware(request: NextRequest, event: NextFetchEvent) {
+  const pathname = request.nextUrl.pathname;
+
+  // Check if the request path is excluded
+  const isExcluded = excludedRoutes.some((route) => pathname.startsWith(route));
+
+  if (isExcluded) {
+    return NextResponse.next();
+  }
+
   return shouldUseClerk
     ? handleClerkMiddleware(request, event)
     : NextResponse.next();
@@ -33,7 +49,7 @@ export function middleware(request: NextRequest, event: NextFetchEvent) {
 export const config: MiddlewareConfig = {
   matcher: [
     "/((?!_next|[^?]*\\.(?:html?|css|js(?!on)|jpe?g|webp|png|gif|svg|ttf|woff2?|ico|csv|docx?|xlsx?|zip|webmanifest)).*)",
-    "/(de-DE|en-US|es-ES|ms-MY|fr-FR|hi-IN|it-IT|pl-PL|tr-TR|uk-UA|zh-CN)/:path*",
+    "/(de|en|es|fr|hi|it|ms|pl|tr|uk|zh)/:path*",
     "/(api|trpc)(.*)",
   ],
 };
diff --git a/src/lib/actions/cart.ts b/src/server/actions/cart.ts
similarity index 95%
rename from src/lib/actions/cart.ts
rename to src/server/actions/cart.ts
index 6a7b4aa0..e32e9ed6 100644
--- a/src/lib/actions/cart.ts
+++ b/src/server/actions/cart.ts
@@ -1,25 +1,25 @@
 "use server";
 
+import { and, asc, desc, eq, inArray, sql } from "drizzle-orm";
 import { unstable_noStore as noStore, revalidatePath } from "next/cache";
 import { cookies } from "next/headers";
-import { db } from "~/db";
+import { type z } from "zod";
+
+import { db } from "~/server/db";
 import {
   carts,
   categories,
   products,
   stores,
   subcategories,
-} from "~/db/schema";
-import { and, asc, desc, eq, inArray, sql } from "drizzle-orm";
-import { type z } from "zod";
-
-import { getErrorMessage } from "~/lib/handle-error";
+} from "~/server/db/schema";
+import { getErrorMessage } from "~/server/handle-error";
 import {
   cartItemSchema,
   type CartLineItemSchema,
   type deleteCartItemSchema,
   type deleteCartItemsSchema,
-} from "~/lib/validations/cart";
+} from "~/server/validations/cart";
 
 export async function getCart(input?: {
   storeId: string;
@@ -28,7 +28,9 @@ export async function getCart(input?: {
 
   const cartId = (await cookies()).get("cartId")?.value;
 
-  if (!cartId) return [];
+  if (!cartId) {
+    return [];
+  }
 
   try {
     const cart = await db.query.carts.findFirst({
@@ -40,7 +42,9 @@ export async function getCart(input?: {
 
     const productIds = cart?.items?.map((item) => item.productId) ?? [];
 
-    if (productIds.length === 0) return [];
+    if (productIds.length === 0) {
+      return [];
+    }
 
     const uniqueProductIds = [...new Set(productIds)];
 
@@ -94,7 +98,9 @@ export async function getUniqueStoreIds() {
 
   const cartId = (await cookies()).get("cartId")?.value;
 
-  if (!cartId) return [];
+  if (!cartId) {
+    return [];
+  }
 
   try {
     const cart = await db
@@ -118,7 +124,9 @@ export async function getUniqueStoreIds() {
 export async function getCartItems(input: { cartId?: string }) {
   noStore();
 
-  if (!input.cartId) return [];
+  if (!input.cartId) {
+    return [];
+  }
 
   try {
     const cart = await db.query.carts.findFirst({
@@ -340,7 +348,9 @@ export async function deleteCartItem(
       where: eq(carts.id, cartId),
     });
 
-    if (!cart) return;
+    if (!cart) {
+      return;
+    }
 
     cart.items =
       cart.items?.filter((item) => item.productId !== input.productId) ?? [];
@@ -377,7 +387,9 @@ export async function deleteCartItems(
       where: eq(carts.id, cartId),
     });
 
-    if (!cart) return;
+    if (!cart) {
+      return;
+    }
 
     cart.items =
       cart.items?.filter(
diff --git a/src/lib/actions/notification.ts b/src/server/actions/notification.ts
similarity index 83%
rename from src/lib/actions/notification.ts
rename to src/server/actions/notification.ts
index 410ffebe..e14006df 100644
--- a/src/lib/actions/notification.ts
+++ b/src/server/actions/notification.ts
@@ -1,16 +1,17 @@
 "use server";
 
-import { revalidatePath } from "next/cache";
-import { db } from "~/db";
-import { notifications } from "~/db/schema";
-import { env } from "~/env.js";
 import { currentUser } from "@clerk/nextjs/server";
 import { eq } from "drizzle-orm";
+import { revalidatePath } from "next/cache";
+
+import type { UpdateNotificationSchema } from "~/server/validations/notification";
 
-import { getErrorMessage } from "~/lib/handle-error";
-import { resend } from "~/lib/resend";
-import type { UpdateNotificationSchema } from "~/lib/validations/notification";
 import NewsletterWelcomeEmail from "~/components/emails/newsletter-welcome-email";
+import { env } from "~/env.js";
+import { db } from "~/server/db";
+import { notifications } from "~/server/db/schema";
+import { getErrorMessage } from "~/server/handle-error";
+import { resend } from "~/server/resend";
 
 export async function updateNotification(input: UpdateNotificationSchema) {
   try {
@@ -46,7 +47,6 @@ export async function updateNotification(input: UpdateNotificationSchema) {
       .update(notifications)
       .set({
         ...input,
-        // @ts-expect-error TODO: fix ts
         userId: user?.id,
       })
       .where(eq(notifications.token, input.token));
diff --git a/src/lib/actions/order.ts b/src/server/actions/order.ts
similarity index 96%
rename from src/lib/actions/order.ts
rename to src/server/actions/order.ts
index b8f0aa0e..10419e8d 100644
--- a/src/lib/actions/order.ts
+++ b/src/server/actions/order.ts
@@ -1,19 +1,7 @@
 "use server";
 
-import { unstable_noStore as noStore } from "next/cache";
-import { cookies } from "next/headers";
-import { db } from "~/db";
-import {
-  addresses,
-  carts,
-  categories,
-  orders,
-  payments,
-  products,
-  subcategories,
-  type Order,
-} from "~/db/schema";
-import type { SearchParams } from "~/types";
+import type Stripe from "stripe";
+
 import {
   and,
   asc,
@@ -26,16 +14,30 @@ import {
   lte,
   sql,
 } from "drizzle-orm";
-import type Stripe from "stripe";
+import { unstable_noStore as noStore } from "next/cache";
+import { cookies } from "next/headers";
 import { z } from "zod";
 
+import type { getOrderLineItemsSchema } from "~/server/validations/order";
+import type { SearchParams } from "~/types";
+
+import { db } from "~/server/db";
+import {
+  addresses,
+  carts,
+  categories,
+  orders,
+  payments,
+  products,
+  subcategories,
+  type Order,
+} from "~/server/db/schema";
 import {
   checkoutItemSchema,
   type CartLineItemSchema,
   type CheckoutItemSchema,
-} from "~/lib/validations/cart";
-import type { getOrderLineItemsSchema } from "~/lib/validations/order";
-import { ordersSearchParamsSchema } from "~/lib/validations/params";
+} from "~/server/validations/cart";
+import { ordersSearchParamsSchema } from "~/server/validations/params";
 
 export async function getOrderLineItems(
   input: z.infer<typeof getOrderLineItemsSchema> & {
@@ -136,10 +138,11 @@ export async function getOrderLineItems(
         })
         .returning({ insertedId: addresses.id });
 
-      if (!newAddress[0]?.insertedId) throw new Error("No address created.");
+      if (!newAddress[0]?.insertedId) {
+        throw new Error("No address created.");
+      }
 
       // Create new order in db
-      // @ts-expect-error TODO: fix ts
       await db.insert(orders).values({
         storeId: payment.storeId,
         items: input.items as unknown as CheckoutItemSchema[],
@@ -178,7 +181,6 @@ export async function getOrderLineItems(
         await db
           .update(products)
           .set({
-            // @ts-expect-error TODO: fix ts
             inventory: product.inventory - item.quantity,
           })
           .where(eq(products.id, item.productId));
diff --git a/src/lib/actions/product.ts b/src/server/actions/product.ts
similarity index 93%
rename from src/lib/actions/product.ts
rename to src/server/actions/product.ts
index 2f31d85e..9915eb7c 100644
--- a/src/lib/actions/product.ts
+++ b/src/server/actions/product.ts
@@ -1,18 +1,19 @@
 "use server";
 
-import { unstable_noStore as noStore, revalidatePath } from "next/cache";
-import { db } from "~/db";
-import { products } from "~/db/schema";
-import type { StoredFile } from "~/types";
 import { and, eq } from "drizzle-orm";
+import { unstable_noStore as noStore, revalidatePath } from "next/cache";
 import { type z } from "zod";
 
-import { getErrorMessage } from "~/lib/handle-error";
+import type { StoredFile } from "~/types";
+
+import { db } from "~/server/db";
+import { products } from "~/server/db/schema";
+import { getErrorMessage } from "~/server/handle-error";
 import {
   type CreateProductSchema,
   type createProductSchema,
   type updateProductRatingSchema,
-} from "~/lib/validations/product";
+} from "~/server/validations/product";
 
 export async function filterProducts({ query }: { query: string }) {
   noStore();
@@ -73,7 +74,6 @@ export async function addProduct(
 
     await db.insert(products).values({
       ...input,
-      // @ts-expect-error TODO: fix ts
       images: JSON.stringify(input.images) as unknown as StoredFile[],
     });
 
@@ -110,7 +110,6 @@ export async function updateProduct(
       .update(products)
       .set({
         ...input,
-        // @ts-expect-error TODO: fix ts
         images: JSON.stringify(input.images) as unknown as StoredFile[],
       })
       .where(eq(products.id, input.id));
@@ -147,7 +146,6 @@ export async function updateProductRating(
 
     await db
       .update(products)
-      // @ts-expect-error TODO: fix ts
       .set({ rating: input.rating })
       .where(eq(products.id, input.id));
 
diff --git a/src/lib/actions/seed.ts b/src/server/actions/seed.ts
similarity index 91%
rename from src/lib/actions/seed.ts
rename to src/server/actions/seed.ts
index 8ee2e197..2cbc6b7a 100644
--- a/src/lib/actions/seed.ts
+++ b/src/server/actions/seed.ts
@@ -1,4 +1,10 @@
-import { db } from "~/db";
+import { faker } from "@faker-js/faker";
+import consola from "consola";
+import { eq } from "drizzle-orm";
+import { ofetch } from "ofetch";
+
+import { productConfig } from "~/config/product";
+import { db } from "~/server/db";
 import {
   categories,
   products,
@@ -6,14 +12,9 @@ import {
   type Category,
   type Product,
   type Subcategory,
-} from "~/db/schema";
-import { faker } from "@faker-js/faker";
-import { eq } from "drizzle-orm";
-import consola from "consola";
-
-import { productConfig } from "~/config/product";
-import { generateId } from "~/lib/id";
-import { absoluteUrl, slugify } from "~/lib/utils";
+} from "~/server/db/schema";
+import { generateId } from "~/server/id";
+import { absoluteUrl, slugify } from "~/server/utils";
 
 // Utility function to handle errors with user prompt
 async function handleSeedingError(error: unknown, taskName: string) {
@@ -31,7 +32,7 @@ async function handleSeedingError(error: unknown, taskName: string) {
 export async function revalidateItems() {
   consola.info("🔄 Revalidating items...");
   try {
-    await fetch(absoluteUrl("/api/revalidate"));
+    await ofetch(absoluteUrl("/api/revalidate"));
     consola.success("✅ Revalidation complete.");
   } catch (error) {
     await handleSeedingError(error, "revalidate items");
@@ -51,7 +52,7 @@ export async function seedCategories() {
         image: category.image,
       }));
 
-    await db.delete(categories);
+    await db.delete(categories).where(eq(categories.id, "1"));
     consola.info(`📝 Inserting ${data.length} categories`);
     await db.insert(categories).values(data);
     consola.success("✅ Categories seeded successfully.");
@@ -87,7 +88,7 @@ export async function seedSubcategories() {
       }
     });
 
-    await db.delete(subcategoriesTable);
+    await db.delete(subcategoriesTable).where(eq(subcategoriesTable.id, "1"));
     consola.info(`📝 Inserting ${data.length} subcategories`);
     await db.insert(subcategoriesTable).values(data);
     consola.success("✅ Subcategories seeded successfully.");
@@ -122,9 +123,9 @@ export async function seedProducts({
       if (!categoryId) {
         throw new Error(`${categoryId} category not found`);
       }
-
       const subcategoryId =
-        faker.helpers.arrayElement(allSubcategoriesMap[categoryId])?.id ?? null;
+        faker.helpers.arrayElement(allSubcategoriesMap[categoryId] ?? [])?.id ??
+        null;
 
       data.push({
         id: generateId(),
diff --git a/src/lib/actions/store.ts b/src/server/actions/store.ts
similarity index 89%
rename from src/lib/actions/store.ts
rename to src/server/actions/store.ts
index 3c72da17..fdaa8b6c 100644
--- a/src/lib/actions/store.ts
+++ b/src/server/actions/store.ts
@@ -1,22 +1,22 @@
 "use server";
 
+import { auth } from "@clerk/nextjs/server";
+import { and, desc, eq, not } from "drizzle-orm";
 import {
   unstable_noStore as noStore,
   revalidatePath,
   revalidateTag,
 } from "next/cache";
 import { redirect } from "next/navigation";
-import { db } from "~/db";
-import { stores } from "~/db/schema";
-import { auth } from "@clerk/nextjs/server";
-import { and, desc, eq, not } from "drizzle-orm";
 
-import { getErrorMessage } from "~/lib/handle-error";
-import { slugify } from "~/lib/utils";
+import { db } from "~/server/db";
+import { stores } from "~/server/db/schema";
+import { getErrorMessage } from "~/server/handle-error";
+import { slugify } from "~/server/utils";
 import {
   updateStoreSchema,
   type CreateStoreSchema,
-} from "~/lib/validations/store";
+} from "~/server/validations/store";
 
 export async function createStore(
   input: CreateStoreSchema & { userId: string },
@@ -25,7 +25,6 @@ export async function createStore(
   try {
     const newStore = await db
       .insert(stores)
-      // @ts-expect-error TODO: fix ts
       .values({
         name: input.name,
         description: input.description,
@@ -75,7 +74,6 @@ export async function updateStore(storeId: string, fd: FormData) {
       .update(stores)
       .set({
         name: input.name,
-        // @ts-expect-error TODO: fix ts
         description: input.description,
       })
       .where(eq(stores.id, storeId));
diff --git a/src/lib/actions/stripe.ts b/src/server/actions/stripe.ts
similarity index 88%
rename from src/lib/actions/stripe.ts
rename to src/server/actions/stripe.ts
index 19305551..420d4b6f 100644
--- a/src/lib/actions/stripe.ts
+++ b/src/server/actions/stripe.ts
@@ -1,55 +1,67 @@
 "use server";
 
+import type Stripe from "stripe";
+
+import { clerkClient, currentUser } from "@clerk/nextjs/server";
+import { addDays } from "date-fns";
+import { eq } from "drizzle-orm";
 import {
   unstable_cache as cache,
   unstable_noStore as noStore,
 } from "next/cache";
 import { cookies } from "next/headers";
-import { db } from "~/db";
-import { carts, payments, stores } from "~/db/schema";
-import type { PlanWithPrice, UserPlan } from "~/types";
-import { clerkClient, currentUser } from "@clerk/nextjs/server";
-import { addDays } from "date-fns";
-import { eq } from "drizzle-orm";
-import type Stripe from "stripe";
 import { type z } from "zod";
 
-import { pricingConfig } from "~/config/pricing";
-import { calculateOrderAmount } from "~/lib/checkout";
-import { getErrorMessage } from "~/lib/handle-error";
-import { stripe } from "~/lib/stripe";
-import { absoluteUrl, formatPrice, getUserEmail } from "~/lib/utils";
-import { userPrivateMetadataSchema } from "~/lib/validations/auth";
-import { type CheckoutItemSchema } from "~/lib/validations/cart";
 import type {
   createPaymentIntentSchema,
   getPaymentIntentSchema,
   getPaymentIntentsSchema,
   getStripeAccountSchema,
   managePlanSchema,
-} from "~/lib/validations/stripe";
+} from "~/server/validations/stripe";
+import type { PlanWithPrice, UserPlan } from "~/types";
+
+import { pricingConfig } from "~/config/pricing";
+import { calculateOrderAmount } from "~/server/checkout";
+import { db } from "~/server/db";
+import { carts, payments, stores } from "~/server/db/schema";
+import { getErrorMessage } from "~/server/handle-error";
+import { stripe } from "~/server/stripe";
+import { absoluteUrl, formatPrice, getUserEmail } from "~/server/utils";
+import { userPrivateMetadataSchema } from "~/server/validations/auth";
+import { type CheckoutItemSchema } from "~/server/validations/cart";
 
 // Retrieve prices for all plans from Stripe
 export async function getPlans(): Promise<PlanWithPrice[]> {
   return await cache(
     async () => {
-      const standardPriceId = pricingConfig.plans.standard.stripePriceId;
       const proPriceId = pricingConfig.plans.pro.stripePriceId;
+      // const standardPriceId = pricingConfig.plans.standard.stripePriceId;
+      // const proPriceId = pricingConfig.plans.pro.stripePriceId;
 
-      const [standardPrice, proPrice] = await Promise.all([
-        stripe.prices.retrieve(standardPriceId),
+      // const [standardPrice, proPrice] = await Promise.all([
+      // const [standardPrice] = await Promise.all([
+      // stripe.prices.retrieve(standardPriceId),
+      const [proPrice] = await Promise.all([
         stripe.prices.retrieve(proPriceId),
+        // stripe.prices.retrieve(proPriceId),
       ]);
 
+      // const currency = proPrice.currency;
+      // const currency = standardPrice.currency;
       const currency = proPrice.currency;
 
       return Object.values(pricingConfig.plans).map((plan) => {
-        const price =
-          plan.stripePriceId === proPriceId
-            ? proPrice
-            : plan.stripePriceId === standardPriceId
-              ? standardPrice
-              : null;
+        // const price =
+        //   plan.stripePriceId === standaroPriceId
+        //     ? proPrice
+        //     : plan.stripePriceId === standardPriceId
+        //       ? standardPrice
+        //       : null;
+
+        // const price =
+        //   plan.stripePriceId === standardPriceId ? standardPrice : null;
+        const price = plan.stripePriceId === proPriceId ? proPrice : null;
 
         return {
           ...plan,
@@ -145,7 +157,9 @@ export async function getStripeAccount(
       where: eq(stores.id, input.storeId),
     });
 
-    if (!store) return falsyReturn;
+    if (!store) {
+      return falsyReturn;
+    }
 
     const payment = await db.query.payments.findFirst({
       columns: {
@@ -155,18 +169,23 @@ export async function getStripeAccount(
       where: eq(payments.storeId, input.storeId),
     });
 
-    if (!payment?.stripeAccountId) return falsyReturn;
+    if (!payment?.stripeAccountId) {
+      return falsyReturn;
+    }
 
-    if (!retrieveAccount)
+    if (!retrieveAccount) {
       return {
         isConnected: true,
         account: null,
         payment,
       };
+    }
 
     const account = await stripe.accounts.retrieve(payment.stripeAccountId);
 
-    if (!account) return falsyReturn;
+    if (!account) {
+      return falsyReturn;
+    }
 
     // If the account details have been submitted, we update the store and payment records
     if (account.details_submitted && !payment.detailsSubmitted) {
@@ -174,7 +193,6 @@ export async function getStripeAccount(
         await tx
           .update(payments)
           .set({
-            // @ts-expect-error TODO: fix ts
             detailsSubmitted: account.details_submitted,
             stripeAccountCreatedAt: account.created
               ? new Date(account.created * 1000)
@@ -185,7 +203,6 @@ export async function getStripeAccount(
         await tx
           .update(stores)
           .set({
-            // @ts-expect-error TODO: fix ts
             stripeAccountId: account.id,
           })
           .where(eq(stores.id, input.storeId));
@@ -415,9 +432,12 @@ export async function createAccountLink(
 
       // If payment record exists, we update it with the new account id
       if (payment) {
-        await db.update(payments).set({
-          stripeAccountId: account.id,
-        });
+        await db
+          .update(payments)
+          .set({
+            stripeAccountId: account.id,
+          })
+          .where(eq(payments.storeId, input.storeId));
       } else {
         await db.insert(payments).values({
           storeId: input.storeId,
diff --git a/src/lib/auth.ts b/src/server/auth/index.ts
similarity index 97%
rename from src/lib/auth.ts
rename to src/server/auth/index.ts
index f8658c76..7826cf75 100644
--- a/src/lib/auth.ts
+++ b/src/server/auth/index.ts
@@ -1,8 +1,8 @@
-import type { User } from "~/db/schema/users";
-
 import { currentUser } from "@clerk/nextjs/server";
 import consola from "consola";
 
+import type { User } from "~/server/db/schema/users";
+
 import { env } from "~/env";
 
 const authProvider = Boolean(env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY);
diff --git a/src/lib/checkout.ts b/src/server/checkout.ts
similarity index 93%
rename from src/lib/checkout.ts
rename to src/server/checkout.ts
index 49ec32fb..09c86991 100644
--- a/src/lib/checkout.ts
+++ b/src/server/checkout.ts
@@ -1,7 +1,7 @@
 import type { StripePaymentStatus } from "~/types";
 
-import { cn } from "~/lib/utils";
-import { type CartLineItemSchema } from "~/lib/validations/cart";
+import { cn } from "~/server/utils";
+import { type CartLineItemSchema } from "~/server/validations/cart";
 
 // @see: https://github.com/jackblatch/OneStopShop/blob/main/server-actions/stripe/payment.ts
 export function calculateOrderAmount(items: CartLineItemSchema[]) {
diff --git a/src/lib/constants.ts b/src/server/constants.ts
similarity index 100%
rename from src/lib/constants.ts
rename to src/server/constants.ts
diff --git a/src/server/db/index.ts b/src/server/db/index.ts
new file mode 100644
index 00000000..b6011288
--- /dev/null
+++ b/src/server/db/index.ts
@@ -0,0 +1,21 @@
+import { drizzle } from "drizzle-orm/postgres-js";
+import postgres from "postgres";
+
+import { env } from "~/env";
+
+import * as schema from "./schema";
+
+/**
+ * Cache the database connection in development. This avoids creating a new connection on every HMR
+ * update.
+ */
+const globalForDb = globalThis as unknown as {
+  conn: postgres.Sql | undefined;
+};
+
+const conn = globalForDb.conn ?? postgres(env.DATABASE_URL);
+if (env.NODE_ENV !== "production") {
+  globalForDb.conn = conn;
+}
+
+export const db = drizzle(conn, { schema });
diff --git a/src/db/migrate.ts b/src/server/db/migrate.ts
similarity index 87%
rename from src/db/migrate.ts
rename to src/server/db/migrate.ts
index 6b6561fb..1ad7aeb5 100644
--- a/src/db/migrate.ts
+++ b/src/server/db/migrate.ts
@@ -1,7 +1,8 @@
+import type { PostgresJsDatabase } from "drizzle-orm/postgres-js/driver";
+
 import { migrate } from "drizzle-orm/postgres-js/migrator";
 
 import { db } from ".";
-import { PostgresJsDatabase } from "drizzle-orm/postgres-js/driver";
 
 export async function runMigrate() {
   console.log("⏳ Running migrations...");
diff --git a/src/db/schema/addresses.ts b/src/server/db/schema/addresses.ts
similarity index 93%
rename from src/db/schema/addresses.ts
rename to src/server/db/schema/addresses.ts
index dae8ac69..f5e4fd6d 100644
--- a/src/db/schema/addresses.ts
+++ b/src/server/db/schema/addresses.ts
@@ -1,6 +1,6 @@
 import { pgTable, text, varchar } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { lifecycleDates } from "./utils";
 
diff --git a/src/db/schema/carts.ts b/src/server/db/schema/carts.ts
similarity index 86%
rename from src/db/schema/carts.ts
rename to src/server/db/schema/carts.ts
index 663a9089..d25ca81c 100644
--- a/src/db/schema/carts.ts
+++ b/src/server/db/schema/carts.ts
@@ -1,7 +1,7 @@
 import { boolean, json, pgTable, text, varchar } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
-import { type CartItemSchema } from "~/lib/validations/cart";
+import { generateId } from "~/server/id";
+import { type CartItemSchema } from "~/server/validations/cart";
 
 import { lifecycleDates } from "./utils";
 
diff --git a/src/db/schema/categories.ts b/src/server/db/schema/categories.ts
similarity index 95%
rename from src/db/schema/categories.ts
rename to src/server/db/schema/categories.ts
index 8d131264..6627a212 100644
--- a/src/db/schema/categories.ts
+++ b/src/server/db/schema/categories.ts
@@ -1,7 +1,7 @@
 import { relations } from "drizzle-orm";
 import { pgTable, text, varchar } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { products } from "./products";
 import { subcategories } from "./subcategories";
diff --git a/src/db/schema/customers.ts b/src/server/db/schema/customers.ts
similarity index 96%
rename from src/db/schema/customers.ts
rename to src/server/db/schema/customers.ts
index 01a343ea..0ffbff8a 100644
--- a/src/db/schema/customers.ts
+++ b/src/server/db/schema/customers.ts
@@ -1,7 +1,7 @@
 import { relations } from "drizzle-orm";
 import { index, pgTable, text, varchar } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { stores } from "./stores";
 import { lifecycleDates } from "./utils";
diff --git a/src/db/schema/index.ts b/src/server/db/schema/index.ts
similarity index 100%
rename from src/db/schema/index.ts
rename to src/server/db/schema/index.ts
diff --git a/src/db/schema/notifications.ts b/src/server/db/schema/notifications.ts
similarity index 95%
rename from src/db/schema/notifications.ts
rename to src/server/db/schema/notifications.ts
index 45a98598..0aec2a8e 100644
--- a/src/db/schema/notifications.ts
+++ b/src/server/db/schema/notifications.ts
@@ -1,6 +1,6 @@
 import { boolean, pgTable, text, varchar } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { lifecycleDates } from "./utils";
 
diff --git a/src/db/schema/orders.ts b/src/server/db/schema/orders.ts
similarity index 92%
rename from src/db/schema/orders.ts
rename to src/server/db/schema/orders.ts
index f4e1c79a..080b191b 100644
--- a/src/db/schema/orders.ts
+++ b/src/server/db/schema/orders.ts
@@ -8,8 +8,8 @@ import {
   varchar,
 } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
-import { type CheckoutItemSchema } from "~/lib/validations/cart";
+import { generateId } from "~/server/id";
+import { type CheckoutItemSchema } from "~/server/validations/cart";
 
 import { addresses } from "./addresses";
 import { stores } from "./stores";
diff --git a/src/db/schema/payments.ts b/src/server/db/schema/payments.ts
similarity index 96%
rename from src/db/schema/payments.ts
rename to src/server/db/schema/payments.ts
index ff1cc0fc..7f96b400 100644
--- a/src/db/schema/payments.ts
+++ b/src/server/db/schema/payments.ts
@@ -7,7 +7,7 @@ import {
   varchar,
 } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { stores } from "./stores";
 import { lifecycleDates } from "./utils";
diff --git a/src/db/schema/products.ts b/src/server/db/schema/products.ts
similarity index 98%
rename from src/db/schema/products.ts
rename to src/server/db/schema/products.ts
index c8e924d2..c3690a01 100644
--- a/src/db/schema/products.ts
+++ b/src/server/db/schema/products.ts
@@ -1,4 +1,3 @@
-import type { StoredFile } from "~/types";
 import { relations } from "drizzle-orm";
 import {
   decimal,
@@ -11,7 +10,9 @@ import {
   varchar,
 } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import type { StoredFile } from "~/types";
+
+import { generateId } from "~/server/id";
 
 import { categories } from "./categories";
 import { stores } from "./stores";
diff --git a/src/db/schema/stocks.ts b/src/server/db/schema/stocks.ts
similarity index 96%
rename from src/db/schema/stocks.ts
rename to src/server/db/schema/stocks.ts
index 2b8a5cbe..1dfa5e9e 100644
--- a/src/db/schema/stocks.ts
+++ b/src/server/db/schema/stocks.ts
@@ -1,7 +1,7 @@
 import { relations } from "drizzle-orm";
 import { index, integer, pgTable, varchar } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { lifecycleDates } from "./utils";
 import { productVariants, productVariantValues } from "./variants";
diff --git a/src/db/schema/stores.ts b/src/server/db/schema/stores.ts
similarity index 93%
rename from src/db/schema/stores.ts
rename to src/server/db/schema/stores.ts
index 074ac3e2..826fc232 100644
--- a/src/db/schema/stores.ts
+++ b/src/server/db/schema/stores.ts
@@ -9,7 +9,7 @@ import {
   varchar,
 } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { customers } from "./customers";
 import { payments } from "./payments";
@@ -18,7 +18,7 @@ import { tags } from "./tags";
 import { lifecycleDates } from "./utils";
 import { variants } from "./variants";
 
-export const storePlanEnum = pgEnum("store_plan", ["free", "standard", "pro"]);
+export const storePlanEnum = pgEnum("store_plan", ["free", "pro"]);
 
 export const stores = pgTable("stores", {
   id: varchar("id", { length: 30 })
diff --git a/src/db/schema/subcategories.ts b/src/server/db/schema/subcategories.ts
similarity index 96%
rename from src/db/schema/subcategories.ts
rename to src/server/db/schema/subcategories.ts
index e97f92cb..8e8b3586 100644
--- a/src/db/schema/subcategories.ts
+++ b/src/server/db/schema/subcategories.ts
@@ -1,7 +1,7 @@
 import { relations } from "drizzle-orm";
 import { index, pgTable, text, varchar } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { categories } from "./categories";
 import { lifecycleDates } from "./utils";
diff --git a/src/db/schema/tags.ts b/src/server/db/schema/tags.ts
similarity index 98%
rename from src/db/schema/tags.ts
rename to src/server/db/schema/tags.ts
index cad5ae3b..36f7e4de 100644
--- a/src/db/schema/tags.ts
+++ b/src/server/db/schema/tags.ts
@@ -8,7 +8,7 @@ import {
   varchar,
 } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { products } from "./products";
 import { stores } from "./stores";
diff --git a/src/db/schema/users.ts b/src/server/db/schema/users.ts
similarity index 94%
rename from src/db/schema/users.ts
rename to src/server/db/schema/users.ts
index 80302e74..33430938 100644
--- a/src/db/schema/users.ts
+++ b/src/server/db/schema/users.ts
@@ -1,6 +1,8 @@
+import type { InferSelectModel } from "drizzle-orm";
+
 import { integer, pgTable, varchar } from "drizzle-orm/pg-core";
-import { InferSelectModel } from "drizzle-orm";
-import { generateId } from "~/lib/id";
+
+import { generateId } from "~/server/id";
 
 // export const createTable = pgTableCreator((name) => name);
 // export const modeEnum = pgEnum("mode", ["buyer", "seller"]);
diff --git a/src/db/schema/utils.ts b/src/server/db/schema/utils.ts
similarity index 100%
rename from src/db/schema/utils.ts
rename to src/server/db/schema/utils.ts
diff --git a/src/db/schema/variants.ts b/src/server/db/schema/variants.ts
similarity index 98%
rename from src/db/schema/variants.ts
rename to src/server/db/schema/variants.ts
index 0e30e450..222ed11c 100644
--- a/src/db/schema/variants.ts
+++ b/src/server/db/schema/variants.ts
@@ -9,7 +9,7 @@ import {
   varchar,
 } from "drizzle-orm/pg-core";
 
-import { generateId } from "~/lib/id";
+import { generateId } from "~/server/id";
 
 import { products } from "./products";
 import { stocks } from "./stocks";
diff --git a/src/db/seed.ts b/src/server/db/seed.ts
similarity index 96%
rename from src/db/seed.ts
rename to src/server/db/seed.ts
index d164b917..3c66bd21 100644
--- a/src/db/seed.ts
+++ b/src/server/db/seed.ts
@@ -1,15 +1,15 @@
 import "dotenv/config";
-import { drizzle } from "drizzle-orm/node-postgres";
-import { eq } from "drizzle-orm";
-import { usersTable } from "~/db/schema";
-import { env } from "~/env";
 import consola from "consola";
+import { eq } from "drizzle-orm";
+import { drizzle } from "drizzle-orm/node-postgres";
 
+import { env } from "~/env";
 import {
   revalidateItems,
   seedCategories,
   seedSubcategories,
-} from "~/lib/actions/seed";
+} from "~/server/actions/seed";
+import { usersTable } from "~/server/db/schema";
 
 // Initialize the database connection
 const db = drizzle(env.DATABASE_URL);
diff --git a/src/db/utils.ts b/src/server/db/utils.ts
similarity index 100%
rename from src/db/utils.ts
rename to src/server/db/utils.ts
diff --git a/src/lib/export.ts b/src/server/export.ts
similarity index 91%
rename from src/lib/export.ts
rename to src/server/export.ts
index a7ea1e9c..ea92ac2c 100644
--- a/src/lib/export.ts
+++ b/src/server/export.ts
@@ -1,3 +1,4 @@
+// Start of Selection
 import { type Table } from "@tanstack/react-table";
 
 export function exportTableToCSV<TData>(
@@ -26,7 +27,7 @@ export function exportTableToCSV<TData>(
   // Retrieve headers (column names)
   const headers = table
     .getAllLeafColumns()
-    .map((column) => column.id)
+    .map((column) => column.id as keyof TData | "select" | "actions")
     .filter((id) => !excludeColumns.includes(id));
 
   // Build CSV content
@@ -35,7 +36,7 @@ export function exportTableToCSV<TData>(
     ...table.getRowModel().rows.map((row) =>
       headers
         .map((header) => {
-          const cellValue = row.getValue(header);
+          const cellValue = row.getValue(String(header));
           // Handle values that might contain commas or newlines
           return typeof cellValue === "string"
             ? `"${cellValue.replace(/"/g, '""')}"`
diff --git a/src/lib/fonts.ts b/src/server/fonts.ts
similarity index 86%
rename from src/lib/fonts.ts
rename to src/server/fonts.ts
index 594ee1f8..036dacc9 100644
--- a/src/lib/fonts.ts
+++ b/src/server/fonts.ts
@@ -1,6 +1,6 @@
-import localFont from "next/font/local";
 import { GeistMono } from "geist/font/mono";
 import { GeistSans } from "geist/font/sans";
+import localFont from "next/font/local";
 
 export const fontSans = GeistSans;
 
@@ -8,6 +8,6 @@ export const fontMono = GeistMono;
 
 // Font files can be colocated inside of `pages`
 export const fontHeading = localFont({
-  src: "../assets/fonts/CalSans-SemiBold.woff2",
+  src: "~/styles/fonts/CalSans-SemiBold.woff2",
   variable: "--font-heading",
 });
diff --git a/src/lib/generate-pattern.ts b/src/server/generate-pattern.ts
similarity index 100%
rename from src/lib/generate-pattern.ts
rename to src/server/generate-pattern.ts
diff --git a/src/lib/get-stripe.ts b/src/server/get-stripe.ts
similarity index 99%
rename from src/lib/get-stripe.ts
rename to src/server/get-stripe.ts
index 00065c29..aa424ced 100644
--- a/src/lib/get-stripe.ts
+++ b/src/server/get-stripe.ts
@@ -1,6 +1,7 @@
-import { env } from "~/env.js";
 import { loadStripe, type Stripe } from "@stripe/stripe-js";
 
+import { env } from "~/env.js";
+
 let stripePromise: Promise<Stripe | null> | null = null;
 export function getStripe(stripeAccountId?: string) {
   if (!stripePromise) {
diff --git a/src/lib/handle-error.ts b/src/server/handle-error.ts
similarity index 93%
rename from src/lib/handle-error.ts
rename to src/server/handle-error.ts
index 7ffae086..654f9a79 100644
--- a/src/lib/handle-error.ts
+++ b/src/server/handle-error.ts
@@ -2,7 +2,7 @@ import { isClerkAPIResponseError } from "@clerk/nextjs/errors";
 import { toast } from "sonner";
 import * as z from "zod";
 
-import { unknownError } from "~/lib/constants";
+import { unknownError } from "~/server/constants";
 
 export function getErrorMessage(err: unknown) {
   if (err instanceof z.ZodError) {
diff --git a/src/server/host.ts b/src/server/host.ts
new file mode 100644
index 00000000..53d3b1d3
--- /dev/null
+++ b/src/server/host.ts
@@ -0,0 +1,4 @@
+export const port = process.env.PORT || 3000;
+export const host = process.env.VERCEL_PROJECT_PRODUCTION_URL
+  ? `https://${process.env.VERCEL_PROJECT_PRODUCTION_URL}`
+  : `http://localhost:${port}`;
diff --git a/src/lib/id.ts b/src/server/id.ts
similarity index 98%
rename from src/lib/id.ts
rename to src/server/id.ts
index 22c5971c..dd84a5ef 100644
--- a/src/lib/id.ts
+++ b/src/server/id.ts
@@ -89,7 +89,7 @@ export const prefixes: PrefixesKey = {
   webhook: "wbh",
 };
 
-interface GenerateIdOptions {
+type GenerateIdOptions = {
   /**
    * The length of the generated ID.
    * @default 16
@@ -102,7 +102,7 @@ interface GenerateIdOptions {
    * @example "_" => "str_abc123"
    * */
   separator?: string;
-}
+};
 
 /**
  * Generates a unique ID with a given prefix.
diff --git a/src/lib/motion.ts b/src/server/motion.ts
similarity index 100%
rename from src/lib/motion.ts
rename to src/server/motion.ts
diff --git a/src/lib/queries/github.ts b/src/server/queries/github.ts
similarity index 86%
rename from src/lib/queries/github.ts
rename to src/server/queries/github.ts
index a64a6e05..58d23678 100644
--- a/src/lib/queries/github.ts
+++ b/src/server/queries/github.ts
@@ -1,12 +1,11 @@
 import "server-only";
-
 import { unstable_cache as cache } from "next/cache";
 
 export async function getGithubStars() {
   return await cache(
     async () => {
       const response = await fetch(
-        "https://api.github.com/repos/blefnk/relivator-nextjs-template",
+        "https://api.github.com/repos/blefnk/relivator",
         {
           headers: {
             Accept: "application/vnd.github+json",
@@ -27,7 +26,7 @@ export async function getGithubStars() {
     },
     ["github-stars"],
     {
-      revalidate: 900,
+      revalidate: 1090,
       tags: ["github-stars"],
     },
   )();
diff --git a/src/lib/queries/notification.ts b/src/server/queries/notification.ts
similarity index 91%
rename from src/lib/queries/notification.ts
rename to src/server/queries/notification.ts
index 442feac0..7aa5bcb5 100644
--- a/src/lib/queries/notification.ts
+++ b/src/server/queries/notification.ts
@@ -1,9 +1,9 @@
 import "server-only";
-
-import { unstable_noStore as noStore } from "next/cache";
-import { db } from "~/db";
-import { notifications } from "~/db/schema";
 import { and, eq } from "drizzle-orm";
+import { unstable_noStore as noStore } from "next/cache";
+
+import { db } from "~/server/db";
+import { notifications } from "~/server/db/schema";
 
 export async function getNotification(input: {
   token?: string;
diff --git a/src/lib/queries/product.ts b/src/server/queries/product.ts
similarity index 98%
rename from src/lib/queries/product.ts
rename to src/server/queries/product.ts
index 1cf5485a..4cdd2355 100644
--- a/src/lib/queries/product.ts
+++ b/src/server/queries/product.ts
@@ -1,21 +1,21 @@
 import "server-only";
-
+import { and, asc, count, desc, eq, gte, inArray, lte, sql } from "drizzle-orm";
 import {
   unstable_cache as cache,
   unstable_noStore as noStore,
 } from "next/cache";
-import { db } from "~/db";
+
+import type { SearchParams } from "~/types";
+
+import { db } from "~/server/db";
 import {
   categories,
   products,
   stores,
   subcategories,
   type Product,
-} from "~/db/schema";
-import type { SearchParams } from "~/types";
-import { and, asc, count, desc, eq, gte, inArray, lte, sql } from "drizzle-orm";
-
-import { getProductsSchema } from "~/lib/validations/product";
+} from "~/server/db/schema";
+import { getProductsSchema } from "~/server/validations/product";
 
 // See the unstable_cache API docs: https://nextjs.org/docs/app/api-reference/functions/unstable_cache
 export async function getFeaturedProducts() {
diff --git a/src/lib/queries/store.ts b/src/server/queries/store.ts
similarity index 95%
rename from src/lib/queries/store.ts
rename to src/server/queries/store.ts
index 02fa3a03..e5a8405a 100644
--- a/src/lib/queries/store.ts
+++ b/src/server/queries/store.ts
@@ -1,13 +1,4 @@
 import "server-only";
-
-import {
-  unstable_cache as cache,
-  unstable_noStore as noStore,
-} from "next/cache";
-import { db } from "~/db";
-import { orders, products, stores, type Store } from "~/db/schema";
-import { takeFirstOrThrow } from "~/db/utils";
-import type { SearchParams } from "~/types";
 import {
   and,
   asc,
@@ -19,8 +10,17 @@ import {
   not,
   sql,
 } from "drizzle-orm";
+import {
+  unstable_cache as cache,
+  unstable_noStore as noStore,
+} from "next/cache";
+
+import type { SearchParams } from "~/types";
 
-import { getStoresSchema } from "~/lib/validations/store";
+import { db } from "~/server/db";
+import { orders, products, stores, type Store } from "~/server/db/schema";
+import { takeFirstOrThrow } from "~/server/db/utils";
+import { getStoresSchema } from "~/server/validations/store";
 
 export async function getFeaturedStores() {
   return await cache(
diff --git a/src/lib/queries/user.ts b/src/server/queries/user.ts
similarity index 91%
rename from src/lib/queries/user.ts
rename to src/server/queries/user.ts
index 56e02b07..b312a36e 100644
--- a/src/lib/queries/user.ts
+++ b/src/server/queries/user.ts
@@ -1,14 +1,13 @@
 import "server-only";
-
-import { cache } from "react";
-import { unstable_noStore as noStore } from "next/cache";
-import { db } from "~/db";
-import { products, stores } from "~/db/schema";
 import { currentUser } from "@clerk/nextjs/server";
 import { count, countDistinct, eq } from "drizzle-orm";
+import { unstable_noStore as noStore } from "next/cache";
+import { cache } from "react";
 
-import { getPlan } from "~/lib/actions/stripe";
-import { getPlanLimits } from "~/lib/subscription";
+import { getPlan } from "~/server/actions/stripe";
+import { db } from "~/server/db";
+import { products, stores } from "~/server/db/schema";
+import { getPlanLimits } from "~/server/subscription";
 
 /**
  * Cache is used with a data-fetching function like fetch to share a data snapshot between components.
diff --git a/src/lib/resend.ts b/src/server/resend.ts
similarity index 99%
rename from src/lib/resend.ts
rename to src/server/resend.ts
index 8fd54ae1..ceaba6b6 100644
--- a/src/lib/resend.ts
+++ b/src/server/resend.ts
@@ -1,4 +1,5 @@
-import { env } from "~/env.js";
 import { Resend } from "resend";
 
+import { env } from "~/env.js";
+
 export const resend = new Resend(env.RESEND_API_KEY || "re_123");
diff --git a/src/lib/stripe.ts b/src/server/stripe.ts
similarity index 80%
rename from src/lib/stripe.ts
rename to src/server/stripe.ts
index d0951cb2..fc64485e 100644
--- a/src/lib/stripe.ts
+++ b/src/server/stripe.ts
@@ -1,7 +1,8 @@
-import { env } from "~/env.js";
 import Stripe from "stripe";
 
+import { env } from "~/env.js";
+
 export const stripe = new Stripe(env.STRIPE_API_KEY || "", {
-  apiVersion: "2024-09-30.acacia",
+  apiVersion: "2024-11-20.acacia",
   typescript: true,
 });
diff --git a/src/lib/subscription.ts b/src/server/subscription.ts
similarity index 100%
rename from src/lib/subscription.ts
rename to src/server/subscription.ts
diff --git a/src/lib/uploadthing.ts b/src/server/uploadthing.ts
similarity index 100%
rename from src/lib/uploadthing.ts
rename to src/server/uploadthing.ts
diff --git a/src/lib/utils.ts b/src/server/utils.ts
similarity index 96%
rename from src/lib/utils.ts
rename to src/server/utils.ts
index d5adfa6f..df40b68e 100644
--- a/src/lib/utils.ts
+++ b/src/server/utils.ts
@@ -1,8 +1,10 @@
-import { env } from "~/env.js";
 import type { User } from "@clerk/nextjs/server";
+
 import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
 
+import { env } from "~/env.js";
+
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs));
 }
@@ -55,7 +57,9 @@ export function formatBytes(
 ) {
   const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
   const accurateSizes = ["Bytes", "KiB", "MiB", "GiB", "TiB"];
-  if (bytes === 0) return "0 Byte";
+  if (bytes === 0) {
+    return "0 Byte";
+  }
   const i = Math.floor(Math.log(bytes) / Math.log(1024));
   return `${(bytes / 1024 ** i).toFixed(decimals)} ${
     sizeType === "accurate"
@@ -106,7 +110,9 @@ export function getUserEmail(user: User | null) {
 }
 
 export function isMacOs() {
-  if (typeof window === "undefined") return false;
+  if (typeof window === "undefined") {
+    return false;
+  }
 
   return window.navigator.userAgent.includes("Mac");
 }
diff --git a/src/lib/validations/auth.ts b/src/server/validations/auth.ts
similarity index 100%
rename from src/lib/validations/auth.ts
rename to src/server/validations/auth.ts
diff --git a/src/lib/validations/cart.ts b/src/server/validations/cart.ts
similarity index 100%
rename from src/lib/validations/cart.ts
rename to src/server/validations/cart.ts
diff --git a/src/lib/validations/notification.ts b/src/server/validations/notification.ts
similarity index 100%
rename from src/lib/validations/notification.ts
rename to src/server/validations/notification.ts
diff --git a/src/lib/validations/og.ts b/src/server/validations/og.ts
similarity index 100%
rename from src/lib/validations/og.ts
rename to src/server/validations/og.ts
diff --git a/src/lib/validations/order.ts b/src/server/validations/order.ts
similarity index 100%
rename from src/lib/validations/order.ts
rename to src/server/validations/order.ts
diff --git a/src/lib/validations/params.ts b/src/server/validations/params.ts
similarity index 100%
rename from src/lib/validations/params.ts
rename to src/server/validations/params.ts
diff --git a/src/lib/validations/product.ts b/src/server/validations/product.ts
similarity index 100%
rename from src/lib/validations/product.ts
rename to src/server/validations/product.ts
diff --git a/src/lib/validations/store.ts b/src/server/validations/store.ts
similarity index 96%
rename from src/lib/validations/store.ts
rename to src/server/validations/store.ts
index b6d754a5..0503a534 100644
--- a/src/lib/validations/store.ts
+++ b/src/server/validations/store.ts
@@ -1,6 +1,6 @@
 import * as z from "zod";
 
-import { slugify } from "~/lib/utils";
+import { slugify } from "~/server/utils";
 
 export const createStoreSchema = z
   .object({
diff --git a/src/lib/validations/stripe.ts b/src/server/validations/stripe.ts
similarity index 94%
rename from src/lib/validations/stripe.ts
rename to src/server/validations/stripe.ts
index b5d85f15..ab609728 100644
--- a/src/lib/validations/stripe.ts
+++ b/src/server/validations/stripe.ts
@@ -1,6 +1,6 @@
 import * as z from "zod";
 
-import { cartLineItemSchema } from "~/lib/validations/cart";
+import { cartLineItemSchema } from "~/server/validations/cart";
 
 export const managePlanSchema = z.object({
   stripePriceId: z.string(),
diff --git a/src/assets/data/products.json b/src/styles/data/products.json
similarity index 100%
rename from src/assets/data/products.json
rename to src/styles/data/products.json
diff --git a/src/assets/fonts/CalSans-SemiBold.ttf b/src/styles/fonts/CalSans-SemiBold.ttf
similarity index 100%
rename from src/assets/fonts/CalSans-SemiBold.ttf
rename to src/styles/fonts/CalSans-SemiBold.ttf
diff --git a/src/assets/fonts/CalSans-SemiBold.woff b/src/styles/fonts/CalSans-SemiBold.woff
similarity index 100%
rename from src/assets/fonts/CalSans-SemiBold.woff
rename to src/styles/fonts/CalSans-SemiBold.woff
diff --git a/src/assets/fonts/CalSans-SemiBold.woff2 b/src/styles/fonts/CalSans-SemiBold.woff2
similarity index 100%
rename from src/assets/fonts/CalSans-SemiBold.woff2
rename to src/styles/fonts/CalSans-SemiBold.woff2
diff --git a/src/styles/fonts/GeistMonoVF.woff b/src/styles/fonts/GeistMonoVF.woff
new file mode 100644
index 00000000..f2ae185c
Binary files /dev/null and b/src/styles/fonts/GeistMonoVF.woff differ
diff --git a/src/styles/fonts/GeistVF.woff b/src/styles/fonts/GeistVF.woff
new file mode 100644
index 00000000..1b62daac
Binary files /dev/null and b/src/styles/fonts/GeistVF.woff differ
diff --git a/src/assets/fonts/Inter-Bold.ttf b/src/styles/fonts/Inter-Bold.ttf
similarity index 100%
rename from src/assets/fonts/Inter-Bold.ttf
rename to src/styles/fonts/Inter-Bold.ttf
diff --git a/src/assets/fonts/Inter-Regular.ttf b/src/styles/fonts/Inter-Regular.ttf
similarity index 100%
rename from src/assets/fonts/Inter-Regular.ttf
rename to src/styles/fonts/Inter-Regular.ttf
diff --git a/src/styles/globals.css b/src/styles/globals.css
index c60d03c7..1b9657c3 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -2,12 +2,18 @@
 @tailwind components;
 @tailwind utilities;
 
+body {
+  font-family: Arial, Helvetica, sans-serif;
+}
+
 @layer base {
   :root {
     --background: 0 0% 100%;
     --foreground: 240 10% 3.9%;
     --card: 0 0% 100%;
-    --card-foreground: 240 10% 3.9%;
+    --card-foreground: 240 3% 6%;
+    --card-two: 240 10% 3.9%;
+    --card-two-foreground: 0 0% 98%;
     --popover: 0 0% 100%;
     --popover-foreground: 240 10% 3.9%;
     --primary: 240 5.9% 10%;
@@ -22,8 +28,21 @@
     --destructive-foreground: 0 0% 98%;
     --border: 240 5.9% 90%;
     --input: 240 5.9% 90%;
-    --ring: 240 5.9% 10%;
+    --ring: 240 10% 3.9%;
+    --chart-1: 12 76% 61%;
+    --chart-2: 173 58% 39%;
+    --chart-3: 197 37% 24%;
+    --chart-4: 43 74% 66%;
+    --chart-5: 27 87% 67%;
     --radius: 0.5rem;
+    --sidebar-background: 0 0% 98%;
+    --sidebar-foreground: 240 5.3% 26.1%;
+    --sidebar-primary: 240 5.9% 10%;
+    --sidebar-primary-foreground: 0 0% 98%;
+    --sidebar-accent: 240 4.8% 95.9%;
+    --sidebar-accent-foreground: 240 5.9% 10%;
+    --sidebar-border: 220 13% 91%;
+    --sidebar-ring: 217.2 91.2% 59.8%;
   }
 
   .dark {
@@ -31,6 +50,8 @@
     --foreground: 0 0% 98%;
     --card: 240 10% 3.9%;
     --card-foreground: 0 0% 98%;
+    --card-two: 240 3% 6%;
+    --card-two-foreground: 0 0% 98%;
     --popover: 240 10% 3.9%;
     --popover-foreground: 0 0% 98%;
     --primary: 0 0% 98%;
@@ -46,6 +67,19 @@
     --border: 240 3.7% 15.9%;
     --input: 240 3.7% 15.9%;
     --ring: 240 4.9% 83.9%;
+    --chart-1: 220 70% 50%;
+    --chart-2: 160 60% 45%;
+    --chart-3: 30 80% 55%;
+    --chart-4: 280 65% 60%;
+    --chart-5: 340 75% 55%;
+    --sidebar-background: 240 5.9% 10%;
+    --sidebar-foreground: 240 4.8% 95.9%;
+    --sidebar-primary: 224.3 76.3% 48%;
+    --sidebar-primary-foreground: 0 0% 100%;
+    --sidebar-accent: 240 3.7% 15.9%;
+    --sidebar-accent-foreground: 240 4.8% 95.9%;
+    --sidebar-border: 240 3.7% 15.9%;
+    --sidebar-ring: 217.2 91.2% 59.8%;
   }
 }
 
@@ -53,23 +87,12 @@
   * {
     @apply border-border;
   }
+
   body {
     @apply bg-background text-foreground;
   }
-}
-
-@layer components {
-  .zoom-image [data-rmiz-modal-overlay="visible"] {
-    @apply bg-background/10 backdrop-blur;
-  }
 
-  .zoom-image [data-rmiz-modal-img] {
-    @apply rounded-md lg:rounded-2xl;
+  .sheet-link {
+    @apply w-full justify-start gap-2 text-muted-foreground hover:text-foreground flex items-center right-4 top-2 p-1 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none;
   }
-}
-
-@media (max-width: 640px) {
-  .container {
-    @apply px-4;
-  }
-}
+}
\ No newline at end of file
diff --git a/src/types/index.ts b/src/types/index.ts
index 5f2f2db6..4314a450 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -1,11 +1,13 @@
-import { type Store } from "~/db/schema";
-import { type SQL } from "drizzle-orm";
 import type Stripe from "stripe";
+
+import { type SQL } from "drizzle-orm";
 import { type ClientUploadedFileData } from "uploadthing/types";
 
 import type { Icons } from "~/components/icons";
 
-export interface NavItem {
+import { type Store } from "~/server/db/schema";
+
+export type NavItem = {
   title: string;
   href?: string;
   active?: boolean;
@@ -14,20 +16,20 @@ export interface NavItem {
   icon?: keyof typeof Icons;
   label?: string;
   description?: string;
-}
+};
 
-export interface NavItemWithChildren extends NavItem {
+export type NavItemWithChildren = {
   items?: NavItemWithChildren[];
-}
+} & NavItem;
 
-export interface FooterItem {
+export type FooterItem = {
   title: string;
   items: {
     title: string;
     href: string;
     external?: boolean;
   }[];
-}
+};
 
 export type MainNavItem = NavItemWithChildren;
 
@@ -35,27 +37,27 @@ export type SidebarNavItem = NavItemWithChildren;
 
 export type SearchParams = Record<string, string | string[] | undefined>;
 
-export interface UploadedFile<T = unknown> extends ClientUploadedFileData<T> {}
+export type UploadedFile<T = unknown> = {} & ClientUploadedFileData<T>;
 
-export interface StoredFile {
+export type StoredFile = {
   id: string;
   name: string;
   url: string;
-}
+};
 
-export interface Option {
+export type Option = {
   label: string;
   value: string;
   icon?: React.ComponentType<{ className?: string }>;
   withCount?: boolean;
-}
+};
 
-export interface DataTableFilterField<TData> {
+export type DataTableFilterField<TData> = {
   label: string;
   value: keyof TData;
   placeholder?: string;
   options?: Option[];
-}
+};
 
 export type DrizzleWhere<T> =
   | SQL
@@ -64,7 +66,7 @@ export type DrizzleWhere<T> =
 
 export type StripePaymentStatus = Stripe.PaymentIntent.Status;
 
-export interface Plan {
+export type Plan = {
   id: Store["plan"];
   title: string;
   description: string;
@@ -76,17 +78,17 @@ export interface Plan {
     tags: number;
     variants: number;
   };
-}
+};
 
-export interface PlanWithPrice extends Plan {
+export type PlanWithPrice = {
   price: string;
-}
+} & Plan;
 
-export interface UserPlan extends Plan {
+export type UserPlan = {
   stripeSubscriptionId?: string | null;
   stripeCurrentPeriodEnd?: string | null;
   stripeCustomerId?: string | null;
   isSubscribed: boolean;
   isCanceled: boolean;
   isActive: boolean;
-}
+} & Plan;
diff --git a/src/utils/index.ts b/src/utils/index.ts
new file mode 100644
index 00000000..a5ef1935
--- /dev/null
+++ b/src/utils/index.ts
@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
diff --git a/tailwind.config.ts b/tailwind.config.ts
index b551700d..0c1a21c0 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -1,37 +1,38 @@
-import { fontFamily } from "tailwindcss/defaultTheme";
-import { type Config } from "tailwindcss/types/config";
+import type { Config } from "tailwindcss";
+
 import animate from "tailwindcss-animate";
-import typography from "@tailwindcss/typography";
+import { fontFamily } from "tailwindcss/defaultTheme";
 
 export default {
   darkMode: ["class"],
   content: [
-    "./src/**/*.{js,ts,jsx,tsx}",
-    "./node_modules/@tremor/**/*.{js,ts,jsx,tsx}",
+    "./src/app/**/*.{ts,tsx,mdx}",
+    "./src/components/**/*.{ts,tsx,mdx}",
   ],
   theme: {
-    /* tremor */
-    transparent: "transparent",
-    current: "currentColor",
-    /* */
     container: {
       center: true,
       padding: "2rem",
       screens: {
-        "2xl": "1400px",
+        "2xl": "1536px",
       },
     },
     extend: {
-      screens: {
-        xs: "480px",
-        xxs: "380px",
-      },
       colors: {
-        border: "hsl(var(--border))",
-        input: "hsl(var(--input))",
-        ring: "hsl(var(--ring))",
         background: "hsl(var(--background))",
         foreground: "hsl(var(--foreground))",
+        card: {
+          DEFAULT: "hsl(var(--card))",
+          foreground: "hsl(var(--card-foreground))",
+        },
+        cardTwo: {
+          DEFAULT: "hsl(var(--card-two))",
+          foreground: "hsl(var(--card-two-foreground))",
+        },
+        popover: {
+          DEFAULT: "hsl(var(--popover))",
+          foreground: "hsl(var(--popover-foreground))",
+        },
         primary: {
           DEFAULT: "hsl(var(--primary))",
           foreground: "hsl(var(--primary-foreground))",
@@ -40,10 +41,6 @@ export default {
           DEFAULT: "hsl(var(--secondary))",
           foreground: "hsl(var(--secondary-foreground))",
         },
-        destructive: {
-          DEFAULT: "hsl(var(--destructive))",
-          foreground: "hsl(var(--destructive-foreground))",
-        },
         muted: {
           DEFAULT: "hsl(var(--muted))",
           foreground: "hsl(var(--muted-foreground))",
@@ -52,210 +49,72 @@ export default {
           DEFAULT: "hsl(var(--accent))",
           foreground: "hsl(var(--accent-foreground))",
         },
-        popover: {
-          DEFAULT: "hsl(var(--popover))",
-          foreground: "hsl(var(--popover-foreground))",
-        },
-        card: {
-          DEFAULT: "hsl(var(--card))",
-          foreground: "hsl(var(--card-foreground))",
+        destructive: {
+          DEFAULT: "hsl(var(--destructive))",
+          foreground: "hsl(var(--destructive-foreground))",
         },
-        /* tremor */
-        // light mode
-        tremor: {
-          brand: {
-            faint: "#eff6ff", // blue-50
-            muted: "#bfdbfe", // blue-200
-            subtle: "#60a5fa", // blue-400
-            DEFAULT: "#3b82f6", // blue-500
-            emphasis: "#1d4ed8", // blue-700
-            inverted: "#ffffff", // white
-          },
-          background: {
-            muted: "#f9fafb", // gray-50
-            subtle: "#f3f4f6", // gray-100
-            DEFAULT: "#ffffff", // white
-            emphasis: "#374151", // gray-700
-          },
-          border: {
-            DEFAULT: "#e5e7eb", // gray-200
-          },
-          ring: {
-            DEFAULT: "#e5e7eb", // gray-200
-          },
-          content: {
-            subtle: "#9ca3af", // gray-400
-            DEFAULT: "#6b7280", // gray-500
-            emphasis: "#374151", // gray-700
-            strong: "#111827", // gray-900
-            inverted: "#ffffff", // white
-          },
+        border: "hsl(var(--border))",
+        input: "hsl(var(--input))",
+        ring: "hsl(var(--ring))",
+        chart: {
+          "1": "hsl(var(--chart-1))",
+          "2": "hsl(var(--chart-2))",
+          "3": "hsl(var(--chart-3))",
+          "4": "hsl(var(--chart-4))",
+          "5": "hsl(var(--chart-5))",
         },
-        // dark mode
-        "dark-tremor": {
-          brand: {
-            faint: "#0B1229", // custom
-            muted: "#172554", // blue-950
-            subtle: "#1e40af", // blue-800
-            DEFAULT: "#3b82f6", // blue-500
-            emphasis: "#60a5fa", // blue-400
-            inverted: "#030712", // gray-950
-          },
-          background: {
-            muted: "#131A2B", // custom
-            subtle: "#1f2937", // gray-800
-            DEFAULT: "#111827", // gray-900
-            emphasis: "#d1d5db", // gray-300
-          },
-          border: {
-            DEFAULT: "#1f2937", // gray-800
-          },
-          ring: {
-            DEFAULT: "#1f2937", // gray-800
-          },
-          content: {
-            subtle: "#4b5563", // gray-600
-            DEFAULT: "#6b7280", // gray-600
-            emphasis: "#e5e7eb", // gray-200
-            strong: "#f9fafb", // gray-50
-            inverted: "#000000", // black
-          },
+        sidebar: {
+          DEFAULT: "hsl(var(--sidebar-background))",
+          foreground: "hsl(var(--sidebar-foreground))",
+          primary: "hsl(var(--sidebar-primary))",
+          "primary-foreground": "hsl(var(--sidebar-primary-foreground))",
+          accent: "hsl(var(--sidebar-accent))",
+          "accent-foreground": "hsl(var(--sidebar-accent-foreground))",
+          border: "hsl(var(--sidebar-border))",
+          ring: "hsl(var(--sidebar-ring))",
         },
-        /* */
       },
       borderRadius: {
-        lg: `var(--radius)`,
-        md: `calc(var(--radius) - 2px)`,
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
         sm: "calc(var(--radius) - 4px)",
-        /* tremor */
-        "tremor-small": "0.375rem",
-        "tremor-default": "0.5rem",
-        "tremor-full": "9999px",
-        /* */
-      },
-      /* tremor */
-      boxShadow: {
-        // light
-        "tremor-input": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
-        "tremor-card":
-          "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
-        "tremor-dropdown":
-          "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
-        // dark
-        "dark-tremor-input": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
-        "dark-tremor-card":
-          "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
-        "dark-tremor-dropdown":
-          "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
       },
-      fontSize: {
-        "tremor-label": ["0.75rem", { lineHeight: "1rem" }],
-        "tremor-default": ["0.875rem", { lineHeight: "1.25rem" }],
-        "tremor-title": ["1.125rem", { lineHeight: "1.75rem" }],
-        "tremor-metric": ["1.875rem", { lineHeight: "2.25rem" }],
-      },
-      /* */
       fontFamily: {
         sans: ["var(--font-geist-sans)", ...fontFamily.sans],
         mono: ["var(--font-geist-mono)", ...fontFamily.mono],
-        heading: ["var(--font-heading)", ...fontFamily.sans],
       },
       keyframes: {
         "accordion-down": {
-          from: { height: "0" },
-          to: { height: "var(--radix-accordion-content-height)" },
-        },
-        "accordion-up": {
-          from: { height: "var(--radix-accordion-content-height)" },
-          to: { height: "0" },
-        },
-        wiggle: {
-          "0%, 100%": {
-            transform: "translateX(0%)",
-            transformOrigin: "50% 50%",
+          from: {
+            height: "0",
+          },
+          to: {
+            height: "var(--radix-accordion-content-height)",
           },
-          "15%": { transform: "translateX(-6px) rotate(-6deg)" },
-          "30%": { transform: "translateX(9px) rotate(6deg)" },
-          "45%": { transform: "translateX(-9px) rotate(-3.6deg)" },
-          "60%": { transform: "translateX(3px) rotate(2.4deg)" },
-          "75%": { transform: "translateX(-2px) rotate(-1.2deg)" },
         },
-        /**
-         * Original source:
-         * @see https://github.com/juliusmarminge/acme-corp/blob/main/tooling/tailwind/index.ts
-         */
-        "fade-up": {
-          "0%": {
-            opacity: "0",
-            transform: "translateY(10px)",
+        "accordion-up": {
+          from: {
+            height: "var(--radix-accordion-content-height)",
           },
-          "75%": {
-            opacity: "0.6",
+          to: {
+            height: "0",
           },
-          "100%": {
+        },
+        "caret-blink": {
+          "0%,70%,100%": {
             opacity: "1",
-            transform: "translateY(0)",
           },
-        },
-        "fade-down": {
-          "0%": {
+          "20%,50%": {
             opacity: "0",
-            transform: "translateY(-10px)",
           },
-          "75%": {
-            opacity: "0.6",
-          },
-          "100%": {
-            opacity: "1",
-            transform: "translateY(0)",
-          },
-        },
-        "caret-blink": {
-          "0%,70%,100%": { opacity: "1" },
-          "20%,50%": { opacity: "0" },
         },
       },
-      /* */
       animation: {
         "accordion-down": "accordion-down 0.2s ease-out",
         "accordion-up": "accordion-up 0.2s ease-out",
-        wiggle: "wiggle 0.8s both",
-        "fade-up": "fade-up 0.5s ease-out",
-        "fade-down": "fade-down 0.5s ease-out",
         "caret-blink": "caret-blink 1.25s ease-out infinite",
       },
     },
   },
-  /* tremor */
-  safelist: [
-    {
-      pattern:
-        /^(bg-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
-      variants: ["hover", "ui-selected"],
-    },
-    {
-      pattern:
-        /^(text-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
-      variants: ["hover", "ui-selected"],
-    },
-    {
-      pattern:
-        /^(border-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
-      variants: ["hover", "ui-selected"],
-    },
-    {
-      pattern:
-        /^(ring-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
-    },
-    {
-      pattern:
-        /^(stroke-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
-    },
-    {
-      pattern:
-        /^(fill-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-(?:50|100|200|300|400|500|600|700|800|900|950))$/,
-    },
-  ],
-  /* */
-  plugins: [animate, typography],
+  plugins: [animate],
 } satisfies Config;
diff --git a/tsconfig.json b/tsconfig.json
index c7680966..d13fc2f2 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,53 +1,38 @@
 {
   "compilerOptions": {
-    "incremental": true,
-    "target": "es2022",
-    "jsx": "preserve",
-    "lib": ["dom", "dom.iterable", "es2022"],
-    "moduleDetection": "force",
-    "module": "preserve",
-    "paths": {
-      "@/*": ["./cluster/*"],
-      "$/*": ["./addons/*"],
-      "#/*": ["./public/*"],
-      "~/*": ["./src/*"]
-    },
-    "resolveJsonModule": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "target": "ES2022",
     "allowJs": true,
+    "resolveJsonModule": true,
+    "moduleDetection": "force",
+    "isolatedModules": true,
     "strict": true,
-    "strictNullChecks": false,
-    "noImplicitAny": false,
-    "noImplicitOverride": true,
     "noUncheckedIndexedAccess": true,
+    "checkJs": true,
+    "lib": ["DOM", "DOM.Iterable", "ES2022"],
     "noEmit": true,
-    "esModuleInterop": true,
-    "forceConsistentCasingInFileNames": true,
-    "isolatedModules": true,
-    "verbatimModuleSyntax": false,
-    "skipLibCheck": true,
-    "plugins": [
-      {
-        "name": "next"
-      }
-    ]
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "jsx": "preserve",
+    "plugins": [{ "name": "next" }],
+    "incremental": true,
+    "baseUrl": ".",
+    "paths": {
+      "~/*": ["./src/*"]
+    }
   },
   "include": [
     ".next/types/**/*.ts",
-    "addons/**/*.ts",
-    "addons/**/*.tsx",
-    "cluster/**/*.ts",
-    "cluster/**/*.tsx",
+    "tailwind.config.ts",
     "drizzle.config.ts",
+    "postcss.config.js",
     "eslint.config.js",
-    "next.config.js",
+    "next.config.ts",
     "next-env.d.ts",
-    "reset.d.ts",
     "src/**/*.ts",
     "src/**/*.tsx",
-    "src/env.js",
-    "postcss.config.js",
-    "tailwind.config.ts",
-    "unlighthouse.config.ts"
+    "src/env.js"
   ],
   "exclude": ["node_modules"]
 }
diff --git a/unlighthouse.config.ts b/unlighthouse.config.ts
deleted file mode 100644
index 217e5e1e..00000000
--- a/unlighthouse.config.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-interface Page {
-  goto: (arg0: string, arg1: { waitUntil: string }) => unknown;
-  $: (arg0: string) => Promise<{
-    type: (arg0: string) => unknown;
-    click: () => unknown;
-  }>;
-  $eval: (
-    arg0: string,
-    arg1: (form: { submit: () => unknown }) => unknown,
-  ) => unknown;
-  waitForNavigation: (arg0: { waitUntil: string }) => Promise<unknown>;
-}
-
-const config = {
-  hooks: {
-    async authenticate(page: Page) {
-      // login to the page
-      await page.goto("https://relivator.com/signin", {
-        waitUntil: "networkidle0",
-      });
-      const emailInput = await page.$('input[type="text"]');
-      await emailInput.type("unlighthouse180@gmail.com");
-      const passwordInput = await page.$('input[type="password"]');
-      await passwordInput.type("unlighT/18!House");
-      const submitButton = await page.$('button[type="submit"]');
-      await Promise.all([
-        await submitButton.click(),
-        await page.waitForNavigation({
-          waitUntil: "networkidle0",
-        }),
-      ]);
-    },
-  },
-};
-
-export default config;