fix: zoom reset on drag and IndexedDB version conflict

- Fix zoom resetting when dragging items (#775): removed useEffect that
  called load() on every autosave-triggered chartXML change, which reset
  the viewport. Moved diagram restore logic to onDrawioLoad where it
  only fires on remount.

- Fix IndexedDB VersionError: template-storage.ts shared the same DB
  name as session-storage.ts but at version 2, causing session storage
  to fail with "requested version (1) < existing version (2)". Give
  templates their own DB ("next-ai-drawio-templates").
This commit is contained in:
dayuan.jiang
2026-04-03 16:37:16 +09:00
parent 6c6cf98019
commit 834abc2b2d
2 changed files with 6 additions and 36 deletions

View File

@@ -65,6 +65,10 @@ export function DiagramProvider({ children }: { children: React.ReactNode }) {
if (hasCalledOnLoadRef.current) return
hasCalledOnLoadRef.current = true
setIsDrawioReady(true)
// Restore diagram after remount (e.g., theme/UI change)
if (drawioRef.current && isRealDiagram(chartXMLRef.current)) {
drawioRef.current.load({ xml: chartXMLRef.current })
}
}
const resetDrawioReady = () => {
@@ -77,24 +81,6 @@ export function DiagramProvider({ children }: { children: React.ReactNode }) {
chartXMLRef.current = chartXML
}, [chartXML])
// Restore diagram when DrawIO becomes ready after remount (e.g., theme/UI change)
// Also restore when chartXML changes while DrawIO is ready (e.g., session loaded after iframe ready)
const lastRestoredXmlRef = useRef<string>("")
useEffect(() => {
if (!isDrawioReady || !drawioRef.current) return
// Only load if we have a real diagram and it's different from what we already loaded
if (
isRealDiagram(chartXML) &&
chartXML !== lastRestoredXmlRef.current
) {
lastRestoredXmlRef.current = chartXML
drawioRef.current.load({ xml: chartXML })
} else if (!isRealDiagram(chartXML)) {
// Reset when diagram is cleared so a future restore can re-load the same XML.
lastRestoredXmlRef.current = ""
}
}, [isDrawioReady, chartXML])
// Track if we're expecting an export for file save (stores raw export data)
const saveResolverRef = useRef<{
resolver: ((data: string) => void) | null

View File

@@ -2,8 +2,8 @@ import { type DBSchema, type IDBPDatabase, openDB } from "idb"
import { nanoid } from "nanoid"
// Constants
const DB_NAME = "next-ai-drawio"
const DB_VERSION = 2
const DB_NAME = "next-ai-drawio-templates"
const DB_VERSION = 1
const STORE_NAME = "templates"
// Types
@@ -34,14 +34,6 @@ export type TemplateCreateInput = Pick<Template, "prompt"> &
>
interface TemplateDB extends DBSchema {
sessions: {
key: string
value: {
id: string
[key: string]: unknown
}
indexes: { "by-updated": number }
}
templates: {
key: string
value: Template
@@ -98,14 +90,6 @@ async function getDB(): Promise<IDBPDatabase<TemplateDB>> {
dbPromise = openDB<TemplateDB>(DB_NAME, DB_VERSION, {
upgrade(db, oldVersion) {
if (oldVersion < 1) {
if (!db.objectStoreNames.contains("sessions")) {
const sessionStore = db.createObjectStore("sessions", {
keyPath: "id",
})
sessionStore.createIndex("by-updated", "updatedAt")
}
}
if (oldVersion < 2) {
if (!db.objectStoreNames.contains(STORE_NAME)) {
const templateStore = db.createObjectStore(STORE_NAME, {
keyPath: "id",