the universal sandbox runtime for agents and humans.
pocketenv.io
sandbox
openclaw
agent
claude-code
vercel-sandbox
deno-sandbox
cloudflare-sandbox
atproto
sprites
daytona
Show success notifications on settings forms
Use useNotyf in Settings, Repository, SshKeys, and Tailscale to
display a primary success toast on form submission
+12
+3
apps/web/src/pages/settings/Settings.tsx
+3
apps/web/src/pages/settings/Settings.tsx
···
5
5
import { useSandboxQuery } from "../../hooks/useSandbox";
6
6
import Main from "../../layouts/Main";
7
7
import Sidebar from "./sidebar/Sidebar";
8
+
import { useNotyf } from "../../hooks/useNotyf";
8
9
9
10
const settingsSchema = z.object({
10
11
name: z.string().trim().min(1, "Name is required"),
···
15
16
type SettingsFormValues = z.infer<typeof settingsSchema>;
16
17
17
18
function Settings() {
19
+
const notyf = useNotyf();
18
20
const routerState = useRouterState();
19
21
const pathname = routerState.location.pathname;
20
22
const { data } = useSandboxQuery(
···
31
33
32
34
const onSubmit = (values: SettingsFormValues) => {
33
35
console.log(values);
36
+
notyf.open("primary", "Settings saved successfully!");
34
37
};
35
38
36
39
return (
+3
apps/web/src/pages/settings/repository/Repository.tsx
+3
apps/web/src/pages/settings/repository/Repository.tsx
···
5
5
import { useSandboxQuery } from "../../../hooks/useSandbox";
6
6
import Main from "../../../layouts/Main";
7
7
import Sidebar from "../sidebar/Sidebar";
8
+
import { useNotyf } from "../../../hooks/useNotyf";
8
9
9
10
const gitUrlSchema = z.object({
10
11
repositoryUrl: z
···
20
21
type GitUrlFormValues = z.infer<typeof gitUrlSchema>;
21
22
22
23
function Repository() {
24
+
const notyf = useNotyf();
23
25
const routerState = useRouterState();
24
26
const pathname = routerState.location.pathname;
25
27
const { data } = useSandboxQuery(
···
37
39
38
40
const onSubmit = (values: GitUrlFormValues) => {
39
41
console.log(values);
42
+
notyf.open("primary", "Repository added successfully!");
40
43
};
41
44
42
45
return (
+3
apps/web/src/pages/settings/sshkeys/SshKeys.tsx
+3
apps/web/src/pages/settings/sshkeys/SshKeys.tsx
···
6
6
import Main from "../../../layouts/Main";
7
7
import Sidebar from "../sidebar/Sidebar";
8
8
import { useSshKeys } from "../../../hooks/useSshKeys";
9
+
import { useNotyf } from "../../../hooks/useNotyf";
9
10
10
11
const sshKeysSchema = z
11
12
.object({
···
57
58
type SshKeysFormValues = z.infer<typeof sshKeysSchema>;
58
59
59
60
function SshKeys() {
61
+
const notyf = useNotyf();
60
62
const routerState = useRouterState();
61
63
const pathname = routerState.location.pathname;
62
64
const { generateEd25519SSHKeyPair } = useSshKeys();
···
75
77
76
78
const onSubmit = (values: SshKeysFormValues) => {
77
79
console.log(values);
80
+
notyf.open("primary", "SSH keys saved successfully!");
78
81
};
79
82
80
83
const onGenerate = async () => {
+3
apps/web/src/pages/settings/tailscale/Tailscale.tsx
+3
apps/web/src/pages/settings/tailscale/Tailscale.tsx
···
5
5
import { useSandboxQuery } from "../../../hooks/useSandbox";
6
6
import Main from "../../../layouts/Main";
7
7
import Sidebar from "../sidebar/Sidebar";
8
+
import { useNotyf } from "../../../hooks/useNotyf";
8
9
9
10
const tailscaleSchema = z.object({
10
11
authKey: z
···
19
20
type TailscaleFormValues = z.infer<typeof tailscaleSchema>;
20
21
21
22
function Tailscale() {
23
+
const notyf = useNotyf();
22
24
const routerState = useRouterState();
23
25
const pathname = routerState.location.pathname;
24
26
const { data } = useSandboxQuery(
···
35
37
36
38
const onSubmit = (values: TailscaleFormValues) => {
37
39
console.log(values);
40
+
notyf.open("primary", "Auth Key saved successfully!");
38
41
};
39
42
40
43
return (