refactor: move auth to independant nextjs

apps/auth/.eslintrc.json

@@ -0,0 +1,50 @@
+{
+  "extends": [
+    "next/core-web-vitals",
+    "plugin:storybook/recommended",
+    "plugin:import/typescript",
+    "plugin:@typescript-eslint/recommended",
+    "prettier"
+  ],
+  "plugins": ["@typescript-eslint", "import", "prettier"],
+  "rules": {
+    "@typescript-eslint/no-extra-semi": "off",
+    "@typescript-eslint/no-unused-vars": "error",
+    "@typescript-eslint/prefer-for-of": "error",
+    "@typescript-eslint/unified-signatures": "error",
+    "import/no-deprecated": "error",
+    "import/no-extraneous-dependencies": "error",
+    "import/no-unassigned-import": "error",
+    "import/no-unresolved": "off",
+    "import/order": ["error", { "newlines-between": "always-and-inside-groups" }],
+    "arrow-body-style": "off",
+    "prefer-arrow-callback": "error",
+    "no-duplicate-imports": "error",
+    "no-empty-function": "error",
+    "no-empty": ["error", { "allowEmptyCatch": true }],
+    "no-new-wrappers": "error",
+    "no-param-reassign": "error",
+    "no-return-await": "error",
+    "no-sequences": "error",
+    "no-throw-literal": "error",
+    "no-void": "error",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "no-async-promise-executor": "off",
+    "prettier/prettier": [
+      "error",
+      {
+        "semi": false,
+        "trailingComma": "all",
+        "printWidth": 90,
+        "quoteProps": "consistent",
+        "singleQuote": false,
+        "tabWidth": 2,
+        "useTabs": false,
+        "bracketSpacing": true,
+        "arrowParens": "always",
+        "proseWrap": "preserve",
+        "endOfLine": "lf"
+      }
+    ]
+  }
+}

apps/auth/.gitignore

@@ -0,0 +1,45 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+# browserstack-cypress
+log
+*.log
+tmpBstackPackages
+results
+build_artifacts
+screenshots
+downloads

apps/auth/.prettierrc.js

@@ -0,0 +1,13 @@
+module.exports = {
+  semi: false,
+  trailingComma: "all",
+  printWidth: 90,
+  quoteProps: "consistent",
+  singleQuote: false,
+  tabWidth: 2,
+  useTabs: false,
+  bracketSpacing: true,
+  arrowParens: "always",
+  proseWrap: "preserve",
+  endOfLine: "lf",
+}

apps/auth/.storybook/faker.ts

@@ -0,0 +1,6 @@
+import { faker } from "@faker-js/faker";
+
+// Set a global seed for deterministic results on UI
+faker.seed(12345);
+
+export default faker;

apps/auth/.storybook/main.ts

@@ -0,0 +1,36 @@
+import type { StorybookConfig } from "@storybook/nextjs"
+
+const config: StorybookConfig = {
+  stories: ["../**/*.mdx", "../**/*.stories.@(js|jsx|mjs|ts|tsx)"],
+  features: {
+    experimentalRSC: true,
+  },
+  addons: [
+    "@storybook/addon-onboarding",
+    "@storybook/addon-links",
+    "@storybook/addon-essentials",
+    "@chromatic-com/storybook",
+    "@storybook/addon-interactions",
+    "@storybook/addon-postcss",
+  ],
+  framework: {
+    name: "@storybook/nextjs",
+    options: {},
+  },
+  webpackFinal: async (config) => {
+    const imageRule = config.module?.rules?.find((rule) => {
+      const test = (rule as { test: RegExp }).test
+      if (!test) {
+        return false
+      }
+      return test.test(".svg")
+    }) as { [key: string]: any }
+    imageRule.exclude = /\.svg$/
+    config.module?.rules?.push({
+      test: /\.svg$/,
+      use: ["@svgr/webpack"],
+    })
+    return config
+  },
+}
+export default config

apps/auth/.storybook/preview.tsx

