Skip to content

Commit f53faef

Browse files
TechQueryTechQuery
authored
[add] Lark Git bot, Image component, Search page & API proxy (#1)
1 parent 1fb6155 commit f53faef

35 files changed

+1015
-59
lines changed

‎.env‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1-
NEXT_PUBLIC_SITE_NAME=lark-next-bootstrap-ts
2-
NEXT_PUBLIC_SITE_SUMMARY=React project scaffold based on TypeScript, Next.js, Bootstrap & Workbox.
1+
NEXT_PUBLIC_SITE_NAME=Lark-Next-Bootstrap-ts
2+
NEXT_PUBLIC_SITE_SUMMARY=Lark project scaffold based on TypeScript, React, Next.js, Bootstrap & Workbox.
33

44
NEXT_PUBLIC_SENTRY_DSN =
55
SENTRY_ORG =
66
SENTRY_PROJECT =
7+
8+
LARK_API_HOST = https://open.larksuite.com/open-apis/

‎.github/workflows/Lark-notification.yml‎

Lines changed: 378 additions & 0 deletions
Large diffs are not rendered by default.

‎.github/workflows/main.yml‎

Lines changed: 33 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ jobs:
1717
if: ${{ env.VERCEL_TOKEN && env.VERCEL_ORG_ID && env.VERCEL_PROJECT_ID }}
1818

1919
- name: Deploy to Vercel
20+
id: vercel-deployment
2021
uses: amondnet/vercel-action@v25
2122
if: ${{ env.VERCEL_TOKEN && env.VERCEL_ORG_ID && env.VERCEL_PROJECT_ID }}
2223
with:
@@ -25,4 +26,35 @@ jobs:
2526
vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
2627
vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}
2728
working-directory: ./
28-
vercel-args: ${{ github.ref == 'refs/heads/main' && '--prod' || '' }}
29+
vercel-args: ${{ github.ref == 'refs/heads/main' && ' --prod' || '' }}
30+
31+
- name: Lark notification
32+
uses: foxundermoon/feishu-action@v2
33+
with:
34+
url: ${{ secrets.LARK_CHATBOT_HOOK_URL }}
35+
msg_type: post
36+
content: |
37+
post:
38+
en_us:
39+
title: "Vercel Preview Environment"
40+
content:
41+
- - tag: text
42+
text: "Git Repository: "
43+
- tag: a
44+
text: ${{ github.server_url }}/${{ github.repository }}
45+
href: ${{ github.server_url }}/${{ github.repository }}
46+
- - tag: text
47+
text: "Code Branch: "
48+
- tag: a
49+
text: ${{ github.ref }}
50+
href: ${{ github.server_url }}/${{ github.repository }}/tree/${{ github.ref_name }}
51+
- - tag: text
52+
text: "Commit Author: "
53+
- tag: a
54+
text: ${{ github.actor }}
55+
href: ${{ github.server_url }}/${{ github.actor }}
56+
- - tag: text
57+
text: "Preview Link: "
58+
- tag: a
59+
text: ${{ steps.vercel-deployment.outputs.preview-url }}
60+
href: ${{ steps.vercel-deployment.outputs.preview-url }}

‎README.md‎

Lines changed: 33 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
# lark-next-bootstrap-ts
1+
# Lark-Next-Bootstrap-ts
22

3-
[React][1] project scaffold based on [TypeScript][2], [Next.js][3], [Bootstrap][4] & [Workbox][5]. And this project bootstrapped with [`create-next-app`][6].
3+
[Lark][0] project scaffold based on [TypeScript][2], [React][1], [Next.js][3], [Bootstrap][4] & [Workbox][5]. And this project bootstrapped with [`create-next-app`][6].
44

