fix: script features save with Save Changes instead of instantly

This commit is contained in:
Usman Baig
2026-03-25 21:55:14 +01:00
parent 6c0061733b
commit f794696e90

View File

@@ -35,6 +35,7 @@ export default function SiteGeneralTab({ siteId, onDirtyChange, onRegisterSave }
const { data: site, mutate } = useSite(siteId) const { data: site, mutate } = useSite(siteId)
const [name, setName] = useState('') const [name, setName] = useState('')
const [timezone, setTimezone] = useState('UTC') const [timezone, setTimezone] = useState('UTC')
const [scriptFeatures, setScriptFeatures] = useState<Record<string, unknown>>({})
const [showDeleteModal, setShowDeleteModal] = useState(false) const [showDeleteModal, setShowDeleteModal] = useState(false)
const [showVerificationModal, setShowVerificationModal] = useState(false) const [showVerificationModal, setShowVerificationModal] = useState(false)
@@ -46,30 +47,30 @@ export default function SiteGeneralTab({ siteId, onDirtyChange, onRegisterSave }
if (!site || hasInitialized.current) return if (!site || hasInitialized.current) return
setName(site.name || '') setName(site.name || '')
setTimezone(site.timezone || 'UTC') setTimezone(site.timezone || 'UTC')
initialRef.current = JSON.stringify({ name: site.name || '', timezone: site.timezone || 'UTC' }) setScriptFeatures(site.script_features || {})
initialRef.current = JSON.stringify({ name: site.name || '', timezone: site.timezone || 'UTC', scriptFeatures: JSON.stringify(site.script_features || {}) })
hasInitialized.current = true hasInitialized.current = true
}, [site]) }, [site])
// Track dirty state // Track dirty state
useEffect(() => { useEffect(() => {
if (!initialRef.current) return if (!initialRef.current) return
const current = JSON.stringify({ name, timezone }) const current = JSON.stringify({ name, timezone, scriptFeatures: JSON.stringify(scriptFeatures) })
const dirty = current !== initialRef.current onDirtyChange?.(current !== initialRef.current)
onDirtyChange?.(dirty) }, [name, timezone, scriptFeatures, onDirtyChange])
}, [name, timezone, onDirtyChange])
const handleSave = useCallback(async () => { const handleSave = useCallback(async () => {
if (!site) return if (!site) return
try { try {
await updateSite(siteId, { name, timezone }) await updateSite(siteId, { name, timezone, script_features: scriptFeatures })
await mutate() await mutate()
initialRef.current = JSON.stringify({ name, timezone }) initialRef.current = JSON.stringify({ name, timezone, scriptFeatures: JSON.stringify(scriptFeatures) })
onDirtyChange?.(false) onDirtyChange?.(false)
toast.success('Site updated') toast.success('Site updated')
} catch { } catch {
toast.error('Failed to save') toast.error('Failed to save')
} }
}, [site, siteId, name, timezone, mutate, onDirtyChange]) }, [site, siteId, name, timezone, scriptFeatures, mutate, onDirtyChange])
useEffect(() => { useEffect(() => {
onRegisterSave?.(handleSave) onRegisterSave?.(handleSave)
@@ -134,17 +135,10 @@ export default function SiteGeneralTab({ siteId, onDirtyChange, onRegisterSave }
</div> </div>
<ScriptSetupBlock <ScriptSetupBlock
site={{ domain: site.domain, name: site.name, script_features: site.script_features }} site={{ domain: site.domain, name: site.name, script_features: scriptFeatures }}
showFrameworkPicker showFrameworkPicker
className="mb-4" className="mb-4"
onFeaturesChange={async (features) => { onFeaturesChange={(features) => setScriptFeatures(features)}
try {
await updateSite(siteId, { name: site.name, timezone: site.timezone, script_features: features })
await mutate()
} catch {
toast.error('Failed to update script features')
}
}}
/> />
{/* Verify Installation */} {/* Verify Installation */}