diff --git a/src/App.tsx b/src/App.tsx index 4a09569c..7fb9669a 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -353,6 +353,10 @@ export function App() { workplaceState.canisters[workplaceState.selectedCanister!] ?.candid } + isFrontend={ + workplaceState.canisters[workplaceState.selectedCanister!] + ?.isFrontend ?? false + } forceUpdate={forceUpdate} onMessage={({ origin, source, message }) => { if (!message.caller) return; diff --git a/src/build.ts b/src/build.ts index 3dc2fca1..1e56e027 100644 --- a/src/build.ts +++ b/src/build.ts @@ -10,6 +10,7 @@ export interface CanisterInfo { name?: string; candid?: string | null; stableSig?: string | null; + isFrontend?: boolean; } /* export function interpret(file: string, logger: ILoggingStore): void { diff --git a/src/components/CandidUI.tsx b/src/components/CandidUI.tsx index 7ba1c628..128b15eb 100644 --- a/src/components/CandidUI.tsx +++ b/src/components/CandidUI.tsx @@ -43,6 +43,7 @@ interface PropTypes { canisterId: string; candid?: string | null | undefined; setCandidWidth?: (width: string) => void; + isFrontend: boolean; forceUpdate?: any; onMessage?: (event: { origin: string; source: Window; message: any }) => void; } @@ -52,6 +53,7 @@ export function CandidUI({ candid, setCandidWidth, forceUpdate, + isFrontend, onMessage, }: PropTypes) { const [isExpanded, setIsExpanded] = useState(true); @@ -61,8 +63,10 @@ export function CandidUI({ ? `&did=${encodeURIComponent(btoa(candid))}` : "&external-config"; - const url = - `${CANDID_UI_CANISTER_URL}/?id=${canisterId}&tag=${forceUpdate}` + didParam; + const url = isFrontend + ? `https://${canisterId}.raw.icp0.io` + : `${CANDID_UI_CANISTER_URL}/?id=${canisterId}&tag=${forceUpdate}` + + didParam; // Handle incoming messages from iframe const handleMessage = useCallback( @@ -177,7 +181,7 @@ export function CandidUI({ src={iconCollapse} alt="Collapse icon" /> - {isExpanded ? "CANDID UI" : null} + {isExpanded ? (isFrontend ? "FRONTEND" : "CANDID UI") : null} {isExpanded ? (