[add] Sentry monitor configuration

[optimize] Resource Limitation of Docker Compose
[optimize] update Upstream packages

.env

@@ -1,6 +1,10 @@
 NEXT_PUBLIC_SITE_NAME = idea2app
 NEXT_PUBLIC_SITE_SUMMARY = 全行业信息化转型专家
 
+NEXT_PUBLIC_SENTRY_DSN = https://03e5d951172f411a04c1bab44022e22b@o4506471366852608.ingest.sentry.io/4506484563705856
+SENTRY_ORG = idea2app
+SENTRY_PROJECT = ows
+
 NEXT_PUBLIC_LARK_BASE = bascnFeH8Q37XWX0LLlBB9ojQzf
 NEXT_PUBLIC_CLIENT_TABLE = tblsb0vx4fqjSrGL
 NEXT_PUBLIC_PROJECT_TABLE = tblCxasoUUub3buB

Dockerfile

@@ -2,7 +2,7 @@
 
 FROM node:18-slim AS base
 RUN apt-get update && \
-    apt-get install curl -y --no-install-recommends
+    apt-get install ca-certificates curl -y --no-install-recommends
 ENV PNPM_HOME="/pnpm"
 ENV PATH="$PNPM_HOME:$PATH"
 RUN corepack enable

README.md

@@ -7,7 +7,7 @@
 ## Technology stack
 
 - Language: [TypeScript v5][2]
-- Component engine: [Nextjs v14][3]
+- Component engine: [Next.js v14][3]
 - Component suite: [Bootstrap v5][4]
 - PWA framework: [Workbox v6][5]
 - State management: [MobX v6][9]

docker-compose.yml

@@ -16,6 +16,11 @@ services:
     labels:
       - 'autoheal=true'
     restart: always
+    deploy:
+      resources:
+        limits:
+          cpus: '0.80'
+          memory: 1250M
     logging:
       driver: 'json-file'
       options:

next.config.mjs

@@ -1,19 +1,22 @@
-import webpack from 'webpack';
-import withLess from 'next-with-less';
+import { withSentryConfig } from '@sentry/nextjs';
 import setPWA from 'next-pwa';
+import withLess from 'next-with-less';
+import webpack from 'webpack';
+
+const { NODE_ENV, SENTRY_AUTH_TOKEN, SENTRY_ORG, SENTRY_PROJECT } = process.env;
+const isDev = NODE_ENV === 'development';
 
-const { NODE_ENV } = process.env,
-  withPWA = setPWA({
-    dest: 'public',
-    register: true,
-    skipWaiting: true,
-    disable: NODE_ENV === 'development',
-  });
+const withPWA = setPWA({
+  dest: 'public',
+  register: true,
+  skipWaiting: true,
+  disable: isDev,
+});
 
 /**
  * @type {import('next').NextConfig}
  */
-export default withPWA(
+const nextConfig = withPWA(
   withLess({
     webpack: config => {
       config.plugins.push(
@@ -25,3 +28,21 @@ export default withPWA(
     },
   }),
 );
+
+export default isDev || !SENTRY_AUTH_TOKEN
+  ? nextConfig
+  : withSentryConfig(
+      {
+        ...nextConfig,
+        sentry: {
+          transpileClientSDK: true,
+          autoInstrumentServerFunctions: false,
+        },
+      },
+      {
+        org: SENTRY_ORG,
+        project: SENTRY_PROJECT,
+        authToken: SENTRY_AUTH_TOKEN,
+        silent: true,
+      },
+    );

package.json

@@ -4,25 +4,26 @@
   "description": "React project scaffold based on TypeScript, Next.js, Bootstrap & Workbox.",
   "private": true,
   "dependencies": {
-    "classnames": "^2.3.2",
+    "@sentry/nextjs": "^7.91.0",
+    "classnames": "^2.5.1",
     "file-type": "^18.7.0",
-    "idea-react": "^1.0.0-rc.30",
+    "idea-react": "^1.0.0-rc.31",
     "koajax": "^0.9.6",
     "less": "^4.2.0",
-    "less-loader": "^11.1.3",
+    "less-loader": "^11.1.4",
     "lodash": "^4.17.21",
     "mobx": "~6.10.2",
     "mobx-i18n": "^0.4.2",
-    "mobx-lark": "^1.0.0-rc.11",
+    "mobx-lark": "^1.1.1",
     "mobx-react": "~9.0.2",
     "mobx-restful": "^0.6.12",
     "mobx-restful-table": "^1.2.2",
     "next": "^14.0.4",
     "next-pwa": "~5.6.0",
-    "next-ssr-middleware": "^0.6.1",
+    "next-ssr-middleware": "^0.6.2",
     "next-with-less": "^3.0.1",
     "react": "^18.2.0",
-    "react-bootstrap": "^2.9.1",
+    "react-bootstrap": "^2.9.2",
     "react-dom": "^18.2.0",
     "react-marked-renderer": "^2.0.1",
     "web-utility": "^4.1.3",
@@ -31,9 +32,9 @@
   "devDependencies": {
     "@octokit/openapi-types": "^19.1.0",
     "@types/lodash": "^4.14.202",
-    "@types/node": "^18.19.3",
-    "@types/react": "^18.2.45",
-    "eslint": "^8.55.0",
+    "@types/node": "^18.19.4",
+    "@types/react": "^18.2.46",
+    "eslint": "^8.56.0",
     "eslint-config-next": "^14.0.4",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-simple-import-sort": "^10.0.0",

pages/_error.tsx

@@ -0,0 +1,19 @@
+import * as Sentry from '@sentry/nextjs';
+import type { NextPage } from 'next';
+import type { ErrorProps } from 'next/error';
+import Error from 'next/error';
+
+const CustomErrorComponent: NextPage<ErrorProps> = ({ statusCode }) => (
+  <Error statusCode={statusCode} />
+);
+
+CustomErrorComponent.getInitialProps = async contextData => {
+  await Sentry.captureUnderscoreErrorException(contextData);
+
+  return Error.getInitialProps(contextData);
+};
+
+export default process.env.NODE_ENV === 'development' ||
+!process.env.SENTRY_AUTH_TOKEN
+  ? Error
+  : CustomErrorComponent;

pages/api/Lark/bitable/v1/[...slug].ts

@@ -1,11 +1,12 @@
-import { TableRecordList } from 'mobx-lark';
+import { LarkPageData, TableRecord } from 'mobx-lark';
 import { DataObject } from 'mobx-restful';
 
 import { proxyLark } from '../../core';
 
 export default proxyLark((path, data) => {
   if (path.split('?')[0].endsWith('/records')) {
-    const { items = [] } = (data as TableRecordList<DataObject>).data;
+    const items =
+      (data as LarkPageData<TableRecord<DataObject>>).data!.items || [];
 
     for (const { fields } of items)
       for (const key of Object.keys(fields))