feat: runtime env (#320)

* feat: runtime env

Signed-off-by: Innei <i@innei.in>

* feat: build script

Signed-off-by: Innei <i@innei.in>

* update

Signed-off-by: Innei <i@innei.in>

* fix: update

Signed-off-by: Innei <i@innei.in>

---------

Signed-off-by: Innei <i@innei.in>

.env.template

@@ -19,3 +19,5 @@ TMDB_API_KEY=
 
 S3_ACCESS_KEY=
 S3_SECRET_KEY=
+
+GH_TOKEN=

.github/workflows/build.yml

@@ -0,0 +1,42 @@
+on:
+ push:
+ branches: [main]
+
+name: CI Build
+
+jobs:
+ build:
+ name: Upload CI Build artifact
+ runs-on: ubuntu-latest
+
+ strategy:
+ matrix:
+ node-version: [18.x]
+ steps:
+ - name: Checkout code
+ uses: actions/checkout@v4
+ with:
+ fetch-depth: 0
+ lfs: true
+ - name: Checkout LFS objects
+ run: git lfs checkout
+
+ - uses: pnpm/action-setup@v2.4.0
+ with:
+ version: 8.x.x
+ - name: Use Node.js ${{ matrix.node-version }}
+ uses: actions/setup-node@v3
+ with:
+ node-version: ${{ matrix.node-version }}
+ cache: 'pnpm'
+ - name: Install dependencies
+ run: pnpm install
+ - name: Build project
+
+ run: |
+ sh ./ci-release-build.sh
+
+ - uses: actions/upload-artifact@v4
+ with:
+ name: artifact
+ path: assets/release.zip

.github/workflows/release-docker.yml

@@ -0,0 +1,47 @@
+name: Docker (release)
+
+on:
+ push:
+ # Sequence of patterns matched against refs/tags
+ tags:
+ - 'v*' # Push events to matching v*, i.e. v1.0, v20.15.10
+
+jobs:
+ docker:
+ runs-on: ubuntu-latest
+ steps:
+ - name: Checkout
+ uses: actions/checkout@v4
+ - name: Set up QEMU
+ uses: docker/setup-qemu-action@v3
+ - name: Set up Docker Buildx
+ uses: docker/setup-buildx-action@v3
+ - name: Login to Docker Hub
+ uses: docker/login-action@v3
+ with:
+ username: ${{ secrets.DOCKERHUB_USERNAME }}
+ password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+ - name: Docker meta
+ id: meta
+ uses: docker/metadata-action@v5
+ with:
+ images: |
+ innei/mx-server
+ tags: |
+ type=ref,event=branch
+ type=semver,pattern={{version}}
+ type=semver,pattern={{major}}.{{minor}}
+ type=semver,pattern={{major}}
+ type=sha
+ type=raw,value=latest
+ - name: Build and export to Docker
+ uses: docker/build-push-action@v5
+ with:
+ context: .
+ load: true
+ tags: ${{ steps.meta.outputs.tags }}
+ labels: ${{ steps.meta.outputs.labels }}
+ push: true
+ env:
+ GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release.yml

@@ -0,0 +1,63 @@
+on:
+ push:
+ # Sequence of patterns matched against refs/tags
+ tags:
+ - 'v*' # Push events to matching v*, i.e. v1.0, v20.15.10
+
+name: Release
+
+jobs:
+ build:
+ name: Upload Release Asset
+ runs-on: ubuntu-latest
+ strategy:
+ matrix:
+ node-version: [18.x]
+ steps:
+ - name: Checkout code
+ uses: actions/checkout@v4
+ with:
+ fetch-depth: 0
+ lfs: true
+ - name: Checkout LFS objects
+ run: git lfs checkout
+
+ - uses: pnpm/action-setup@v2.4.0
+ with:
+ version: 8.x.x
+ - name: Use Node.js ${{ matrix.node-version }}
+ uses: actions/setup-node@v3
+ with:
+ node-version: ${{ matrix.node-version }}
+ cache: 'pnpm'
+ - name: Install dependencies
+ run: pnpm install
+ - name: Build project
+
+ run: |
+ sh ./ci-release-build.sh
+
+ - name: Create Release
+ id: create_release
+ uses: actions/create-release@v1
+ env:
+ GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+ with:
+ tag_name: ${{ github.ref }}
+ release_name: Release ${{ github.ref }}
+ draft: false
+ prerelease: false
+ - run: npx changelogithub
+ continue-on-error: true
+ env:
+ GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
+ - name: Upload Release Asset
+ id: upload-release-asset
+ uses: actions/upload-release-asset@v1
+ env:
+ GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+ with:
+ asset_name: release.zip
+ upload_url: ${{ steps.create_release.outputs.upload_url }} # This pulls from the CREATE RELEASE step above, referencing it's ID to get its outputs object, which include a `upload_url`. See this blog post for more info: https://jasonet.co/posts/new-features-of-github-actions/#passing-data-to-future-steps
+ asset_path: ./assets/release.zip
+ asset_content_type: application/zip

Dockerfile

@@ -1,15 +1,17 @@
 FROM node:18-alpine AS base
 
+RUN npm install -g --arch=x64 --platform=linux sharp
+
 FROM base AS deps
 
 RUN apk add --no-cache libc6-compat
-
 RUN apk add --no-cache python3 make g++
 
 WORKDIR /app
 
 COPY . .
 
+
 RUN npm install -g pnpm
 RUN pnpm install
 
@@ -26,11 +28,21 @@ ENV NODE_ENV production
 ARG BASE_URL
 ARG NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
 ARG CLERK_SECRET_KEY
+ARG S3_ACCESS_KEY
+ARG S3_SECRET_KEY
+ARG WEBHOOK_SECRET
+ARG TMDB_API_KEY
+ARG GH_TOKEN
 ENV BASE_URL=${BASE_URL}
 ENV NEXT_PUBLIC_API_URL=${BASE_URL}/api/v2
 ENV NEXT_PUBLIC_GATEWAY_URL=${BASE_URL}
 ENV NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=${NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY}
 ENV CLERK_SECRET_KEY=${CLERK_SECRET_KEY}
+ENV S3_ACCESS_KEY=${S3_ACCESS_KEY}
+ENV S3_SECRET_KEY=${S3_SECRET_KEY}
+ENV TMDB_API_KEY=${TMDB_API_KEY}
+ENV WEBHOOK_SECRET=${WEBHOOK_SECRET}
+ENV GH_TOKEN=${GH_TOKEN}
 
 RUN pnpm build
 
@@ -48,5 +60,5 @@ COPY --from=builder /app/.next/server ./.next/server
 EXPOSE 2323
 
 ENV PORT 2323
-
-CMD echo "Mix Space Web [Shiro] Image." &&  node server.js;
+ENV NEXT_SHARP_PATH=/usr/local/lib/node_modules/sharp
+CMD echo "Mix Space Web [Shiro] Image." && node server.js;

ci-release-build.sh

@@ -0,0 +1,22 @@
+#!env bash
+set -e
+CWD=$(pwd)
+
+npm run build
+cd .next
+pwd
+rm -rf cache
+cp -r ../public ./standalone/public
+
+cd ./standalone
+echo ';process.title = "Shiro (NextJS)"' >>server.js
+mv ../static/ ./.next/static
+
+cp $CWD/ecosystem.standalone.config.js ./ecosystem.config.js
+cp $CWD/.env.template .env
+
+cd ..
+
+mkdir -p $CWD/assets
+rm -rf $CWD/assets/release.zip
+zip --symlinks -r $CWD/assets/release.zip ./*

docker-compose.yml

@@ -1,14 +1,12 @@
-version: "3"
+version: '3'
 
 services:
  shiro:
  container_name: shiro
  build:
  context: .
- args:
- - BASE_URL=REPLACE_WITH_YOUR_BASE_URL
- - NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=REPLACE_WITH_YOUR_PUBLISHABLE_KEY
- - CLERK_SECRET_KEY=REPLACE_WITH_YOUR_SECRET_KEY
+ volumes:
+ - /app/.env:./.docker-env
  restart: always
  ports:
- - 2323:2323
+ - 2323:2323

package.json

@@ -96,6 +96,7 @@
  "mermaid": "10.9.0",
  "nanoid": "^5.0.6",
  "next": "14.1.4",
+ "next-runtime-env": "3.2.1",
  "next-themes": "0.2.1",
  "ofetch": "1.3.4",
  "openai": "4.29.2",

src/app/(app)/(home)/layout.tsx

@@ -9,6 +9,7 @@ import { requestErrorHandler } from '~/lib/request.server'
 
 import { queryKey } from './query'
 
+export const dynamic = 'force-dynamic'
 export const revalidate = 3600
 
 export default async function HomeLayout(props: PropsWithChildren) {

src/app/(app)/(note-topic)/notes/(topic-detail)/topics/[slug]/layout.tsx

@@ -9,6 +9,7 @@ import { getQueryClient } from '~/lib/query-client.server'
 
 import { getTopicQuery } from './query'
 
+export const dynamic = 'force-dynamic'
 export const generateMetadata = async (
  props: NextPageParams<{
  slug: string

src/app/(app)/(note-topic)/notes/(topic-detail)/topics/[slug]/page.tsx

@@ -14,6 +14,7 @@ import { routeBuilder, Routes } from '~/lib/route-builder'
 
 import { getTopicQuery } from './query'
 
+export const dynamic = 'force-dynamic'
 export default function Page() {
  const { slug } = useParams()
  const { data } = useQuery({

src/app/(app)/(note-topic)/notes/topics/layout.tsx

@@ -9,6 +9,7 @@ import { getQueryClient } from '~/lib/query-client.server'
 
 import { topicsQuery } from './query'
 
+export const dynamic = 'force-dynamic'
 export const metadata: Metadata = {
  title: '专栏',
 }

src/app/(app)/(page-detail)/[slug]/layout.tsx

@@ -30,6 +30,7 @@ import {
  PageTitle,
 } from './pageExtra'
 
+export const dynamic = 'force-dynamic'
 const getData = async (params: PageParams) => {
  attachUAAndRealIp()
  const data = await getQueryClient()

src/app/(app)/categories/[slug]/layout.tsx

@@ -9,6 +9,7 @@ import { getQueryClient } from '~/lib/query-client.server'
 
 import { getPageBySlugQuery } from './query'
 
+export const dynamic = 'force-dynamic'
 const getData = async (params: { slug: string }) => {
  attachUAAndRealIp()
  const data = await getQueryClient().fetchQuery(

src/app/(app)/layout.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable no-console */
 import { cache } from 'react'
 import { ToastContainer } from 'react-toastify'
+import { env, PublicEnvScript } from 'next-runtime-env'
 import type { Metadata, Viewport } from 'next'
 import type { PropsWithChildren } from 'react'
 
@@ -128,7 +129,7 @@ export const generateMetadata = async (): Promise<Metadata> => {
  },
  } satisfies Metadata
 }
