@manta-eu/react 0.1.7 → 0.1.9

package/dist/routes/integrations/components/connect-forms/DataConnectionConnectForm.js

@@ -0,0 +1,144 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useCreateDataConnectionMutation, useDataConnectorTypesQuery, useUpdateDataConnectionMutation, } from "@manta-eu/client";
+import { parseError } from "@manta-eu/client/shared/error-utils";
+import { isPresent } from "@manta-eu/lib/present";
+import { Fragment, useMemo, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
+import { acceptsConnectionString } from "./connection-string-fields.js";
+import { ConnectionStringInput } from "./ConnectionStringInput.js";
+import { ConnectWizardShell } from "./ConnectWizardShell.js";
+import { blankValues, changedSettings, editableFields, formSchema, nameKey, nameSchema, pickSettings, settingsSchema, storedValues, } from "./data-connection-fields.js";
+import { inputId, renderFields, renderOptionalFields } from "./DataConnectionFieldInputs.js";
+import { ImportStartedStep } from "./ImportStartedNotice.js";
+import { useConnectWizard } from "./useConnectWizard.js";
+import { Input } from "#components/input/index";
+import { useMantaClient } from "#providers/index";
+function nameStep(providerName) {
+    return {
+        id: "name",
+        title: "Name this connection",
+        description: `Used to identify this ${providerName} database in Manta.`,
+        schema: z.object({ [nameKey]: nameSchema }),
+        continueLabel: "Continue",
+        render: (form) => (_jsx(Input, { id: inputId(nameKey), label: "Name", placeholder: "Warehouse", autoComplete: "off", error: form.formState.errors[nameKey]?.message?.toString(), ...form.register(nameKey) })),
+    };
+}
+function connectionStep(args) {
+    const { providerName, connectorType, stepFields, allFields, editing } = args;
+    return {
+        id: "connection",
+        title: "Enter the connection details",
+        description: editing
+            ? "Manta tests new settings before it uses them. Until then, the stored settings keep syncing."
+            : `Manta tests the connection before it syncs the ${providerName} tables.`,
+        schema: settingsSchema(stepFields),
+        continueLabel: "Continue",
+        render: (form) => (_jsxs("div", { className: "grid gap-4", children: [acceptsConnectionString(connectorType) && (_jsx(ConnectionStringInput, { form: form, connectorType: connectorType, allFields: allFields, stepFields: stepFields })), renderFields(form, stepFields, editing)] })),
+    };
+}
+function optionalStep(fields, editing) {
+    return {
+        id: "optional",
+        title: "Optional settings",
+        description: editing ? "Leave a secret blank to keep its stored value." : "Leave a field blank to use its default.",
+        schema: settingsSchema(fields),
+        continueLabel: "Continue",
+        render: (form) => renderOptionalFields(form, fields, editing),
+    };
+}
+function withSubmitLabel(steps, label) {
+    return steps.map((step, index) => (index === steps.length - 1 ? { ...step, continueLabel: label } : step));
+}
+export function createSteps(providerName, connectorType, fields, editing = false) {
+    const required = fields.filter((field) => field.required);
+    const optional = fields.filter((field) => !field.required);
+    const steps = [
+        nameStep(providerName),
+        connectionStep({ providerName, connectorType, stepFields: required, allFields: fields, editing }),
+        ...(isPresent(optional) ? [optionalStep(optional, editing)] : []),
+    ];
+    return withSubmitLabel(steps, editing ? "Save" : "Connect");
+}
+function DataConnectionWizard(props) {
+    const { provider, connectorType, fields, stored, status, onBack, onChanged, onDismiss, importNotice } = props;
+    const editing = stored !== undefined;
+    const showsImportNotice = !editing && importNotice !== undefined;
+    const [created, setCreated] = useState(false);
+    const formFields = useMemo(() => (editing ? editableFields(fields) : fields), [editing, fields]);
+    const steps = useMemo(() => createSteps(provider.name, connectorType, formFields, editing), [provider.name, connectorType, formFields, editing]);
+    const fullSchema = useMemo(() => formSchema(formFields), [formFields]);
+    const { mantaClient } = useMantaClient();
+    const createMutation = useCreateDataConnectionMutation(mantaClient);
+    const updateMutation = useUpdateDataConnectionMutation(mantaClient);
+    const form = useForm({
+        resolver: zodResolver(fullSchema),
+        defaultValues: stored ? storedValues(stored, fields) : blankValues(fields),
+        mode: "onChange",
+    });
+    async function create(values) {
+        await createMutation.mutateAsync({
+            input: { name: values[nameKey], connectorType, settings: pickSettings(values, fields) },
+        });
+        toast.success(`${provider.name} added`, { description: "Manta is testing the connection." });
+    }
+    async function update(values, connection) {
+        const changed = changedSettings(values, fields, connection);
+        await updateMutation.mutateAsync({
+            input: { id: connection.id, name: values[nameKey], settings: isPresent(changed) ? changed : undefined },
+        });
+        toast.success(`${provider.name} saved`, {
+            description: isPresent(changed) ? "Manta is testing the new settings." : undefined,
+        });
+    }
+    async function onValid(values) {
+        try {
+            await (stored ? update(values, stored) : create(values));
+            onChanged();
+            if (showsImportNotice)
+                setCreated(true);
+            else
+                onDismiss();
+        }
+        catch (err) {
+            const info = parseError(err, `Failed to save ${provider.name}`);
+            toast.error(info.message, { description: info.description });
+        }
+    }
+    const { stepIndex, currentStep, canAdvance, handleContinue, handleBack } = useConnectWizard({
+        steps,
+        form,
+        fullSchema,
+        onSubmit: onValid,
+        onBack,
+    });
+    if (created && importNotice) {
+        return (_jsx(ImportStartedStep, { provider: provider, notice: importNotice, status: "Testing", title: `Testing your ${provider.name} connection`, totalSteps: steps.length + 1, onDone: onDismiss }));
+    }
+    return (_jsx(ConnectWizardShell, { provider: provider, status: status, totalSteps: showsImportNotice ? steps.length + 1 : steps.length, currentStep: stepIndex + 1, stepTitle: currentStep.title, stepDescription: currentStep.description, onBack: handleBack, onContinue: handleContinue, continueLabel: currentStep.continueLabel, continueDisabled: !canAdvance, isSubmitting: createMutation.isPending || updateMutation.isPending, children: _jsx(Fragment, { children: currentStep.render(form) }, currentStep.id) }));
+}
+function ConnectorLoader(props) {
+    const { provider, connectorType, onBack, children } = props;
+    const { mantaClient } = useMantaClient();
+    const { data, error, isLoading } = useDataConnectorTypesQuery(mantaClient);
+    const connector = data?.dataConnectorTypes.find((type) => type.connectorType === connectorType);
+    if (connector)
+        return children(connector.fields);
+    const message = isLoading
+        ? "Loading the connection settings…"
+        : parseError(error, `Manta does not support ${provider.name} connections here.`).message;
+    return (_jsx(ConnectWizardShell, { provider: provider, totalSteps: 1, currentStep: 1, stepTitle: provider.name, onBack: onBack, continueLabel: "Continue", continueDisabled: true, children: _jsx("p", { role: "status", "aria-live": "polite", className: "typography-caption text-muted-foreground", children: message }) }));
+}
+export function DataConnectionConnectForm(props) {
+    const { provider, dataConnectorType, onBack } = props;
+    if (!dataConnectorType) {
+        throw new Error(`${provider.name} is missing its data connector type`);
+    }
+    return (_jsx(ConnectorLoader, { provider: provider, connectorType: dataConnectorType, onBack: onBack, children: (fields) => _jsx(DataConnectionWizard, { ...props, connectorType: dataConnectorType, fields: fields }) }));
+}
+export function DataConnectionEditForm(props) {
+    const { provider, connectorType, stored, status, onChanged, onDismiss } = props;
+    return (_jsx(ConnectorLoader, { provider: provider, connectorType: connectorType, onBack: onDismiss, children: (fields) => (_jsx(DataConnectionWizard, { provider: provider, connectorType: connectorType, fields: fields, stored: stored, status: status, onBack: onDismiss, onChanged: onChanged, onDismiss: onDismiss })) }));
+}

package/dist/routes/integrations/components/connect-forms/DataConnectionFieldInputs.d.ts

@@ -0,0 +1,8 @@
+import { type UseFormReturn } from "react-hook-form";
+import { type ConnectorField, type DataConnectionValues } from "./data-connection-fields.js";
+export type FormOf = UseFormReturn<DataConnectionValues>;
+export declare function inputId(key: string): string;
+export declare function choiceToValue(choice: string): string;
+export declare function renderFields(form: FormOf, fields: readonly ConnectorField[], editing: boolean): import("react/jsx-runtime").JSX.Element;
+export declare function renderOptionalFields(form: FormOf, fields: readonly ConnectorField[], editing: boolean): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DataConnectionFieldInputs.d.ts.map

package/dist/routes/integrations/components/connect-forms/DataConnectionFieldInputs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataConnectionFieldInputs.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/DataConnectionFieldInputs.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAc,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,EAIL,KAAK,cAAc,EACnB,KAAK,oBAAoB,EAC1B,MAAM,0BAA0B,CAAC;AAMlC,MAAM,MAAM,MAAM,GAAG,aAAa,CAAC,oBAAoB,CAAC,CAAC;AAIzD,wBAAgB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAE3C;AAKD,wBAAgB,aAAa,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAEpD;AAwDD,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,cAAc,EAAE,EAAE,OAAO,EAAE,OAAO,2CAE7F;AAwBD,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,cAAc,EAAE,EAAE,OAAO,EAAE,OAAO,2CAUrG"}

package/dist/routes/integrations/components/connect-forms/DataConnectionFieldInputs.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isPresent } from "@manta-eu/lib/present";
+import { ChevronRight } from "lucide-react";
+import { useState } from "react";
+import { Controller } from "react-hook-form";
+import { choices, hasCustomValue, isCloudSqlField, } from "./data-connection-fields.js";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "#components/collapsible/index";
+import { Input } from "#components/input/index";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "#components/select/index";
+import { cn } from "#lib/utils";
+const keepSecretHint = "Leave blank to keep the stored value";
+export function inputId(key) {
+    return `data-connection-${key}`;
+}
+// Radix Select refuses an empty item value, so this marker stands for the blank that keeps the connector default.
+const defaultChoice = "__connector-default__";
+export function choiceToValue(choice) {
+    return choice === defaultChoice ? "" : choice;
+}
+function defaultChoiceLabel(field) {
+    return isPresent(field.default) ? `Default (${field.default})` : "Default";
+}
+function renderChoiceField(form, field, options) {
+    return (_jsx(Controller, { control: form.control, name: field.key, render: ({ field: control, fieldState }) => (_jsxs(Select, { value: control.value ?? "", onValueChange: (choice) => control.onChange(choiceToValue(choice)), children: [_jsx(SelectTrigger, { label: field.title, id: inputId(field.key), className: "w-full h-10", error: fieldState.error?.message, children: _jsx(SelectValue, { placeholder: field.required ? "Select a value" : defaultChoiceLabel(field) }) }), _jsxs(SelectContent, { children: [!field.required && _jsx(SelectItem, { value: defaultChoice, children: defaultChoiceLabel(field) }), options.map((option) => (_jsx(SelectItem, { value: option, children: option }, option)))] })] })) }, field.key));
+}
+function renderField(form, field, editing) {
+    const options = choices(field);
+    if (options)
+        return renderChoiceField(form, field, options);
+    return (_jsx(Input, { id: inputId(field.key), label: field.title, description: field.description ?? undefined, descriptionInLabelTooltip: true, type: field.secret ? "password" : undefined, placeholder: editing && field.secret ? keepSecretHint : (field.default ?? undefined), autoComplete: "off", error: form.formState.errors[field.key]?.message?.toString(), ...form.register(field.key) }, field.key));
+}
+export function renderFields(form, fields, editing) {
+    return _jsx("div", { className: "grid gap-3", children: fields.map((field) => renderField(form, field, editing)) });
+}
+function CloudSqlSettings(props) {
+    const { form, fields, editing } = props;
+    const [open, setOpen] = useState(() => hasCustomValue(form.getValues(), fields));
+    return (_jsxs(Collapsible, { open: open, onOpenChange: setOpen, className: "grid gap-3", children: [_jsxs(CollapsibleTrigger, { className: "flex items-center gap-2 typography-body text-default-foreground", children: [_jsx(ChevronRight, { "aria-hidden": true, className: cn("size-4 transition-transform", open && "rotate-90") }), "Google Cloud SQL", _jsx("span", { className: "typography-caption text-muted-foreground", children: "Only for a database in Google Cloud SQL" })] }), _jsx(CollapsibleContent, { children: renderFields(form, fields, editing) })] }));
+}
+export function renderOptionalFields(form, fields, editing) {
+    const cloudSql = fields.filter(isCloudSqlField);
+    const plain = fields.filter((field) => !isCloudSqlField(field));
+    return (_jsxs("div", { className: "grid gap-4", children: [renderFields(form, plain, editing), isPresent(cloudSql) && _jsx(CloudSqlSettings, { form: form, fields: cloudSql, editing: editing })] }));
+}

