diff --git a/frontend/src/app/changelog.tsx b/frontend/src/app/changelog.tsx index 454edcb18f..bdb61547ff 100644 --- a/frontend/src/app/changelog.tsx +++ b/frontend/src/app/changelog.tsx @@ -37,7 +37,7 @@ export function ChangelogEntry({
-

+

{isNew ? ( New Update ) : ( diff --git a/frontend/src/app/data-providers/cloud-data-provider.tsx b/frontend/src/app/data-providers/cloud-data-provider.tsx index 41e426807d..bda157e16b 100644 --- a/frontend/src/app/data-providers/cloud-data-provider.tsx +++ b/frontend/src/app/data-providers/cloud-data-provider.tsx @@ -357,7 +357,7 @@ export const createNamespaceContext = ({ namespaceQueryOptions() { return parent.currentProjectNamespaceQueryOptions({ namespace }); }, - connectRunnerTokenQueryOptions() { + engineAdminTokenQueryOptions() { return queryOptions({ staleTime: 5 * 60 * 1000, // 5 minutes gcTime: 5 * 60 * 1000, // 5 minutes @@ -367,11 +367,11 @@ export const createNamespaceContext = ({ project: parent.project, organization: parent.organization, }, - "runners", - "connect", + "tokens", + "engine-admin", ], queryFn: async () => { - const f = parent.client.namespaces.createPublishableToken( + const f = parent.client.namespaces.createSecretToken( parent.project, namespace, { org: parent.organization }, diff --git a/frontend/src/app/data-providers/engine-data-provider.tsx b/frontend/src/app/data-providers/engine-data-provider.tsx index 6252497441..b92c5b6fc7 100644 --- a/frontend/src/app/data-providers/engine-data-provider.tsx +++ b/frontend/src/app/data-providers/engine-data-provider.tsx @@ -585,11 +585,11 @@ export const createNamespaceContext = ({ }, }); }, - connectRunnerTokenQueryOptions() { + engineAdminTokenQueryOptions() { return queryOptions({ staleTime: 1000, gcTime: 1000, - queryKey: [{ namespace }, "runners", "connect"], + queryKey: [{ namespace }, "tokens", "engine-admin"], queryFn: async () => { return ls.engineCredentials.get(getConfig().apiUrl) || ""; }, diff --git a/frontend/src/app/dialogs/connect-railway-frame.tsx b/frontend/src/app/dialogs/connect-railway-frame.tsx index 4e062a5866..db7bda46a3 100644 --- a/frontend/src/app/dialogs/connect-railway-frame.tsx +++ b/frontend/src/app/dialogs/connect-railway-frame.tsx @@ -24,7 +24,7 @@ const { Stepper } = defineStepper( }, { id: "step-3", - title: "Confirm Connection", + title: "Wait for a Runner to connect", }, ); @@ -39,7 +39,7 @@ export default function ConnectRailwayFrameContent({ defaultValues={{ endpoint: "" }} > - +
Add Railway
@@ -60,7 +60,7 @@ export default function ConnectRailwayFrameContent({ function FormStepper({ onClose }: { onClose?: () => void }) { const dataProvider = useEngineCompatDataProvider(); - const { data } = useQuery(dataProvider.connectRunnerTokenQueryOptions()); + const { data } = useQuery(dataProvider.engineAdminTokenQueryOptions()); return ( @@ -90,7 +90,7 @@ function FormStepper({ onClose }: { onClose?: () => void }) { quickly.

void }) { )} {step.id === "step-3" && (
-
)} @@ -167,7 +163,7 @@ function EnvVariablesStep() { const dataProvider = useEngineCompatDataProvider(); const { data, isLoading } = useQuery( - dataProvider.connectRunnerTokenQueryOptions(), + dataProvider.engineAdminTokenQueryOptions(), ); return ( @@ -179,7 +175,7 @@ function EnvVariablesStep() {
{__APP_TYPE__ === "engine" ? ( <> - + ) : null} diff --git a/frontend/src/app/dialogs/connect-vercel-frame.tsx b/frontend/src/app/dialogs/connect-vercel-frame.tsx index 18f9c18975..f191a0092a 100644 --- a/frontend/src/app/dialogs/connect-vercel-frame.tsx +++ b/frontend/src/app/dialogs/connect-vercel-frame.tsx @@ -1,11 +1,7 @@ import { faQuestionCircle, faVercel, Icon } from "@rivet-gg/icons"; import * as ConnectVercelForm from "@/app/forms/connect-vercel-form"; import { HelpDropdown } from "@/app/help-dropdown"; -import { - Button, - type DialogContentProps, - Frame, -} from "@/components"; +import { Button, type DialogContentProps, Frame } from "@/components"; import { defineStepper } from "@/components/ui/stepper"; const { Stepper } = defineStepper( @@ -40,7 +36,7 @@ export default function CreateProjectFrameContent({ defaultValues={{ plan: "hobby", endpoint: "" }} > - +
Add Vercel diff --git a/frontend/src/app/forms/connect-railway-form.tsx b/frontend/src/app/forms/connect-railway-form.tsx index 7d39d75cdb..b4baf7be9c 100644 --- a/frontend/src/app/forms/connect-railway-form.tsx +++ b/frontend/src/app/forms/connect-railway-form.tsx @@ -1,11 +1,14 @@ +import { faCheck, faSpinnerThird, Icon } from "@rivet-gg/icons"; +import { useInfiniteQuery } from "@tanstack/react-query"; +import { motion } from "framer-motion"; +import { useEffect, useRef } from "react"; import type { UseFormReturn } from "react-hook-form"; import z from "zod"; -import * as ConnectVercelForm from "@/app/forms/connect-vercel-form"; -import { createSchemaForm } from "@/components"; +import { cn, createSchemaForm } from "@/components"; +import { useEngineCompatDataProvider } from "@/components/actors"; +import { NeedHelp } from "./connect-vercel-form"; -export const formSchema = z.object({ - endpoint: z.string().url(), -}); +export const formSchema = z.object({}); export type FormValues = z.infer; export type SubmitHandler = ( @@ -16,5 +19,51 @@ export type SubmitHandler = ( const { Form, Submit, SetValue } = createSchemaForm(formSchema); export { Form, Submit, SetValue }; -export const ConnectionCheck = ConnectVercelForm.ConnectionCheck; -export const Endpoint = ConnectVercelForm.Endpoint; +export const ConnectionCheck = function ConnectionCheck() { + const { data } = useInfiniteQuery({ + ...useEngineCompatDataProvider().runnersQueryOptions(), + refetchInterval: 1000, + maxPages: 9999, + select: (data) => + data.pages.reduce((acc, page) => acc + page.runners.length, 0), + }); + + const lastCount = useRef(data); + + useEffect(() => { + lastCount.current = data; + }, [data]); + + const success = + data !== undefined && data > 0 && data !== lastCount.current; + + return ( + + {success ? ( + <> + {" "} + Runner successfully connected + + ) : ( +
+
+ {" "} + Waiting for Runner to connect... +
+ +
+ )} + + ); +}; diff --git a/frontend/src/app/forms/org-sign-up-form.tsx b/frontend/src/app/forms/org-sign-up-form.tsx new file mode 100644 index 0000000000..3a5198eeff --- /dev/null +++ b/frontend/src/app/forms/org-sign-up-form.tsx @@ -0,0 +1,47 @@ +import { type UseFormReturn, useFormContext } from "react-hook-form"; +import z from "zod"; +import { + createSchemaForm, + FormControl, + FormField, + FormItem, + FormLabel, + FormMessage, + Input, +} from "@/components"; + +export const formSchema = z.object({ + password: z.string().min(8, "Password must be at least 8 characters"), +}); + +export type FormValues = z.infer; +export type SubmitHandler = ( + values: FormValues, + form: UseFormReturn, +) => Promise; + +const { Form, Submit, SetValue } = createSchemaForm(formSchema); +export { Form, Submit, SetValue }; + +export const Password = ({ className }: { className?: string }) => { + const { control } = useFormContext(); + return ( + ( + + Password + + + + + + )} + /> + ); +}; diff --git a/frontend/src/app/namespaces-page.tsx b/frontend/src/app/namespaces-page.tsx index 8246429d7e..44e1a15548 100644 --- a/frontend/src/app/namespaces-page.tsx +++ b/frontend/src/app/namespaces-page.tsx @@ -32,7 +32,7 @@ export function NamespacesPage({ from }: { from: LinkComponentProps["from"] }) { return (
-
+

Namespaces

: null} - {__APP_TYPE__ === "engine" ? ( - + {["engine", "cloud"].includes(__APP_TYPE__) ? ( + ) : null} Advanced - {__APP_TYPE__ === "engine" ? ( + {["engine", "cloud"].includes(__APP_TYPE__) ? ( <> - + ) : null} diff --git a/frontend/src/components/actors/form/actor-create-form.tsx b/frontend/src/components/actors/form/actor-create-form.tsx index 813de8b46c..41cfcc84e3 100644 --- a/frontend/src/components/actors/form/actor-create-form.tsx +++ b/frontend/src/components/actors/form/actor-create-form.tsx @@ -15,6 +15,7 @@ import { } from "../../ui/form"; import { BuildSelect } from "../build-select"; import { CrashPolicySelect } from "../crash-policy-select"; +import { useEngineCompatDataProvider } from "../data-provider"; import { CrashPolicy as CrashPolicyEnum } from "../queries"; import { RegionSelect } from "../region-select"; import { RunnerSelect } from "../runner-select"; @@ -153,7 +154,7 @@ export const JsonInput = () => { ); }; -export const RunnerNameSelector = ({ namespace }: { namespace: string }) => { +export const RunnerNameSelector = () => { const { control } = useFormContext(); return ( @@ -165,7 +166,6 @@ export const RunnerNameSelector = ({ namespace }: { namespace: string }) => { Runner @@ -212,12 +212,12 @@ export const ActorPreview = () => { ); }; -export const PrefillRunnerName = ({ namespace }: { namespace: string }) => { +export const PrefillRunnerName = () => { const prefilled = useRef(false); const { watch } = useFormContext(); const { data = [], isSuccess } = useInfiniteQuery( - runnerNamesQueryOptions({ namespace }), + useEngineCompatDataProvider().runnerNamesQueryOptions(), ); const watchedValue = watch("runnerNameSelector"); diff --git a/frontend/src/components/actors/runner-select.tsx b/frontend/src/components/actors/runner-select.tsx index d06fda989a..6e7c55798b 100644 --- a/frontend/src/components/actors/runner-select.tsx +++ b/frontend/src/components/actors/runner-select.tsx @@ -6,14 +6,9 @@ import { useEngineCompatDataProvider } from "./data-provider"; interface RunnerSelectProps { onValueChange: (value: string) => void; value: string; - namespace: string; } -export function RunnerSelect({ - onValueChange, - value, - namespace, -}: RunnerSelectProps) { +export function RunnerSelect({ onValueChange, value }: RunnerSelectProps) { const { data = [], hasNextPage, @@ -21,7 +16,7 @@ export function RunnerSelect({ isLoading, isFetchingNextPage, } = useInfiniteQuery( - useEngineCompatDataProvider().runnerNamesQueryOptions({ namespace }), + useEngineCompatDataProvider().runnerNamesQueryOptions(), ); const [newRunner, setNewRunner] = useState(null); diff --git a/frontend/src/components/docs-sheet.tsx b/frontend/src/components/docs-sheet.tsx index 875c1d8ef9..cf558bdc05 100644 --- a/frontend/src/components/docs-sheet.tsx +++ b/frontend/src/components/docs-sheet.tsx @@ -52,8 +52,8 @@ export function DocsSheet({ rel="noopener noreferrer" href={ path.startsWith("http") - ? `${path}?utm_source=engine&embed=true` - : `https://rivet.gg/${path}?utm_source=engine&embed=true#${hash}` + ? `${path}?utm_source=engine` + : `https://rivet.gg/${path}?utm_source=engine#${hash}` } > Open in new tab diff --git a/frontend/src/components/hooks/use-dialog.tsx b/frontend/src/components/hooks/use-dialog.tsx index cd2086f9fa..1bdf56f401 100644 --- a/frontend/src/components/hooks/use-dialog.tsx +++ b/frontend/src/components/hooks/use-dialog.tsx @@ -49,9 +49,9 @@ export const createDialogHook = < {} - : props.dialogProps?.onOpenChange + : dialogProps?.onOpenChange } > (
-
+

diff --git a/frontend/src/routes/_context/_cloud/orgs.$organization/projects.$project/ns.$namespace/connect.tsx b/frontend/src/routes/_context/_cloud/orgs.$organization/projects.$project/ns.$namespace/connect.tsx index 00e9f317a9..c47c0f2317 100644 --- a/frontend/src/routes/_context/_cloud/orgs.$organization/projects.$project/ns.$namespace/connect.tsx +++ b/frontend/src/routes/_context/_cloud/orgs.$organization/projects.$project/ns.$namespace/connect.tsx @@ -47,7 +47,7 @@ export function RouteComponent() { return (
-
+

Connect

@@ -80,7 +80,7 @@ export function RouteComponent() {
- ) : runnerNamesCount !== 0 ? ( + ) : runnerNamesCount === 0 ? (

Select Provider

@@ -166,7 +166,7 @@ function Providers() { Add Provider - + } onSelect={() => {