5-
[![CI & CD](https://github.com/idea2app/lark-lark-next-bootstrap-ts/actions/workflows/main.yml/badge.svg)][7]
5+
[![CI & CD](https://github.com/idea2app/lark-Lark-Next-Bootstrap-ts/actions/workflows/main.yml/badge.svg)][7]
66

77
[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)][8]
88
[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)][9]
@@ -27,6 +27,11 @@
2727
- Global: https://notfound.org/
2828
- Chinese: https://www.dnpw.org/cn/pa-notfound.html
2929

30+
## User cases
31+
32+
1. https://github.com/kaiyuanshe/kaiyuanshe.github.io
33+
2. https://github.com/idea2app/idea2app.github.io
34+
3035
## Best practice
3136

3237
1. Install GitHub apps in your organization or account:
@@ -38,13 +43,11 @@
3843

3944
3. Click the **[<kbd>Open in GitHub codespaces</kbd>][8] button** on the top of ReadMe file, then an **online VS Code development environment** will be started immediately
4045

41-
4. Set [Vercel variables][19] as [Repository secrets][20], then every commit will get an independent **Preview URL**
42-
43-
5. Recommend to add a [Notification step in GitHub actions][21] for your Team IM app
46+
4. Set [Vercel variables][19] & [Lark chat bot URL][20] as [Repository secrets][21], then every commit will send a Lark message with an independent **Preview URL**
4447

45-
6. Remind the PMs & users of your product to submit **Feature/Enhancement** requests or **Bug** reports with [Issue forms][22] instead of IM messages or Mobile Phone calls
48+
5. Remind the PMs & users of your product to submit **Feature/Enhancement** requests or **Bug** reports with [Issue forms][22] instead of IM messages or Mobile Phone calls
4649

47-
7. Collect all these issues into [Project kanbans][23], then create **Pull requests** & add `closes #issue_number` into its description for automation
50+
6. Collect all these issues into [Project kanbans][23], then create **Pull requests** & add `closes #issue_number` into its description for automation
4851

4952
## Getting Started
5053

@@ -76,18 +79,21 @@ You can check out [the Next.js GitHub repository][27] - your feedback and contri
7679

7780
### Environment variables
7881

79-
| name | file | description |
80-
| :----------------------: | :----------: | :---------------------: |
81-
| `SENTRY_AUTH_TOKEN` | `.env.local` | [Official document][28] |
82-
| `SENTRY_ORG` | `.env` | [Official document][29] |
83-
| `SENTRY_PROJECT` | `.env` | [Official document][29] |
84-
| `NEXT_PUBLIC_SENTRY_DSN` | `.env` | [Official document][30] |
82+
| name | file | description |
83+
| :----------------------: | :----------: | :-----------------------: |
84+
| `SENTRY_AUTH_TOKEN` | `.env.local` | [Official document][28] |
85+
| `SENTRY_ORG` | `.env` | [Official document][29] |
86+
| `SENTRY_PROJECT` | `.env` | [Official document][29] |
87+
| `NEXT_PUBLIC_SENTRY_DSN` | `.env` | [Official document][30] |
88+
| `LARK_APP_ID` | `.env.local` | [Official document][31] |
89+
| `LARK_APP_SECRET` | `.env.local` | [Official document][31] |
90+
| `NEXT_PUBLIC_CACHE_HOST` | `.env` | Static files CDN for Lark |
8591

8692
### Vercel
8793

8894
The easiest way to deploy your Next.js app is to use the [Vercel Platform][13] from the creators of Next.js.
8995

90-
Check out our [Next.js deployment documentation][31] for more details.
96+
Check out our [Next.js deployment documentation][32] for more details.
9197

9298
### Docker
9399

@@ -96,15 +102,16 @@ pnpm pack-image
96102
pnpm container
97103
```
98104

105+
[0]: https://www.larksuite.com/
99106
[1]: https://react.dev/
100107
[2]: https://www.typescriptlang.org/
101108
[3]: https://nextjs.org/
102109
[4]: https://getbootstrap.com/
103110
[5]: https://developers.google.com/web/tools/workbox
104111
[6]: https://github.com/vercel/next.js/tree/canary/packages/create-next-app
105-
[7]: https://github.com/idea2app/lark-lark-next-bootstrap-ts/actions/workflows/main.yml
106-
[8]: https://codespaces.new/idea2app/lark-lark-next-bootstrap-ts
107-
[9]: https://gitpod.io/?autostart=true#https://github.com/idea2app/lark-lark-next-bootstrap-ts
112+
[7]: https://github.com/idea2app/lark-Lark-Next-Bootstrap-ts/actions/workflows/main.yml
113+
[8]: https://codespaces.new/idea2app/lark-Lark-Next-Bootstrap-ts
114+
[9]: https://gitpod.io/?autostart=true#https://github.com/idea2app/lark-Lark-Next-Bootstrap-ts
108115
[10]: https://mdxjs.com/
109116
[11]: https://mobx.js.org/
110117
[12]: https://github.com/features/actions
@@ -113,17 +120,18 @@ pnpm container
113120
[15]: https://github.com/apps/settings
114121
[16]: https://pullrequestbadge.com/
115122
[17]: https://code.visualstudio.com/
116-
[18]: https://github.com/new?template_name=lark-next-bootstrap-ts&template_owner=idea2app
117-
[19]: https://github.com/idea2app/lark-lark-next-bootstrap-ts/blob/80967ed49045af9dbcf4d3695a2c39d53a6f71f1/.github/workflows/pull-request.yml#L9-L11
118-
[20]: https://github.com/idea2app/lark-lark-next-bootstrap-ts/settings/secrets/actions
119-
[21]: https://github.com/kaiyuanshe/kaiyuanshe.github.io/blob/bb4675a56bf1d6b207231313da5ed0af7cf0ebd6/.github/workflows/pull-request.yml#L32-L56
120-
[22]: https://github.com/idea2app/lark-lark-next-bootstrap-ts/issues/new/choose
121-
[23]: https://github.com/idea2app/lark-lark-next-bootstrap-ts/projects
123+
[18]: https://github.com/new?template_name=Lark-Next-Bootstrap-ts&template_owner=idea2app
124+
[19]: https://github.com/idea2app/lark-Lark-Next-Bootstrap-ts/blob/80967ed49045af9dbcf4d3695a2c39d53a6f71f1/.github/workflows/pull-request.yml#L9-L11
125+
[20]: https://github.com/kaiyuanshe/kaiyuanshe.github.io/blob/bb4675a56bf1d6b207231313da5ed0af7cf0ebd6/.github/workflows/pull-request.yml#L32-L56
126+
[21]: https://github.com/idea2app/lark-Lark-Next-Bootstrap-ts/settings/secrets/actions
127+
[22]: https://github.com/idea2app/lark-Lark-Next-Bootstrap-ts/issues/new/choose
128+
[23]: https://github.com/idea2app/lark-Lark-Next-Bootstrap-ts/projects
122129
[24]: https://nextjs.org/docs/api-routes/introduction
123130
[25]: https://nextjs.org/docs
124131
[26]: https://nextjs.org/learn
125132
[27]: https://github.com/vercel/next.js/
126133
[28]: https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#use-configuration-files-for-source-map-upload
127134
[29]: https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#use-environment-variables
128135
[30]: https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#create-initialization-config-files
129-
[31]: https://nextjs.org/docs/deployment
136+
[31]: https://open.larksuite.com/document/server-docs/getting-started/api-access-token/app-access-token-development-guide#1f8b587c
137+
[32]: https://nextjs.org/docs/deployment

components/BlockEditor.tsx renamed to components/Form/BlockEditor.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import List from '@editorjs/list';
66
import Quote from '@editorjs/quote';
77
import { Editor as Core, EditorProps } from 'idea-react';
88

9-
import { upload } from '../models/Base';
9+
import { upload } from '../../models/Base';
1010

1111
async function uploadByFile(file: File) {
1212
try {

components/HTMLEditor.tsx renamed to components/Form/HTMLEditor.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import {
1010
} from 'react-bootstrap-editor';
1111
import { Constructor } from 'web-utility';
1212

13-
import { upload } from '../models/Base';
13+
import { upload } from '../../models/Base';
1414

1515
const ExcludeTools = [IFrameTool, AudioTool, VideoTool];
1616

‎components/LarkImage.tsx‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import { TableCellValue } from 'mobx-lark';
2+
import { FC } from 'react';
3+
import { Image, ImageProps } from 'react-bootstrap';
4+
5+
import { DefaultImage, fileURLOf } from '../pages/api/Lark/file/[id]';
6+
7+
export interface LarkImageProps extends Omit<ImageProps, 'src'> {
8+
src?: TableCellValue;
9+
}
10+
11+
export const LarkImage: FC<LarkImageProps> = ({
12+
src = DefaultImage,
13+
alt,
14+
...props
15+
}) => (
16+
<Image
17+
fluid
18+
loading="lazy"
19+
{...props}
20+
src={fileURLOf(src, true)}
21+
alt={alt}
22+
onError={({ currentTarget: image }) => {
23+
const path = fileURLOf(src),
24+
errorURL = decodeURI(image.src);
25+
26+
if (!path) return;
27+
28+
if (errorURL.endsWith(path)) {
29+
if (!alt) image.src = DefaultImage;
30+
} else if (!errorURL.endsWith(DefaultImage)) {
31+
image.src = path;
32+
}
33+
}}
34+
/>
35+
);

‎components/Layout/CardPage.tsx‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
import { ComponentClass, FC } from 'react';
2+
import { Col, Pagination, Row } from 'react-bootstrap';
3+
4+
import { SearchPageMeta } from '../../models/System';
5+
6+
export interface CardPageProps extends SearchPageMeta {
7+
Card: ComponentClass<any> | FC<any>;
8+
cardLinkOf?: (id: string) => string;
9+
pageLinkOf: (page: number) => string;
10+
}
11+
12+
export const CardPage: FC<CardPageProps> = ({
13+
Card,
14+
cardLinkOf,
15+
currentPage,
16+
pageIndex,
17+
pageCount,
18+
pageLinkOf,
19+
}) => (
20+
<>
21+
<Row className="g-3 my-3" xs={1} md={2} lg={3}>
22+
{currentPage.map(item => (
23+
<Col key={item.id as string}>
24+
<Card className="h-100" linkOf={cardLinkOf} {...item} />
25+
</Col>
26+
))}
27+
</Row>
28+
29+
<Pagination className="justify-content-center" size="lg">
30+
<Pagination.Prev
31+
href={pageLinkOf(pageIndex - 1)}
32+
disabled={pageIndex === 1}
33+
/>
34+
<Pagination.Next
35+
href={pageLinkOf(pageIndex + 1)}
36+
disabled={pageIndex === pageCount}
37+
/>
38+
</Pagination>
39+
</>
40+
);

components/MDXLayout.tsx renamed to components/Layout/MDXLayout.tsx

File renamed without changes.

components/NotFoundCard.tsx renamed to components/Layout/NotFoundCard.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { ErrorProps } from 'next/error';
22
import { FC } from 'react';
33

4-
import { i18n } from '../models/Translation';
4+
import { i18n } from '../../models/Translation';
55

66
export const NotFoundCard: FC<ErrorProps> = ({ title }) =>
77
i18n.currentLanguage.startsWith('zh') ? (

0 commit comments

Comments
 (0)