package/dist/routes/integrations/components/connect-forms/FigmaConnectForm.d.ts

@@ -0,0 +1,3 @@
+import type { ConnectFormProps } from "./types.js";
+export declare function FigmaConnectForm(props: ConnectFormProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FigmaConnectForm.d.ts.map

package/dist/routes/integrations/components/connect-forms/FigmaConnectForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FigmaConnectForm.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/FigmaConnectForm.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAShD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,gBAAgB,2CAyBvD"}

package/dist/routes/integrations/components/connect-forms/FigmaConnectForm.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { GQLIntegration } from "@manta-eu/client";
+import { isPresent } from "@manta-eu/lib/present";
+import { MantaSyncPluginStep } from "../MantaSyncPluginDownload.js";
+import { OAuthSingleAccountConnectForm } from "./OAuthSingleAccountConnectForm.js";
+import { mantaSyncPluginPath } from "#lib/build-config";
+const figmaPermissions = [
+    "Read the contents of the files you grant access to.",
+    "Read comments on those files.",
+    "Post comments back on those files.",
+];
+export function FigmaConnectForm(props) {
+    return (_jsx(OAuthSingleAccountConnectForm, { ...props, integration: GQLIntegration.Figma, startHref: "/oauth/figma/start", ctaLabel: "Continue with Figma", stepTitle: "Connect your Figma account", stepDescription: "Manta will take you to Figma to ask for permission, then bring you back here.", supportingInfo: "You'll be taken to Figma to approve access. You can revoke it any time from your Figma account settings.", permissions: figmaPermissions, waitingLabel: "Waiting for you to finish connecting to Figma\u2026", connectedToastLabel: "Figma connected", successStep: isPresent(mantaSyncPluginPath)
+            ? {
+                title: "Install the Manta Sync plugin",
+                description: "Manta Sync brings campaign plans onto your canvas, with the reasoning behind each change attached.",
+                content: _jsx(MantaSyncPluginStep, { path: mantaSyncPluginPath }),
+            }
+            : undefined }));
+}

package/dist/routes/integrations/components/connect-forms/GmailConnectForm.d.ts

@@ -0,0 +1,3 @@
+import type { ConnectFormProps } from "./types.js";
+export declare function GmailConnectForm(props: ConnectFormProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GmailConnectForm.d.ts.map

package/dist/routes/integrations/components/connect-forms/GmailConnectForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GmailConnectForm.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/GmailConnectForm.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAGhD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,gBAAgB,2CAuBvD"}

package/dist/routes/integrations/components/connect-forms/GmailConnectForm.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { withDatastoreQueryParam } from "@manta-eu/client/shared/datastore-path";
+import { ConnectWizardShell } from "./ConnectWizardShell.js";
+import { useMantaClient } from "#providers/index";
+export function GmailConnectForm(props) {
+    const { onBack, provider } = props;
+    const { datastoreId } = useMantaClient();
+    return (_jsx(ConnectWizardShell, { provider: provider, totalSteps: 1, currentStep: 1, stepTitle: "Connect your Gmail account", stepDescription: "You'll be redirected to Google to grant access, then brought back here.", onBack: onBack, onContinue: () => {
+            window.location.href = withDatastoreQueryParam("/oauth/gmail/start", datastoreId);
+        }, continueLabel: "Continue with Google", children: _jsx("p", { className: "typography-caption text-muted-foreground", children: "Manta requests read-only Gmail access (gmail.readonly) to ingest inbound email into your knowledge graph. You can revoke it any time from your Google account." }) }));
+}

package/dist/routes/integrations/components/connect-forms/GoogleAdsConnectForm.d.ts

@@ -0,0 +1,3 @@
+import type { ConnectFormProps } from "./types.js";
+export declare function GoogleAdsConnectForm(props: ConnectFormProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GoogleAdsConnectForm.d.ts.map

package/dist/routes/integrations/components/connect-forms/GoogleAdsConnectForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GoogleAdsConnectForm.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/GoogleAdsConnectForm.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAqChD,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,gBAAgB,2CAa3D"}

package/dist/routes/integrations/components/connect-forms/GoogleAdsConnectForm.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { GQLIntegration, useGoogleSetupConnectMutation, useGoogleSetupProgressQuery, } from "@manta-eu/client";
+import { useQueryClient } from "@tanstack/react-query";
+import { googleAdsTreeItems } from "./google-ads-account-tree.js";
+import { OAuthSetupConnectForm } from "./OAuthSetupConnectForm.js";
+import { useMantaClient } from "#providers/index";
+const copy = {
+    providerName: "Google Ads",
+    identityProviderName: "Google",
+    entitySingular: "account",
+    entityPlural: "accounts",
+    signInDescription: "We'll take you to Google sign-in so you can grant Manta access to your Google Ads accounts.",
+    pickTitle: "Pick the Google Ads accounts to connect",
+    pickDescription: "Choose the accounts whose campaigns Manta should manage. Manager accounts hold no campaigns, so only their client accounts can be connected.",
+    noEntitiesLabel: "We couldn't find any Google Ads accounts on this Google identity. Sign in with a different account or check your Google Ads access.",
+    noneConnectableLabel: "No connectable Google Ads accounts remain on this Google identity — they are already connected, managers, or unavailable. Sign in with a different Google account to connect a new one.",
+};
+function useGoogleAdsSetup() {
+    const { mantaClient } = useMantaClient();
+    const queryClient = useQueryClient();
+    const progressQuery = useGoogleSetupProgressQuery(mantaClient, undefined, { staleTime: 0 });
+    const connectMutation = useGoogleSetupConnectMutation(mantaClient);
+    const progress = progressQuery.data?.googleSetupProgress;
+    return {
+        progress: progress && { state: progress.state, rows: progress.accounts, lastError: progress.lastError },
+        refetchProgress: progressQuery.refetch,
+        resetProgress: () => queryClient.setQueryData(useGoogleSetupProgressQuery.getKey(), {
+            googleSetupProgress: { state: [], accounts: null, lastError: null },
+        }),
+        connect: (accountIds) => connectMutation.mutateAsync({ accountIds }),
+        isConnecting: connectMutation.isPending,
+    };
+}
+export function GoogleAdsConnectForm(props) {
+    const setup = useGoogleAdsSetup();
+    return (_jsx(OAuthSetupConnectForm, { ...props, integration: GQLIntegration.Google, oauthStartPath: "/oauth/google-ads/start", copy: copy, setup: setup, treeItems: googleAdsTreeItems }));
+}

package/dist/routes/integrations/components/connect-forms/GoogleAnalyticsConnectForm.d.ts

@@ -0,0 +1,3 @@
+import type { ConnectFormProps } from "./types.js";
+export declare function GoogleAnalyticsConnectForm(props: ConnectFormProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GoogleAnalyticsConnectForm.d.ts.map

package/dist/routes/integrations/components/connect-forms/GoogleAnalyticsConnectForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GoogleAnalyticsConnectForm.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/GoogleAnalyticsConnectForm.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAsChD,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,gBAAgB,2CAajE"}

package/dist/routes/integrations/components/connect-forms/GoogleAnalyticsConnectForm.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { GQLIntegration, useGoogleAnalyticsSetupConnectMutation, useGoogleAnalyticsSetupProgressQuery, } from "@manta-eu/client";
+import { useQueryClient } from "@tanstack/react-query";
+import { googleAnalyticsTreeItems } from "./google-analytics-property-tree.js";
+import { OAuthSetupConnectForm } from "./OAuthSetupConnectForm.js";
+import { useMantaClient } from "#providers/index";
+const copy = {
+    providerName: "Google Analytics",
+    identityProviderName: "Google",
+    entitySingular: "property",
+    entityPlural: "properties",
+    signInDescription: "We'll take you to Google sign-in so you can grant Manta access to your Google Analytics properties.",
+    pickTitle: "Pick the GA4 properties to connect",
+    pickDescription: "Choose the properties whose reports Manta should pull. Accounts only group their properties, so only properties can be connected.",
+    noEntitiesLabel: "We couldn't find any Google Analytics properties on this Google identity. Sign in with a different account or check your Google Analytics access.",
+    noneConnectableLabel: "No connectable Google Analytics properties remain on this Google identity — they are already connected or unavailable. Sign in with a different Google account to connect a new one.",
+};
+function useGoogleAnalyticsSetup() {
+    const { mantaClient } = useMantaClient();
+    const queryClient = useQueryClient();
+    const progressQuery = useGoogleAnalyticsSetupProgressQuery(mantaClient, undefined, { staleTime: 0 });
+    const connectMutation = useGoogleAnalyticsSetupConnectMutation(mantaClient);
+    const progress = progressQuery.data?.googleAnalyticsSetupProgress;
+    return {
+        progress: progress && { state: progress.state, rows: progress.properties, lastError: progress.lastError },
+        refetchProgress: progressQuery.refetch,
+        resetProgress: () => queryClient.setQueryData(useGoogleAnalyticsSetupProgressQuery.getKey(), {
+            googleAnalyticsSetupProgress: { state: [], properties: null, lastError: null },
+        }),
+        connect: (propertyIds) => connectMutation.mutateAsync({ propertyIds }),
+        isConnecting: connectMutation.isPending,
+    };
+}
+export function GoogleAnalyticsConnectForm(props) {
+    const setup = useGoogleAnalyticsSetup();
+    return (_jsx(OAuthSetupConnectForm, { ...props, integration: GQLIntegration.GoogleAnalytics, oauthStartPath: "/oauth/google-analytics/start", copy: copy, setup: setup, treeItems: googleAnalyticsTreeItems }));
+}

package/dist/routes/integrations/components/connect-forms/ImportStartedNotice.d.ts

@@ -0,0 +1,21 @@
+import type { ProviderPresentation } from "../../types.js";
+import type { ConnectSuccessStep } from "./OAuthSingleAccountConnectForm.js";
+import type { ImportNotice } from "./types.js";
+export declare function importStartedTitle(providerName: string): string;
+export declare function importStartedSuccessStep(providerName: string, notice: ImportNotice): ConnectSuccessStep;
+type ImportStartedNoticeProps = {
+    providerName: string;
+    notice: ImportNotice;
+};
+export declare function ImportStartedNotice(props: ImportStartedNoticeProps): import("react/jsx-runtime").JSX.Element;
+type ImportStartedStepProps = {
+    provider: ProviderPresentation<string>;
+    notice: ImportNotice;
+    totalSteps: number;
+    onDone: () => void;
+    status?: string;
+    title?: string;
+};
+export declare function ImportStartedStep(props: ImportStartedStepProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ImportStartedNotice.d.ts.map

package/dist/routes/integrations/components/connect-forms/ImportStartedNotice.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImportStartedNotice.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/ImportStartedNotice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAM5C,wBAAgB,kBAAkB,CAAC,YAAY,EAAE,MAAM,GAAG,MAAM,CAE/D;AAMD,wBAAgB,wBAAwB,CAAC,YAAY,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,GAAG,kBAAkB,CAMvG;AAED,KAAK,wBAAwB,GAAG;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,YAAY,CAAC;CACtB,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,2CAYlE;AAED,KAAK,sBAAsB,GAAG;IAC5B,QAAQ,EAAE,oBAAoB,CAAC,MAAM,CAAC,CAAC;IACvC,MAAM,EAAE,YAAY,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,2CA2B9D"}

package/dist/routes/integrations/components/connect-forms/ImportStartedNotice.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ConnectWizardShell } from "./ConnectWizardShell.js";
+import { Button } from "#components/button/index";
+const importTimingNote = "The first import can take a while, depending on how much data there is. You can close this dialog and keep using Manta. Your data will appear once the import finishes.";
+export function importStartedTitle(providerName) {
+    return `Importing your ${providerName} data`;
+}
+function ImportTimingNote() {
+    return _jsx("p", { className: "typography-caption text-muted-foreground", children: importTimingNote });
+}
+export function importStartedSuccessStep(providerName, notice) {
+    return {
+        title: importStartedTitle(providerName),
+        description: notice.description,
+        content: _jsx(ImportTimingNote, {}),
+    };
+}
+export function ImportStartedNotice(props) {
+    const { providerName, notice } = props;
+    return (_jsxs("div", { className: "grid gap-4", children: [_jsxs("div", { className: "grid gap-1", children: [_jsx("h2", { className: "typography-large-body-semibold text-default-foreground", children: importStartedTitle(providerName) }), _jsx("p", { className: "typography-caption text-muted-foreground", children: notice.description })] }), _jsx(ImportTimingNote, {})] }));
+}
+export function ImportStartedStep(props) {
+    const { provider, notice, totalSteps, onDone, status = "Connected", title = importStartedTitle(provider.name), } = props;
+    return (_jsx(ConnectWizardShell, { provider: provider, status: status, totalSteps: totalSteps, currentStep: totalSteps, stepTitle: title, stepDescription: notice.description, primaryAction: _jsx(Button, { variant: "secondary", onClick: onDone, children: "Done" }), children: _jsx(ImportTimingNote, {}) }));
+}

package/dist/routes/integrations/components/connect-forms/InferalCredentialConnectForm.d.ts

@@ -0,0 +1,45 @@
+import { GQLInferalLocation, type GQLInferalProviderInput } from "@manta-eu/client";
+import type { ConnectFormProps, ProviderSetupInstructions, StepConfig } from "./types.js";
+export type CredentialField<Key extends string = string> = {
+    key: Key;
+    label: string;
+    placeholder: string;
+    requiredMessage: string;
+    secret?: boolean;
+    validate?: {
+        check: (value: string) => boolean;
+        message: string;
+    };
+};
+export type CredentialStep<Key extends string = string> = {
+    title: string;
+    description: string;
+    fields: readonly CredentialField<Key>[];
+};
+export type InferalCredentialFormConfig<Key extends string = string> = {
+    providerName: string;
+    fieldIdPrefix: string;
+    identifier: CredentialField<Key> & {
+        stepTitle: string;
+        stepDescription: string;
+    };
+    secrets: CredentialStep<Key>;
+    settings?: CredentialStep<Key>;
+    streamNamePlaceholder: string;
+    locationStepDescription: string;
+    buildProviderInput: (credentials: Record<Key, string>) => GQLInferalProviderInput;
+};
+export declare function fieldId(prefix: string, key: string): string;
+type Values = {
+    streamName: string;
+    location: GQLInferalLocation;
+    [credential: string]: string;
+};
+export declare function shouldAutofillStreamName(changedField: string | undefined, identifierKey: string, streamNameDirty: boolean): boolean;
+export declare function createSteps<Key extends string>(config: InferalCredentialFormConfig<Key>, locationLabels: Readonly<Record<GQLInferalLocation, string>>, setup?: ProviderSetupInstructions): StepConfig<Values>[];
+export type InferalCredentialConnectFormProps<Key extends string> = ConnectFormProps & {
+    config: InferalCredentialFormConfig<Key>;
+};
+export declare function InferalCredentialConnectForm<Key extends string>(props: InferalCredentialConnectFormProps<Key>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=InferalCredentialConnectForm.d.ts.map

package/dist/routes/integrations/components/connect-forms/InferalCredentialConnectForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InferalCredentialConnectForm.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/InferalCredentialConnectForm.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,kBAAkB,EAElB,KAAK,uBAAuB,EAC7B,MAAM,kBAAkB,CAAC;AAW1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,yBAAyB,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAMvF,MAAM,MAAM,eAAe,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,IAAI;IACzD,GAAG,EAAE,GAAG,CAAC;IACT,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,QAAQ,CAAC,EAAE;QAAE,KAAK,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;CACnE,CAAC;AAEF,MAAM,MAAM,cAAc,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,IAAI;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,SAAS,eAAe,CAAC,GAAG,CAAC,EAAE,CAAC;CACzC,CAAC;AAEF,MAAM,MAAM,2BAA2B,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,IAAI;IACrE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,eAAe,CAAC,GAAG,CAAC,GAAG;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,eAAe,EAAE,MAAM,CAAA;KAAE,CAAC;IAClF,OAAO,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC;IAE7B,QAAQ,CAAC,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC;IAC/B,qBAAqB,EAAE,MAAM,CAAC;IAC9B,uBAAuB,EAAE,MAAM,CAAC;IAChC,kBAAkB,EAAE,CAAC,WAAW,EAAE,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,KAAK,uBAAuB,CAAC;CACnF,CAAC;AAKF,wBAAgB,OAAO,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAE3D;AAcD,KAAK,MAAM,GAAG;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,kBAAkB,CAAC;IAAC,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CAAC;AASjG,wBAAgB,wBAAwB,CACtC,YAAY,EAAE,MAAM,GAAG,SAAS,EAChC,aAAa,EAAE,MAAM,EACrB,eAAe,EAAE,OAAO,GACvB,OAAO,CAET;AA6DD,wBAAgB,WAAW,CAAC,GAAG,SAAS,MAAM,EAC5C,MAAM,EAAE,2BAA2B,CAAC,GAAG,CAAC,EACxC,cAAc,EAAE,QAAQ,CAAC,MAAM,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC,EAC5D,KAAK,CAAC,EAAE,yBAAyB,GAChC,UAAU,CAAC,MAAM,CAAC,EAAE,CAqFtB;AAED,MAAM,MAAM,iCAAiC,CAAC,GAAG,SAAS,MAAM,IAAI,gBAAgB,GAAG;IACrF,MAAM,EAAE,2BAA2B,CAAC,GAAG,CAAC,CAAC;CAC1C,CAAC;AAEF,wBAAgB,4BAA4B,CAAC,GAAG,SAAS,MAAM,EAAE,KAAK,EAAE,iCAAiC,CAAC,GAAG,CAAC,2CAmG7G"}