add env variable to the build stage

Author: maslianok

.github/workflows/deploy.yml

@@ -47,6 +47,7 @@ jobs:
           build-args: |
             NEXT_PUBLIC_POSTHOG_KEY=${{ vars.NEXT_PUBLIC_POSTHOG_KEY }}
             NEXT_PUBLIC_URI=${{ vars.NEXT_PUBLIC_URI }}
+            GRAPHQL_SECRET_KEY=${{ secrets.GRAPHQL_SECRET_KEY }}
 
       # 4. SSH to droplet and deploy
       - name: SSH to droplet and deploy

Dockerfile

@@ -21,6 +21,9 @@ RUN corepack enable && corepack prepare pnpm@10 --activate
 RUN pnpm i --frozen-lockfile
 
 FROM base AS builder
+ARG GRAPHQL_SECRET_KEY
+ENV GRAPHQL_SECRET_KEY=$GRAPHQL_SECRET_KEY
+
 WORKDIR /app
 COPY --from=deps /app/node_modules ./node_modules
 COPY . .

components/tabs/tabs.tsx

@@ -0,0 +1,32 @@
+import Link from 'next/link';
+import { FC } from 'react';
+
+type TabsBarProps = {
+  children: React.ReactNode;
+};
+
+type TabProps = {
+  href: string;
+  children: React.ReactNode;
+};
+
+export const TabsBar: FC<TabsBarProps> = ({ children }) => {
+  return (
+    <div className="text-sm font-medium text-center text-gray-500 border-b border-gray-200 dark:text-gray-400 dark:border-gray-700">
+      <ul className="flex flex-wrap -mb-px">{children}</ul>
+    </div>
+  );
+};
+
+export const Tab: FC<TabProps> = ({ href, children }) => {
+  return (
+    <li className="me-2">
+      <Link
+        href={href}
+        className="inline-block p-4 border-b-2 border-transparent rounded-t-lg hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300"
+      >
+        {children}
+      </Link>
+    </li>
+  );
+};