@@ -0,0 +1,86 @@
+import React from "react"
+import type { Preview } from "@storybook/react"
+import { MockedProvider } from "@apollo/client/testing"
+import "../app/globals.css"
+import { AppSidebar } from "../components/app-sidebar"
+import { SidebarInset, SidebarProvider } from "../ui/sidebar"
+import {
+  AvatarDocument,
+  GetRealtimePriceUpdatesDocument,
+  Role,
+} from "../lib/graphql/generated"
+import { mockRealtimePrice } from "../lib/graphql/generated/mocks"
+import { AppLayout } from "../app/app-layout"
+
+const defaultMocks = [
+  {
+    request: { query: AvatarDocument },
+    result: {
+      data: {
+        me: {
+          user: {
+            userId: "usr_123",
+            email: "[email protected]",
+            roles: [Role.Admin],
+          },
+        },
+      },
+    },
+  },
+  {
+    request: { query: GetRealtimePriceUpdatesDocument },
+    result: {
+      data: {
+        realtimePrice: mockRealtimePrice({
+          usdCentsPerBtc: 100000,
+        }),
+      },
+    },
+  },
+]
+
+const StorybookWrapper = ({ children, mocks = [] }) => (
+  <div className="antialiased select-none bg-background">
+    <MockedProvider mocks={[...defaultMocks, ...mocks]} addTypename={false}>
+      <SidebarProvider>
+        <AppSidebar />
+        <SidebarInset className="min-h-screen md:peer-data-[variant=inset]:shadow-none border">
+          <AppLayout>{children}</AppLayout>
+        </SidebarInset>
+      </SidebarProvider>
+    </MockedProvider>
+  </div>
+)
+
+const preview: Preview = {
+  parameters: {
+    nextjs: {
+      appDirectory: true,
+    },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+  decorators: [
+    (Story, context) => {
+      if (context.title.startsWith("Pages/")) {
+        const storyMocks = context?.args?.mocks || []
+        return (
+          <StorybookWrapper mocks={storyMocks}>
+            <Story />
+          </StorybookWrapper>
+        )
+      }
+      return (
+        <div className="max-w-7xl m-auto p-4">
+          <Story />
+        </div>
+      )
+    },
+  ],
+}
+
+export default preview

apps/auth/Dockerfile

@@ -0,0 +1,38 @@
+# Base image
+FROM node:20-alpine AS base
+
+FROM base AS builder
+RUN apk add --no-cache libc6-compat
+WORKDIR /app
+RUN corepack enable pnpm
+COPY apps/admin-panel .
+RUN pnpm install --frozen-lockfile
+RUN pnpm run build
+
+FROM base AS runner
+WORKDIR /app
+
+ENV NODE_ENV production
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+
+COPY --from=builder /app/public ./public
+
+# Set the correct permission for prerender cache
+RUN mkdir .next
+RUN chown nextjs:nodejs .next
+
+# Automatically leverage output traces to reduce image size
+# https://nextjs.org/docs/advanced-features/output-file-tracing
+COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
+COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
+
+USER nextjs
+
+EXPOSE 3000
+
+ENV PORT 3000
+
+# server.js is created by next build from the standalone output
+# https://nextjs.org/docs/pages/api-reference/next-config-js/output
+CMD HOSTNAME="0.0.0.0" node server.js

apps/auth/README.md

@@ -0,0 +1,20 @@
+This is a [Next.js](https://nextjs.org/) project
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+```
+
+### Steps to log in to the admin panel locally:
+
+1. Go to `http://localhost:4455/admin-panel` URL to open the admin panel login.
+2. Enter the email. For now, we have two allowed emails: `[email protected]`.
+3. Open MailHog to get the email magic link: `http://localhost:8025/`.
+4. Click on the magic link to log in to the admin panel.

apps/auth/app/api/health/route.ts

@@ -0,0 +1,7 @@
+import { NextResponse } from "next/server"
+
+export async function GET() {
+  return NextResponse.json({
+    status: "ok",
+  })
+}

apps/auth/browserstack.json

@@ -0,0 +1,41 @@
+{
+    "auth": {
+        "username": "SET ENV: BROWSERSTACK_USERNAME",
+        "access_key": "SET ENV: BROWSERSTACK_ACCESS_KEY"
+    },
+    "browsers": [
+        {
+            "browser": "chrome",
+            "os": "Windows 11",
+            "versions": [
+                "latest"
+            ]
+        }
+    ],
+    "run_settings": {
+        "cypress_config_file": "cypress.config.ts",
+        "project_name": "Lana Bank Admin Panel",
+        "build_name": "Lana Bank Admin Panel",
+        "parallels": 1,
+        "npm_dependencies": {
+            "typescript": "^4",
+            "browserstack-cypress-cli": "latest",
+            "cypress": "latest"
+        },
+        "exclude": [
+            "node_modules/**/*",
+            ".git/**/*",
+            ".next/**/*"
+        ],
+        "headed": true,
+        "resolution": "2560x1440",
+        "downloads": [
+            "./results",
+            "./cypress/screenshots"
+        ]
+    },
+    "connection_settings": {
+        "local": false
+    },
+    "disable_usage_reporting": false
+}