the universal sandbox runtime for agents and humans.
pocketenv.io
sandbox
openclaw
agent
claude-code
vercel-sandbox
deno-sandbox
cloudflare-sandbox
atproto
sprites
daytona
Add auth headers and claim UI for sandboxes
Send Authorization header from localStorage in createSandbox and
claimSandbox API calls. Add sign-in modal, a "Claim Project"
alert/button,
and isAuthenticated check to the Sandbox page to trigger the modal.
Remove
unused isLoading destructuring from Navbar.
+54
-7
+22
-6
apps/web/src/api/sandbox.ts
+22
-6
apps/web/src/api/sandbox.ts
···
2
2
import type { Sandbox } from "../types/sandbox";
3
3
4
4
export const createSandbox = ({ base }: { base: string }) =>
5
-
client.post("/xrpc/io.pocketenv.sandbox.createSandbox", {
6
-
base,
7
-
});
5
+
client.post(
6
+
"/xrpc/io.pocketenv.sandbox.createSandbox",
7
+
{
8
+
base,
9
+
},
10
+
{
11
+
headers: {
12
+
Authorization: `Bearer ${localStorage.getItem("token")}`,
13
+
},
14
+
},
15
+
);
8
16
9
17
export const claimSandbox = ({ id }: { id: string }) =>
10
-
client.post("/xrpc/io.pocketenv.sandbox.claimSandbox", {
11
-
id,
12
-
});
18
+
client.post(
19
+
"/xrpc/io.pocketenv.sandbox.claimSandbox",
20
+
{
21
+
id,
22
+
},
23
+
{
24
+
headers: {
25
+
Authorization: `Bearer ${localStorage.getItem("token")}`,
26
+
},
27
+
},
28
+
);
13
29
14
30
export const getSandbox = (id: string) =>
15
31
client.get(`/xrpc/io.pocketenv.sandbox.getSandbox?id=${id}`);
+31
apps/web/src/pages/sandbox/Sandbox.tsx
+31
apps/web/src/pages/sandbox/Sandbox.tsx
···
1
+
import { useState } from "react";
1
2
import Navbar from "../../components/navbar";
3
+
import SignIn from "../../components/signin/Signin";
2
4
3
5
function New() {
6
+
const [signInModalOpen, setSignInModalOpen] = useState(false);
7
+
const onClaim = () => {
8
+
setSignInModalOpen(true);
9
+
};
10
+
const isAuthenticated = !!localStorage.getItem("token");
4
11
return (
5
12
<>
6
13
<div className="flex flex-col min-h-screen bg-base-100">
7
14
<Navbar withLogo title="" project="lucky-quietude" />
15
+
{!isAuthenticated && (
16
+
<div
17
+
className="alert alert-soft alert-warning flex items-center bg-warning/10 border-none"
18
+
role="alert"
19
+
>
20
+
<div className="flex-1">
21
+
This is a temporary project (what's this?) and will be deleted in
22
+
24 hours. Claim it to make it yours.
23
+
</div>
24
+
25
+
<button
26
+
onClick={onClaim}
27
+
className="btn btn-md btn-primary font-semibold ml-4"
28
+
>
29
+
Claim Project
30
+
</button>
31
+
</div>
32
+
)}
8
33
</div>
34
+
<SignIn
35
+
isOpen={signInModalOpen}
36
+
onClose={() => {
37
+
setSignInModalOpen(false);
38
+
}}
39
+
/>
9
40
</>
10
41
);
11
42
}