gio
/
think
mirror of https://github.com/fantasticit/think.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix: sync title in template editor

This commit is contained in:
fantasticit 2022-04-03 11:13:21 +08:00
parent 11ce42dbe3
commit d515543444
1 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/client/src/components/template/editor/editor.tsx
View File

@ -24,7 +24,6 @@ import { User } from 'components/user';
import { DocumentStyle } from 'components/document/style'; import { DocumentStyle } from 'components/document/style';
import { useDocumentStyle } from 'hooks/use-document-style'; import { useDocumentStyle } from 'hooks/use-document-style';
import { useWindowSize } from 'hooks/use-window-size'; import { useWindowSize } from 'hooks/use-window-size';
import { safeJSONParse } from 'helpers/json';
import styles from './index.module.scss'; import styles from './index.module.scss';
const { Text } = Typography; const { Text } = Typography;
@ -41,6 +40,7 @@ interface IProps {
export const Editor: React.FC<IProps> = ({ user, data, loading, error, updateTemplate, deleteTemplate }) => { export const Editor: React.FC<IProps> = ({ user, data, loading, error, updateTemplate, deleteTemplate }) => {
if (!user) return null; if (!user) return null;
const { width: windowWidth } = useWindowSize(); const { width: windowWidth } = useWindowSize();
const [title, setTitle] = useState(data.title);
const provider = useMemo(() => { const provider = useMemo(() => {
return getProvider({ return getProvider({
targetId: data.id, targetId: data.id,
@ -53,9 +53,13 @@ export const Editor: React.FC<IProps> = ({ user, data, loading, error, updateTem
const editor = useEditor({ const editor = useEditor({
editable: true, editable: true,
extensions: [...BaseKit, DocumentWithTitle, getCollaborationExtension(provider)], extensions: [...BaseKit, DocumentWithTitle, getCollaborationExtension(provider)],
content: safeJSONParse(data && data.content), onTransaction: ({ transaction }) => {
try {
const title = transaction.doc.content.firstChild.content.firstChild.textContent;
setTitle(title);
} catch (e) {}
},
}); });
const [isPublic, setPublic] = useState(false); const [isPublic, setPublic] = useState(false);
const { width, fontSize } = useDocumentStyle(); const { width, fontSize } = useDocumentStyle();
const editorWrapClassNames = useMemo(() => { const editorWrapClassNames = useMemo(() => {
@ -100,7 +104,7 @@ export const Editor: React.FC<IProps> = ({ user, data, loading, error, updateTem
<Button onClick={goback} icon={<IconChevronLeft />} style={{ marginRight: 16 }} /> <Button onClick={goback} icon={<IconChevronLeft />} style={{ marginRight: 16 }} />
</Tooltip> </Tooltip>
<Text strong ellipsis={{ showTooltip: true }} style={{ width: ~~(windowWidth / 4) }}> <Text strong ellipsis={{ showTooltip: true }} style={{ width: ~~(windowWidth / 4) }}>
{data.title} {title}
</Text> </Text>
</> </>
)} )}