diff --git a/src/frontend/Dockerfile b/src/frontend/Dockerfile index 2772dafdf0..fa13192161 100644 --- a/src/frontend/Dockerfile +++ b/src/frontend/Dockerfile @@ -11,12 +11,14 @@ COPY ./src/frontend/package.json ./package.json COPY ./src/frontend/yarn.lock ./yarn.lock COPY ./src/frontend/apps/impress/package.json ./apps/impress/package.json COPY ./src/frontend/packages/eslint-config-impress/package.json ./packages/eslint-config-impress/package.json +COPY ./src/frontend/packages/common/package.json ./packages/common/package.json RUN yarn install --frozen-lockfile COPY .dockerignore ./.dockerignore COPY ./src/frontend/.prettierrc.js ./.prettierrc.js COPY ./src/frontend/packages/eslint-config-impress ./packages/eslint-config-impress +COPY ./src/frontend/packages/common ./packages/common COPY ./src/frontend/apps/impress ./apps/impress ### ---- Front-end builder image ---- diff --git a/src/frontend/apps/impress/next.config.js b/src/frontend/apps/impress/next.config.js index 862b4fafcb..a57dae2744 100644 --- a/src/frontend/apps/impress/next.config.js +++ b/src/frontend/apps/impress/next.config.js @@ -8,6 +8,7 @@ const buildId = crypto.randomBytes(256).toString('hex').slice(0, 8); const nextConfig = { output: 'export', trailingSlash: true, + transpilePackages: ['package-docs'], images: { unoptimized: true, }, diff --git a/src/frontend/apps/impress/package.json b/src/frontend/apps/impress/package.json index b30b808515..88a28db4aa 100644 --- a/src/frontend/apps/impress/package.json +++ b/src/frontend/apps/impress/package.json @@ -47,6 +47,7 @@ "lodash": "4.17.21", "luxon": "3.7.1", "next": "15.4.6", + "package-docs": "*", "posthog-js": "1.258.6", "react": "*", "react-aria-components": "1.11.0", diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx index 6b7b77a483..12d9d1f1a4 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx @@ -11,6 +11,7 @@ import { BlockNoteView } from '@blocknote/mantine'; import '@blocknote/mantine/style.css'; import { useCreateBlockNote } from '@blocknote/react'; import { HocuspocusProvider } from '@hocuspocus/provider'; +import { createDividerBlock } from 'package-docs'; import { useEffect } from 'react'; import { useTranslation } from 'react-i18next'; import * as Y from 'yjs'; @@ -33,7 +34,7 @@ import { randomColor } from '../utils'; import { BlockNoteSuggestionMenu } from './BlockNoteSuggestionMenu'; import { BlockNoteToolbar } from './BlockNoteToolBar/BlockNoteToolbar'; -import { CalloutBlock, DividerBlock } from './custom-blocks'; +import { CalloutBlock } from './custom-blocks'; import { InterlinkingLinkInlineContent, InterlinkingSearchInlineContent, @@ -49,7 +50,9 @@ const baseBlockNoteSchema = withPageBreak( blockSpecs: { ...defaultBlockSpecs, callout: CalloutBlock, - divider: DividerBlock, + divider: createDividerBlock({ + color: 'var(--c--theme--colors--greyscale-300)', + }), }, inlineContentSpecs: { ...defaultInlineContentSpecs, diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteSuggestionMenu.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteSuggestionMenu.tsx index 4e8c6e3091..3a2151b46d 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteSuggestionMenu.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteSuggestionMenu.tsx @@ -6,19 +6,19 @@ import { useBlockNoteEditor, useDictionary, } from '@blocknote/react'; +import { getDividerReactSlashMenuItems } from 'package-docs'; import React, { useMemo } from 'react'; import { useTranslation } from 'react-i18next'; +import { Icon } from '@/components'; + import { DocsBlockSchema, DocsInlineContentSchema, DocsStyleSchema, } from '../types'; -import { - getCalloutReactSlashMenuItems, - getDividerReactSlashMenuItems, -} from './custom-blocks'; +import { getCalloutReactSlashMenuItems } from './custom-blocks'; import { useGetInterlinkingMenuItems } from './custom-inline-content'; import XLMultiColumn from './xl-multi-column'; @@ -55,7 +55,12 @@ export const BlockNoteSuggestionMenu = () => { getCalloutReactSlashMenuItems(editor, t, basicBlocksName), getMultiColumnSlashMenuItems?.(editor) || [], getPageBreakReactSlashMenuItems(editor), - getDividerReactSlashMenuItems(editor, t, basicBlocksName), + getDividerReactSlashMenuItems( + editor, + t, + basicBlocksName, + , + ), ), query, ), diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/DividerBlock.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/DividerBlock.tsx deleted file mode 100644 index 9d402a8234..0000000000 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/DividerBlock.tsx +++ /dev/null @@ -1,51 +0,0 @@ -import { insertOrUpdateBlock } from '@blocknote/core'; -import { createReactBlockSpec } from '@blocknote/react'; -import { TFunction } from 'i18next'; - -import { Box, Icon } from '@/components'; -import { useCunninghamTheme } from '@/cunningham'; - -import { DocsBlockNoteEditor } from '../../types'; - -export const DividerBlock = createReactBlockSpec( - { - type: 'divider', - propSchema: {}, - content: 'none', - }, - { - render: () => { - // eslint-disable-next-line react-hooks/rules-of-hooks - const { colorsTokens } = useCunninghamTheme(); - - return ( - - ); - }, - }, -); - -export const getDividerReactSlashMenuItems = ( - editor: DocsBlockNoteEditor, - t: TFunction<'translation', undefined>, - group: string, -) => [ - { - title: t('Divider'), - onItemClick: () => { - insertOrUpdateBlock(editor, { - type: 'divider', - }); - }, - aliases: ['divider', 'hr', 'horizontal rule', 'line', 'separator'], - group, - icon: , - subtext: t('Add a horizontal line'), - }, -]; diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/index.ts b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/index.ts index 34a8c459cb..b11869bcea 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/index.ts +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/index.ts @@ -1,2 +1 @@ export * from './CalloutBlock'; -export * from './DividerBlock'; diff --git a/src/frontend/package.json b/src/frontend/package.json index 6c5ce1fae2..eade8f6617 100644 --- a/src/frontend/package.json +++ b/src/frontend/package.json @@ -13,6 +13,7 @@ "APP_IMPRESS": "yarn workspace app-impress", "APP_E2E": "yarn workspace app-e2e", "I18N": "yarn workspace packages-i18n", + "COMMON": "yarn workspace package-docs", "COLLABORATION_SERVER": "yarn workspace server-y-provider", "app:dev": "yarn APP_IMPRESS run dev", "app:start": "yarn APP_IMPRESS run start", @@ -20,7 +21,7 @@ "app:test": "yarn APP_IMPRESS run test", "ci:build": "yarn APP_IMPRESS run build:ci", "e2e:test": "yarn APP_E2E run test", - "lint": "yarn APP_IMPRESS run lint && yarn APP_E2E run lint && yarn workspace eslint-config-impress run lint && yarn I18N run lint && yarn COLLABORATION_SERVER run lint", + "lint": "yarn APP_IMPRESS run lint && yarn APP_E2E run lint && yarn workspace eslint-config-impress run lint && yarn I18N run lint && yarn COMMON run lint && yarn COLLABORATION_SERVER run lint", "i18n:extract": "yarn I18N run extract-translation", "i18n:deploy": "yarn I18N run format-deploy && yarn APP_IMPRESS prettier", "i18n:test": "yarn I18N run test", diff --git a/src/frontend/packages/common/.eslintrc.js b/src/frontend/packages/common/.eslintrc.js new file mode 100644 index 0000000000..b73567212c --- /dev/null +++ b/src/frontend/packages/common/.eslintrc.js @@ -0,0 +1,14 @@ +module.exports = { + root: true, + extends: ['impress/next'], + parserOptions: { + sourceType: 'module', + ecmaVersion: 'latest', + tsconfigRootDir: __dirname, + project: ['./tsconfig.json'], + }, + rules: { + '@next/next/no-html-link-for-pages': 'off', + }, + ignorePatterns: ['node_modules'], +}; diff --git a/src/frontend/packages/common/package.json b/src/frontend/packages/common/package.json new file mode 100644 index 0000000000..3669c57242 --- /dev/null +++ b/src/frontend/packages/common/package.json @@ -0,0 +1,20 @@ +{ + "name": "package-docs", + "version": "3.5.0", + "license": "MIT", + "main": "src/index.ts", + "types": "src/index.ts", + "scripts": { + "lint": "eslint --ext .ts,.tsx src/" + }, + "peerDependencies": { + "@blocknote/core": "0.35.0", + "@blocknote/react": "0.35.0", + "react": "19.1.0", + "react-dom": "19.1.0" + }, + "devDependencies": { + "eslint-config-impress": "*", + "typescript": "*" + } +} diff --git a/src/frontend/packages/common/src/custom-blocks/DividerBlock.tsx b/src/frontend/packages/common/src/custom-blocks/DividerBlock.tsx new file mode 100644 index 0000000000..d4331c95ee --- /dev/null +++ b/src/frontend/packages/common/src/custom-blocks/DividerBlock.tsx @@ -0,0 +1,52 @@ +import { BlockNoteEditor, insertOrUpdateBlock } from '@blocknote/core'; +import { createReactBlockSpec } from '@blocknote/react'; +import { TFunction } from 'i18next'; + +interface DividerBlockProps { + color?: string; +} + +export const createDividerBlock = ({ color }: DividerBlockProps) => { + return createReactBlockSpec( + { + type: 'divider', + propSchema: {}, + content: 'none', + }, + { + render: () => { + return ( +
+ ); + }, + }, + ); +}; + +export const getDividerReactSlashMenuItems = ( + // eslint-disable-next-line @typescript-eslint/no-explicit-any + editor: BlockNoteEditor, + t: TFunction<'translation', undefined>, + group: string, + icon: React.ReactNode, +) => [ + { + title: t('Divider'), + onItemClick: () => { + insertOrUpdateBlock(editor, { + type: 'divider', + }); + }, + aliases: ['divider', 'hr', 'horizontal rule', 'line', 'separator'], + group, + icon, + subtext: t('Add a horizontal line'), + }, +]; diff --git a/src/frontend/packages/common/src/custom-blocks/index.ts b/src/frontend/packages/common/src/custom-blocks/index.ts new file mode 100644 index 0000000000..70bc3faef6 --- /dev/null +++ b/src/frontend/packages/common/src/custom-blocks/index.ts @@ -0,0 +1 @@ +export * from './DividerBlock'; diff --git a/src/frontend/packages/common/src/index.ts b/src/frontend/packages/common/src/index.ts new file mode 100644 index 0000000000..973611def9 --- /dev/null +++ b/src/frontend/packages/common/src/index.ts @@ -0,0 +1 @@ +export * from './custom-blocks/'; diff --git a/src/frontend/packages/common/tsconfig.json b/src/frontend/packages/common/tsconfig.json new file mode 100644 index 0000000000..e25920c069 --- /dev/null +++ b/src/frontend/packages/common/tsconfig.json @@ -0,0 +1,28 @@ +{ + "compilerOptions": { + "target": "es5", + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "bundler", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve", + "incremental": true, + "baseUrl": ".", + "paths": { + "@/*": ["./src/*"] + } + }, + "include": [ + "src/**/*" + ], + "exclude": [ + "node_modules", + "dist" + ] +} diff --git a/src/frontend/yarn.lock b/src/frontend/yarn.lock index 82d9ed4b33..6461855827 100644 --- a/src/frontend/yarn.lock +++ b/src/frontend/yarn.lock @@ -15113,3 +15113,5 @@ zwitch@^2.0.0, zwitch@^2.0.4: version "2.0.4" resolved "https://registry.yarnpkg.com/zwitch/-/zwitch-2.0.4.tgz#c827d4b0acb76fc3e685a4c6ec2902d51070e9d7" integrity sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A== + +# Force cache refresh for packages/common-package workspace linking