Merge pull request #57 from CodeTorso/codetorso

smoothening animation
This commit is contained in:
CodeTorso 2024-06-12 15:37:26 +05:30 committed by GitHub
commit 53f08561af
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 5 additions and 4 deletions

View file

@ -8,8 +8,9 @@ import createEmbedsFromUrl from "./lib/createEmbeds";
import { loadRemoteSnapshot } from "./lib/loadSnap";
import { SaveStatus } from "./savesnap";
import { getAssetUrls } from '@tldraw/assets/selfHosted'
import { memo } from 'react';
export default function Canvas(){
export const Canvas = memo(()=>{
const [storeWithStatus, setStoreWithStatus] = useState<TLStoreWithStatus>({
status: "loading",
});
@ -51,4 +52,4 @@ export default function Canvas(){
</div>
</Tldraw>
);
}
})

View file

@ -1,7 +1,7 @@
"use client";
// import Canvas from "./_components/canvas";
import Canvas from "../canvas";
import {Canvas} from "../canvas";
import React, { useState } from "react";
// import ReactTextareaAutosize from "react-textarea-autosize";
import { Panel, PanelGroup, PanelResizeHandle } from "react-resizable-panels";
@ -21,7 +21,7 @@ function page() {
<div className={`h-screen w-full ${ !fullScreen && "px-4 py-6"} transition-all`}>
<div>
<PanelGroup className={` ${fullScreen ? "w-[calc(100vw-2rem)]" : "w-screen"} transition-all`} direction="horizontal">
<Panel onExpand={()=> {setFullScreen(false)}} onCollapse={()=> {setFullScreen(true)}} defaultSize={30} collapsible={true} minSize={22}>
<Panel onExpand={()=> {setTimeout(()=> setFullScreen(false), 50)}} onCollapse={()=> {setTimeout(()=> setFullScreen(true), 50)}} defaultSize={30} collapsible={true} minSize={22}>
<div className={`flex transition-all rounded-2xl ${fullScreen ? "h-screen": "h-[calc(100vh-3rem)]"} w-full flex-col overflow-hidden bg-[#1F2428]`}>
<div className="flex items-center justify-between bg-[#2C3439] px-4 py-2 text-lg font-medium text-[#989EA4]">
Change Filters