mirror of
https://github.com/simstudioai/sim.git
synced 2026-09-24 15:45:35 +08:00
fix(prism): load prismjs core before language components (#5262)
prismjs language components (prismjs/components/prism-*) register on the global Prism that core installs; importing a component before core throws 'Prism is not defined' (in SSR and the client). The @sim/emcn extraction changed bundling so core no longer loaded eagerly first, exposing the latent bad order on the home (chat-content) and workflow-editor pages. - chat-content.tsx: import prismjs core first (it needs ts/bash/css/markup, which emcn does not register). - code-editor.tsx, input-format.tsx, code.tsx: drop the redundant prism-json/prism-python imports — these highlight via emcn's languages, which already registers js/json/python in the correct order.
This commit is contained in:
+3
@@ -3,6 +3,9 @@
|
||||
import { type ComponentPropsWithoutRef, memo, useEffect, useMemo, useRef } from 'react'
|
||||
import { Streamdown } from 'streamdown'
|
||||
import 'streamdown/styles.css'
|
||||
// prismjs core must load before its language components — they register on the
|
||||
// global `Prism` it installs (on `window`/`global`); fixes SSR + client order.
|
||||
import 'prismjs'
|
||||
import 'prismjs/components/prism-typescript'
|
||||
import 'prismjs/components/prism-bash'
|
||||
import 'prismjs/components/prism-css'
|
||||
|
||||
+2
-3
@@ -1,8 +1,5 @@
|
||||
import type { ReactElement } from 'react'
|
||||
import { memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'
|
||||
import { Check, Wand2 } from 'lucide-react'
|
||||
import { useParams } from 'next/navigation'
|
||||
import 'prismjs/components/prism-python'
|
||||
import {
|
||||
CODE_LINE_HEIGHT_PX,
|
||||
Code as CodeEditor,
|
||||
@@ -14,6 +11,8 @@ import {
|
||||
languages,
|
||||
} from '@sim/emcn'
|
||||
import { createLogger } from '@sim/logger'
|
||||
import { Check, Wand2 } from 'lucide-react'
|
||||
import { useParams } from 'next/navigation'
|
||||
import Editor from 'react-simple-code-editor'
|
||||
import { Button } from '@/components/ui/button'
|
||||
import { CodeLanguage } from '@/lib/execution/languages'
|
||||
|
||||
+2
-3
@@ -1,7 +1,4 @@
|
||||
import { useCallback, useRef } from 'react'
|
||||
import { Trash } from '@sim/emcn/icons'
|
||||
import { Plus } from 'lucide-react'
|
||||
import 'prismjs/components/prism-json'
|
||||
import {
|
||||
Badge,
|
||||
Button,
|
||||
@@ -19,6 +16,8 @@ import {
|
||||
Label,
|
||||
languages,
|
||||
} from '@sim/emcn'
|
||||
import { Trash } from '@sim/emcn/icons'
|
||||
import { Plus } from 'lucide-react'
|
||||
import Editor from 'react-simple-code-editor'
|
||||
import { createDefaultInputFormatField } from '@/lib/workflows/input-format'
|
||||
import { formatDisplayText } from '@/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/formatted-text'
|
||||
|
||||
-1
@@ -1,6 +1,5 @@
|
||||
import type { ReactElement } from 'react'
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
import 'prismjs/components/prism-json'
|
||||
import {
|
||||
CODE_LINE_HEIGHT_PX,
|
||||
Code,
|
||||
|
||||
Reference in New Issue
Block a user