-
+export const dynamic = 'force-dynamic'
 export default async function RootLayout(props: PropsWithChildren) {
  const { children } = props
 
@@ -137,14 +138,15 @@ export default async function RootLayout(props: PropsWithChildren) {
  const themeConfig = data.theme
 
  return (
- <ClerkProvider>
+ <ClerkProvider publishableKey={env('NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY')}>
  <AppFeatureProvider tmdb={!!process.env.TMDB_API_KEY}>
  <html
  lang="zh-CN"
  className="noise !bg-accent"
  suppressHydrationWarning
  >
  <head>
+ <PublicEnvScript />
  <Global />
  <SayHi />
  <HydrationEndDetector />

src/app/(app)/notes/[id]/layout.tsx

@@ -21,6 +21,7 @@ import { Paper } from '../../../../components/layout/container/Paper'
 import { getData } from './api'
 import { Transition } from './Transition'
 
+export const dynamic = 'force-dynamic'
 export const generateMetadata = async ({
  params,
 }: {

src/app/(app)/notes/[id]/page.tsx

@@ -34,6 +34,7 @@ import {
  NoteTitle,
 } from './pageExtra'
 
+export const dynamic = 'force-dynamic'
 export default async function Page(props: {
  params: {
  id: string

src/app/(app)/posts/(post-detail)/[category]/[slug]/layout.tsx

@@ -15,6 +15,7 @@ import { LayoutRightSideProvider } from '~/providers/shared/LayoutRightSideProvi
 
 import { getData } from './api'
 
+export const dynamic = 'force-dynamic'
 export const generateMetadata = async ({
  params,
 }: {