diff --git a/frontend/app/(main)/responses/components/offline-page-tab.tsx b/frontend/app/(main)/responses/components/offline-page-tab.tsx index 39db07db..7920429e 100644 --- a/frontend/app/(main)/responses/components/offline-page-tab.tsx +++ b/frontend/app/(main)/responses/components/offline-page-tab.tsx @@ -1,7 +1,7 @@ 'use client'; import Link from 'next/link'; -import { useEffect, useState } from 'react'; +import { useEffect, useMemo, useState } from 'react'; import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; import { Expand, Loader2, Pencil, Plus, Save, X } from 'lucide-react'; import { toast } from 'sonner'; @@ -17,6 +17,7 @@ import { } from '@/components/ui/card'; import { Label } from '@/components/ui/label'; import { Switch } from '@/components/ui/switch'; +import { effectiveOfflinePageHTML } from '@/lib/openflare/offline-page-templates'; import { OptionService, ZoneService, @@ -49,6 +50,11 @@ export function OfflinePageTab({ setFields(mapOptionsToOfflineFields(optionMap)); }, [optionMap]); + const previewSrcDoc = useMemo( + () => effectiveOfflinePageHTML(fields.html), + [fields.html], + ); + const zonesQuery = useQuery({ queryKey: [...zoneQueryKey, 'sw-scope'], queryFn: async () => { @@ -204,7 +210,7 @@ export function OfflinePageTab({