fix: use the container URL for the preview panel
This commit is contained in:
parent
cfed8a225e
commit
85ebfe4161
@ -132,6 +132,7 @@ io.on("connection", async (socket) => {
|
|||||||
if (!containers[data.sandboxId]) {
|
if (!containers[data.sandboxId]) {
|
||||||
containers[data.sandboxId] = await Sandbox.create();
|
containers[data.sandboxId] = await Sandbox.create();
|
||||||
console.log("Created container ", data.sandboxId);
|
console.log("Created container ", data.sandboxId);
|
||||||
|
io.emit("previewURL", "https://" + containers[data.sandboxId].getHostname(5173));
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("Error creating container ", data.sandboxId, error);
|
console.error("Error creating container ", data.sandboxId, error);
|
||||||
|
@ -94,6 +94,9 @@ export default function CodeEditor({
|
|||||||
}[]
|
}[]
|
||||||
>([])
|
>([])
|
||||||
|
|
||||||
|
// Preview state
|
||||||
|
const [previewURL, setPreviewURL] = useState<string>("");
|
||||||
|
|
||||||
const isOwner = sandboxData.userId === userData.id
|
const isOwner = sandboxData.userId === userData.id
|
||||||
const clerk = useClerk()
|
const clerk = useClerk()
|
||||||
|
|
||||||
@ -413,6 +416,7 @@ export default function CodeEditor({
|
|||||||
socketRef.current?.on("rateLimit", onRateLimit)
|
socketRef.current?.on("rateLimit", onRateLimit)
|
||||||
socketRef.current?.on("terminalResponse", onTerminalResponse)
|
socketRef.current?.on("terminalResponse", onTerminalResponse)
|
||||||
socketRef.current?.on("disableAccess", onDisableAccess)
|
socketRef.current?.on("disableAccess", onDisableAccess)
|
||||||
|
socketRef.current?.on("previewURL", setPreviewURL)
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
socketRef.current?.off("connect", onConnect)
|
socketRef.current?.off("connect", onConnect)
|
||||||
@ -421,6 +425,7 @@ export default function CodeEditor({
|
|||||||
socketRef.current?.off("rateLimit", onRateLimit)
|
socketRef.current?.off("rateLimit", onRateLimit)
|
||||||
socketRef.current?.off("terminalResponse", onTerminalResponse)
|
socketRef.current?.off("terminalResponse", onTerminalResponse)
|
||||||
socketRef.current?.off("disableAccess", onDisableAccess)
|
socketRef.current?.off("disableAccess", onDisableAccess)
|
||||||
|
socketRef.current?.off("previewURL", setPreviewURL)
|
||||||
}
|
}
|
||||||
// }, []);
|
// }, []);
|
||||||
}, [terminals])
|
}, [terminals])
|
||||||
@ -769,6 +774,7 @@ export default function CodeEditor({
|
|||||||
previewPanelRef.current?.expand()
|
previewPanelRef.current?.expand()
|
||||||
setIsPreviewCollapsed(false)
|
setIsPreviewCollapsed(false)
|
||||||
}}
|
}}
|
||||||
|
src={previewURL}
|
||||||
/>
|
/>
|
||||||
</ResizablePanel>
|
</ResizablePanel>
|
||||||
<ResizableHandle />
|
<ResizableHandle />
|
||||||
|
@ -15,9 +15,11 @@ import { toast } from "sonner"
|
|||||||
export default function PreviewWindow({
|
export default function PreviewWindow({
|
||||||
collapsed,
|
collapsed,
|
||||||
open,
|
open,
|
||||||
|
src
|
||||||
}: {
|
}: {
|
||||||
collapsed: boolean
|
collapsed: boolean
|
||||||
open: () => void
|
open: () => void
|
||||||
|
src: string
|
||||||
}) {
|
}) {
|
||||||
const ref = useRef<HTMLIFrameElement>(null)
|
const ref = useRef<HTMLIFrameElement>(null)
|
||||||
const [iframeKey, setIframeKey] = useState(0)
|
const [iframeKey, setIframeKey] = useState(0)
|
||||||
@ -45,7 +47,7 @@ export default function PreviewWindow({
|
|||||||
|
|
||||||
<PreviewButton
|
<PreviewButton
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
navigator.clipboard.writeText(`http://localhost:5173`)
|
navigator.clipboard.writeText(src)
|
||||||
toast.info("Copied preview link to clipboard")
|
toast.info("Copied preview link to clipboard")
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
@ -73,7 +75,7 @@ export default function PreviewWindow({
|
|||||||
ref={ref}
|
ref={ref}
|
||||||
width={"100%"}
|
width={"100%"}
|
||||||
height={"100%"}
|
height={"100%"}
|
||||||
src={`http://localhost:5173`}
|
src={src}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user