81 lines
2.5 KiB
TypeScript
81 lines
2.5 KiB
TypeScript
import type { Id } from "@code/backend/convex/_generated/dataModel";
|
|
import { Button } from "@code/ui/components/button";
|
|
import { useAction } from "convex/react";
|
|
import { makeFunctionReference } from "convex/server";
|
|
import { LoaderCircle } from "lucide-react";
|
|
import { useState } from "react";
|
|
|
|
interface ConnectGiteaResult {
|
|
connectionId: Id<"gitConnections">;
|
|
}
|
|
|
|
const connectGiteaRef = makeFunctionReference<
|
|
"action",
|
|
{ token: string; username?: string },
|
|
ConnectGiteaResult
|
|
>("gitConnections:connectGitea");
|
|
|
|
export const PuterConnectForm = ({
|
|
onConnected,
|
|
}: {
|
|
readonly onConnected: () => void;
|
|
}) => {
|
|
const connectGitea = useAction(connectGiteaRef);
|
|
const [token, setToken] = useState("");
|
|
const [username, setUsername] = useState("");
|
|
const [pending, setPending] = useState(false);
|
|
const [error, setError] = useState<string>();
|
|
|
|
const submit = async (event: React.FormEvent) => {
|
|
event.preventDefault();
|
|
if (!token.trim() || pending) {
|
|
return;
|
|
}
|
|
setPending(true);
|
|
setError(undefined);
|
|
try {
|
|
await connectGitea({
|
|
token: token.trim(),
|
|
username: username.trim() || undefined,
|
|
});
|
|
setToken("");
|
|
setUsername("");
|
|
onConnected();
|
|
} catch (caughtError) {
|
|
setError(
|
|
caughtError instanceof Error ? caughtError.message : String(caughtError)
|
|
);
|
|
} finally {
|
|
setPending(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<form className="mt-4 space-y-3" onSubmit={submit}>
|
|
<p className="text-xs text-[#68665e]">
|
|
Connect your Puter Git personal access token. The Puter Git instance is
|
|
at <code className="text-[#20201d]">git.openputer.com</code>.
|
|
</p>
|
|
<input
|
|
className="h-10 w-full border border-[#c9c5b9] bg-[#fffefa] px-3 text-sm outline-none focus:border-[#55564e]"
|
|
onChange={(event) => setUsername(event.target.value)}
|
|
placeholder="Puter username (optional)"
|
|
value={username}
|
|
/>
|
|
<input
|
|
className="h-10 w-full border border-[#c9c5b9] bg-[#fffefa] px-3 text-sm outline-none focus:border-[#55564e]"
|
|
onChange={(event) => setToken(event.target.value)}
|
|
placeholder="Personal access token"
|
|
required
|
|
type="password"
|
|
value={token}
|
|
/>
|
|
{error ? <p className="text-xs text-red-700">{error}</p> : null}
|
|
<Button className="h-10 w-full" disabled={pending} type="submit">
|
|
{pending ? <LoaderCircle className="size-4 animate-spin" /> : null}
|
|
{pending ? "Connecting" : "Connect Puter Git"}
|
|
</Button>
|
|
</form>
|
|
);
|
|
};
|