diff --git a/src/app/page.tsx b/src/app/page.tsx index 3c326c9..0694a63 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -57,18 +57,6 @@ const overrides: TLUiOverrides = { } return tools }, - // toolbar(_app, toolbar, { tools }) { - // const frameIndex = toolbar.findIndex((item) => item.id === 'frame') - // if (frameIndex !== -1) toolbar.splice(frameIndex, 1) - // const highlighterIndex = toolbar.findIndex((item) => item.id === 'highlight') - // if (highlighterIndex !== -1) { - // const highlighterItem = toolbar[highlighterIndex] - // toolbar.splice(highlighterIndex, 1) - // toolbar.splice(3, 0, highlighterItem) - // } - // toolbar.splice(2, 0, toolbarItem(tools.liveImage)) - // return toolbar - // }, } const shapeUtils = [LiveImageShapeUtil] @@ -104,20 +92,16 @@ export default function Home() { editor.setStyleForNextShapes(DefaultSizeStyle, 'xl') - // Add support for new generation types - editor.store.registerShapeUtils( - TextToImageShapeUtil, - ImageToVideoShapeUtil - ) + // Trigger initial image generation after a short delay + setTimeout(() => { + editor.emit('update-drawings' as any) + }, 100) } return (
-
- -
{ editor.emit('update-drawings' as any) }) + + // Trigger initial generation on mount + const timer = setTimeout(() => { + editor.emit('update-drawings' as any) + }, 500) + + return () => clearTimeout(timer) }, [editor]) return null diff --git a/src/hooks/useLiveImage.tsx b/src/hooks/useLiveImage.tsx index d52221b..88db78d 100644 --- a/src/hooks/useLiveImage.tsx +++ b/src/hooks/useLiveImage.tsx @@ -29,7 +29,7 @@ export function LiveImageProvider({ children, appId, throttleTime = 0, - timeoutTime = 5000, + timeoutTime = 3000, }: { children: React.ReactNode appId: string @@ -114,7 +114,7 @@ export function LiveImageProvider({ export function useLiveImage( shapeId: TLShapeId, - { throttleTime = 64 }: { throttleTime?: number } = {} + { throttleTime = 32 }: { throttleTime?: number } = {} ) { const editor = useEditor() const fetchImage = useContext(LiveImageContext) @@ -166,7 +166,7 @@ export function useLiveImage( const blob = await fastGetSvgAsImage(svgString, { type: 'jpeg', - quality: 0.5, + quality: 0.3, width: svgStringResult.width, height: svgStringResult.height, })