mirror of
https://github.com/sourcebot-dev/sourcebot.git
synced 2025-12-12 04:15:30 +00:00
delete connections components
This commit is contained in:
bkellam
parent
88705f5e7e
commit
cfb359351d
21 changed files with 0 additions and 2206 deletions
|
|
@ -1,110 +0,0 @@
|
||||||
"use client"
|
|
||||||
|
|
||||||
import { BackendError } from "@sourcebot/error";
|
|
||||||
import { Prisma } from "@sourcebot/db";
|
|
||||||
|
|
||||||
export function DisplayConnectionError({ syncStatusMetadata, onSecretsClick }: { syncStatusMetadata: Prisma.JsonValue, onSecretsClick: () => void }) {
|
|
||||||
const errorCode = syncStatusMetadata && typeof syncStatusMetadata === 'object' && 'error' in syncStatusMetadata
|
|
||||||
? (syncStatusMetadata.error as string)
|
|
||||||
: undefined;
|
|
||||||
|
|
||||||
switch (errorCode) {
|
|
||||||
case BackendError.CONNECTION_SYNC_INVALID_TOKEN:
|
|
||||||
return <InvalidTokenError syncStatusMetadata={syncStatusMetadata} onSecretsClick={onSecretsClick} />
|
|
||||||
case BackendError.CONNECTION_SYNC_SECRET_DNE:
|
|
||||||
return <SecretNotFoundError syncStatusMetadata={syncStatusMetadata} onSecretsClick={onSecretsClick} />
|
|
||||||
case BackendError.CONNECTION_SYNC_SYSTEM_ERROR:
|
|
||||||
return <SystemError />
|
|
||||||
case BackendError.CONNECTION_SYNC_FAILED_TO_FETCH_GERRIT_PROJECTS:
|
|
||||||
return <FailedToFetchGerritProjects syncStatusMetadata={syncStatusMetadata} />
|
|
||||||
default:
|
|
||||||
return <UnknownError />
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function SecretNotFoundError({ syncStatusMetadata, onSecretsClick }: { syncStatusMetadata: Prisma.JsonValue, onSecretsClick: () => void }) {
|
|
||||||
const secretKey = syncStatusMetadata && typeof syncStatusMetadata === 'object' && 'secretKey' in syncStatusMetadata
|
|
||||||
? (syncStatusMetadata.secretKey as string)
|
|
||||||
: undefined;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="space-y-1">
|
|
||||||
<h4 className="text-sm font-semibold">Secret Not Found</h4>
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
The secret key provided for this connection was not found. Please ensure your config is referencing a secret
|
|
||||||
that exists in your{" "}
|
|
||||||
<button onClick={onSecretsClick} className="text-primary hover:underline">
|
|
||||||
organization's secrets
|
|
||||||
</button>
|
|
||||||
, and try again.
|
|
||||||
</p>
|
|
||||||
{secretKey && (
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
Secret Key: <span className="text-red-500">{secretKey}</span>
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function InvalidTokenError({ syncStatusMetadata, onSecretsClick }: { syncStatusMetadata: Prisma.JsonValue, onSecretsClick: () => void }) {
|
|
||||||
const secretKey = syncStatusMetadata && typeof syncStatusMetadata === 'object' && 'secretKey' in syncStatusMetadata
|
|
||||||
? (syncStatusMetadata.secretKey as string)
|
|
||||||
: undefined;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="space-y-1">
|
|
||||||
<h4 className="text-sm font-semibold">Invalid Authentication Token</h4>
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
The authentication token provided for this connection is invalid. Please update your config with a valid token and try again.
|
|
||||||
</p>
|
|
||||||
{secretKey && (
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
Secret Key: <button onClick={onSecretsClick} className="text-red-500 hover:underline">{secretKey}</button>
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function SystemError() {
|
|
||||||
return (
|
|
||||||
<div className="space-y-1">
|
|
||||||
<h4 className="text-sm font-semibold">System Error</h4>
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
An error occurred while syncing this connection. Please try again later.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function FailedToFetchGerritProjects({ syncStatusMetadata }: { syncStatusMetadata: Prisma.JsonValue}) {
|
|
||||||
const status = syncStatusMetadata && typeof syncStatusMetadata === 'object' && 'status' in syncStatusMetadata
|
|
||||||
? (syncStatusMetadata.status as number)
|
|
||||||
: undefined;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="space-y-1">
|
|
||||||
<h4 className="text-sm font-semibold">Failed to Fetch Gerrit Projects</h4>
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
An error occurred while syncing this connection. Please try again later.
|
|
||||||
</p>
|
|
||||||
{status && (
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
Status: <span className="text-red-500">{status}</span>
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function UnknownError() {
|
|
||||||
return (
|
|
||||||
<div className="space-y-1">
|
|
||||||
<h4 className="text-sm font-semibold">Unknown Error</h4>
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
An unknown error occurred while syncing this connection. Please try again later.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,100 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import { useCallback, useState } from "react";
|
|
||||||
import {
|
|
||||||
AlertDialog,
|
|
||||||
AlertDialogAction,
|
|
||||||
AlertDialogCancel,
|
|
||||||
AlertDialogContent,
|
|
||||||
AlertDialogDescription,
|
|
||||||
AlertDialogFooter,
|
|
||||||
AlertDialogHeader,
|
|
||||||
AlertDialogTitle,
|
|
||||||
AlertDialogTrigger,
|
|
||||||
} from "@/components/ui/alert-dialog";
|
|
||||||
import { deleteConnection } from "@/actions";
|
|
||||||
import { Loader2 } from "lucide-react";
|
|
||||||
import { isServiceError } from "@/lib/utils";
|
|
||||||
import { useToast } from "@/components/hooks/use-toast";
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { useDomain } from "@/hooks/useDomain";
|
|
||||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
|
||||||
|
|
||||||
interface DeleteConnectionSettingProps {
|
|
||||||
connectionId: number;
|
|
||||||
disabled?: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const DeleteConnectionSetting = ({
|
|
||||||
connectionId,
|
|
||||||
disabled,
|
|
||||||
}: DeleteConnectionSettingProps) => {
|
|
||||||
const [isDialogOpen, setIsDialogOpen] = useState(false);
|
|
||||||
const [isLoading, setIsLoading] = useState(false);
|
|
||||||
const domain = useDomain();
|
|
||||||
const { toast } = useToast();
|
|
||||||
const router = useRouter();
|
|
||||||
const captureEvent = useCaptureEvent();
|
|
||||||
|
|
||||||
const handleDelete = useCallback(() => {
|
|
||||||
setIsDialogOpen(false);
|
|
||||||
setIsLoading(true);
|
|
||||||
deleteConnection(connectionId, domain)
|
|
||||||
.then((response) => {
|
|
||||||
if (isServiceError(response)) {
|
|
||||||
toast({
|
|
||||||
description: `❌ Failed to delete connection. Reason: ${response.message}`
|
|
||||||
});
|
|
||||||
captureEvent('wa_connection_delete_fail', {
|
|
||||||
error: response.errorCode,
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
toast({
|
|
||||||
description: `✅ Connection deleted successfully.`
|
|
||||||
});
|
|
||||||
captureEvent('wa_connection_delete_success', {});
|
|
||||||
router.replace(`/${domain}/connections`);
|
|
||||||
router.refresh();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setIsLoading(false);
|
|
||||||
});
|
|
||||||
}, [connectionId, domain, router, toast, captureEvent]);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex flex-col w-full bg-background border rounded-lg p-6">
|
|
||||||
<h2 className="text-lg font-semibold">Delete Connection</h2>
|
|
||||||
<p className="text-sm text-muted-foreground mt-2">
|
|
||||||
Permanently delete this connection from Sourcebot. All linked repositories that are not linked to any other connection will also be deleted.
|
|
||||||
</p>
|
|
||||||
<div className="flex flex-row justify-end">
|
|
||||||
<AlertDialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
|
|
||||||
<AlertDialogTrigger asChild>
|
|
||||||
<Button
|
|
||||||
variant="destructive"
|
|
||||||
className="mt-4"
|
|
||||||
disabled={isLoading || disabled}
|
|
||||||
>
|
|
||||||
{isLoading && <Loader2 className="animate-spin mr-2" />}
|
|
||||||
Delete
|
|
||||||
</Button>
|
|
||||||
</AlertDialogTrigger>
|
|
||||||
<AlertDialogContent>
|
|
||||||
<AlertDialogHeader>
|
|
||||||
<AlertDialogTitle>Are you sure?</AlertDialogTitle>
|
|
||||||
<AlertDialogDescription>
|
|
||||||
This action cannot be undone.
|
|
||||||
</AlertDialogDescription>
|
|
||||||
</AlertDialogHeader>
|
|
||||||
<AlertDialogFooter>
|
|
||||||
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
|
||||||
<AlertDialogAction onClick={handleDelete}>Yes, delete connection</AlertDialogAction>
|
|
||||||
</AlertDialogFooter>
|
|
||||||
</AlertDialogContent>
|
|
||||||
</AlertDialog>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,100 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { updateConnectionDisplayName } from "@/actions";
|
|
||||||
import { useToast } from "@/components/hooks/use-toast";
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
|
|
||||||
import { Input } from "@/components/ui/input";
|
|
||||||
import { useDomain } from "@/hooks/useDomain";
|
|
||||||
import { isServiceError } from "@/lib/utils";
|
|
||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
|
||||||
import { Loader2 } from "lucide-react";
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { useCallback, useState } from "react";
|
|
||||||
import { useForm } from "react-hook-form";
|
|
||||||
import { z } from "zod";
|
|
||||||
|
|
||||||
const formSchema = z.object({
|
|
||||||
name: z.string().min(1),
|
|
||||||
});
|
|
||||||
|
|
||||||
interface DisplayNameSettingProps {
|
|
||||||
connectionId: number;
|
|
||||||
name: string;
|
|
||||||
disabled?: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const DisplayNameSetting = ({
|
|
||||||
connectionId,
|
|
||||||
name,
|
|
||||||
disabled,
|
|
||||||
}: DisplayNameSettingProps) => {
|
|
||||||
const { toast } = useToast();
|
|
||||||
const router = useRouter();
|
|
||||||
const domain = useDomain();
|
|
||||||
const form = useForm<z.infer<typeof formSchema>>({
|
|
||||||
resolver: zodResolver(formSchema),
|
|
||||||
defaultValues: {
|
|
||||||
name,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const [isLoading, setIsLoading] = useState(false);
|
|
||||||
const onSubmit = useCallback((data: z.infer<typeof formSchema>) => {
|
|
||||||
setIsLoading(true);
|
|
||||||
updateConnectionDisplayName(connectionId, data.name, domain)
|
|
||||||
.then((response) => {
|
|
||||||
if (isServiceError(response)) {
|
|
||||||
toast({
|
|
||||||
description: `❌ Failed to rename connection. Reason: ${response.message}`
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
toast({
|
|
||||||
description: `✅ Connection renamed successfully.`
|
|
||||||
});
|
|
||||||
router.refresh();
|
|
||||||
}
|
|
||||||
}).finally(() => {
|
|
||||||
setIsLoading(false);
|
|
||||||
});
|
|
||||||
}, [connectionId, domain, router, toast]);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex flex-col w-full bg-background border rounded-lg p-6">
|
|
||||||
<Form
|
|
||||||
{...form}
|
|
||||||
>
|
|
||||||
<form onSubmit={form.handleSubmit(onSubmit)}>
|
|
||||||
<FormField
|
|
||||||
control={form.control}
|
|
||||||
name="name"
|
|
||||||
render={({ field }) => (
|
|
||||||
<FormItem>
|
|
||||||
<FormLabel className="text-lg font-semibold">Display Name</FormLabel>
|
|
||||||
{/* @todo : refactor this description into a shared file */}
|
|
||||||
<FormDescription>This is the {`connection's`} display name within Sourcebot. Examples: <b>public-github</b>, <b>self-hosted-gitlab</b>, <b>gerrit-other</b>, etc.</FormDescription>
|
|
||||||
<FormControl className="max-w-lg">
|
|
||||||
<Input
|
|
||||||
{...field}
|
|
||||||
spellCheck={false}
|
|
||||||
/>
|
|
||||||
</FormControl>
|
|
||||||
<FormMessage />
|
|
||||||
</FormItem>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<div className="flex justify-end">
|
|
||||||
<Button
|
|
||||||
size="sm"
|
|
||||||
type="submit"
|
|
||||||
disabled={isLoading || disabled}
|
|
||||||
>
|
|
||||||
{isLoading && <Loader2 className="animate-spin mr-2" />}
|
|
||||||
Save
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</Form>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,80 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { AlertTriangle } from "lucide-react"
|
|
||||||
import { Prisma, ConnectionSyncStatus } from "@sourcebot/db"
|
|
||||||
import { SyncStatusMetadataSchema } from "@/lib/syncStatusMetadataSchema"
|
|
||||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
|
||||||
import { ReloadIcon } from "@radix-ui/react-icons";
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
|
|
||||||
interface NotFoundWarningProps {
|
|
||||||
syncStatus: ConnectionSyncStatus
|
|
||||||
syncStatusMetadata: Prisma.JsonValue
|
|
||||||
onSecretsClick: () => void
|
|
||||||
connectionType: string
|
|
||||||
onRetrySync: () => void
|
|
||||||
}
|
|
||||||
|
|
||||||
export const NotFoundWarning = ({ syncStatus, syncStatusMetadata, onSecretsClick, connectionType, onRetrySync }: NotFoundWarningProps) => {
|
|
||||||
const captureEvent = useCaptureEvent();
|
|
||||||
|
|
||||||
const parseResult = SyncStatusMetadataSchema.safeParse(syncStatusMetadata);
|
|
||||||
if (syncStatus !== ConnectionSyncStatus.SYNCED_WITH_WARNINGS || !parseResult.success || !parseResult.data.notFound) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const { notFound } = parseResult.data;
|
|
||||||
|
|
||||||
if (notFound.users.length === 0 && notFound.orgs.length === 0 && notFound.repos.length === 0) {
|
|
||||||
return null;
|
|
||||||
} else {
|
|
||||||
captureEvent('wa_connection_not_found_warning_displayed', {});
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex flex-col items-start gap-4 border border-yellow-200 dark:border-yellow-800 bg-yellow-50 dark:bg-yellow-900/20 px-5 py-5 text-yellow-700 dark:text-yellow-400 rounded-lg">
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<AlertTriangle className="h-5 w-5 flex-shrink-0" />
|
|
||||||
<h3 className="font-semibold">Unable to fetch all references</h3>
|
|
||||||
</div>
|
|
||||||
<p className="text-sm text-yellow-600/90 dark:text-yellow-300/90 leading-relaxed">
|
|
||||||
Some requested references couldn't be found. Please ensure you've provided the information listed below correctly, and that you've provided a{" "}
|
|
||||||
<button onClick={onSecretsClick} className="text-yellow-500 dark:text-yellow-400 font-bold hover:underline">
|
|
||||||
valid token
|
|
||||||
</button>{" "}
|
|
||||||
to access them if they're private.
|
|
||||||
</p>
|
|
||||||
<ul className="w-full space-y-2 text-sm">
|
|
||||||
{notFound.users.length > 0 && (
|
|
||||||
<li className="flex items-center gap-2 px-3 py-2 bg-yellow-100/50 dark:bg-yellow-900/30 rounded-md border border-yellow-200/50 dark:border-yellow-800/50">
|
|
||||||
<span className="font-medium">Users:</span>
|
|
||||||
<span className="text-yellow-600 dark:text-yellow-300">{notFound.users.join(', ')}</span>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
{notFound.orgs.length > 0 && (
|
|
||||||
<li className="flex items-center gap-2 px-3 py-2 bg-yellow-100/50 dark:bg-yellow-900/30 rounded-md border border-yellow-200/50 dark:border-yellow-800/50">
|
|
||||||
<span className="font-medium">{connectionType === "gitlab" ? "Groups" : "Organizations"}:</span>
|
|
||||||
<span className="text-yellow-600 dark:text-yellow-300">{notFound.orgs.join(', ')}</span>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
{notFound.repos.length > 0 && (
|
|
||||||
<li className="flex items-center gap-2 px-3 py-2 bg-yellow-100/50 dark:bg-yellow-900/30 rounded-md border border-yellow-200/50 dark:border-yellow-800/50">
|
|
||||||
<span className="font-medium">{connectionType === "gitlab" ? "Projects" : "Repositories"}:</span>
|
|
||||||
<span className="text-yellow-600 dark:text-yellow-300">{notFound.repos.join(', ')}</span>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
</ul>
|
|
||||||
<div className="w-full flex justify-center">
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="ml-2"
|
|
||||||
onClick={onRetrySync}
|
|
||||||
>
|
|
||||||
<ReloadIcon className="h-4 w-4 mr-2" />
|
|
||||||
Retry Sync
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,159 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
|
||||||
import { HoverCard, HoverCardContent, HoverCardTrigger } from "@/components/ui/hover-card"
|
|
||||||
import { DisplayConnectionError } from "./connectionError"
|
|
||||||
import { NotFoundWarning } from "./notFoundWarning"
|
|
||||||
import { useDomain } from "@/hooks/useDomain";
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { useCallback } from "react";
|
|
||||||
import { useQuery } from "@tanstack/react-query";
|
|
||||||
import { flagConnectionForSync, getConnectionInfo } from "@/actions";
|
|
||||||
import { isServiceError, unwrapServiceError } from "@/lib/utils";
|
|
||||||
import { env } from "@/env.mjs";
|
|
||||||
import { ConnectionSyncStatus } from "@sourcebot/db";
|
|
||||||
import { FiLoader } from "react-icons/fi";
|
|
||||||
import { CircleCheckIcon, AlertTriangle, CircleXIcon } from "lucide-react";
|
|
||||||
import { Badge } from "@/components/ui/badge";
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import { ReloadIcon } from "@radix-ui/react-icons";
|
|
||||||
import { toast } from "@/components/hooks/use-toast";
|
|
||||||
|
|
||||||
interface OverviewProps {
|
|
||||||
connectionId: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const Overview = ({ connectionId }: OverviewProps) => {
|
|
||||||
const captureEvent = useCaptureEvent();
|
|
||||||
const domain = useDomain();
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const { data: connection, isPending, error, refetch } = useQuery({
|
|
||||||
queryKey: ['connection', domain, connectionId],
|
|
||||||
queryFn: () => unwrapServiceError(getConnectionInfo(connectionId, domain)),
|
|
||||||
refetchInterval: env.NEXT_PUBLIC_POLLING_INTERVAL_MS,
|
|
||||||
});
|
|
||||||
|
|
||||||
const handleSecretsNavigation = useCallback(() => {
|
|
||||||
captureEvent('wa_connection_secrets_navigation_pressed', {});
|
|
||||||
router.push(`/${domain}/secrets`);
|
|
||||||
}, [captureEvent, domain, router]);
|
|
||||||
|
|
||||||
const onRetrySync = useCallback(async () => {
|
|
||||||
const result = await flagConnectionForSync(connectionId, domain);
|
|
||||||
if (isServiceError(result)) {
|
|
||||||
toast({
|
|
||||||
description: `❌ Failed to flag connection for sync.`,
|
|
||||||
});
|
|
||||||
captureEvent('wa_connection_retry_sync_fail', {
|
|
||||||
error: result.errorCode,
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
toast({
|
|
||||||
description: "✅ Connection flagged for sync.",
|
|
||||||
});
|
|
||||||
captureEvent('wa_connection_retry_sync_success', {});
|
|
||||||
refetch();
|
|
||||||
}
|
|
||||||
}, [connectionId, domain, captureEvent, refetch]);
|
|
||||||
|
|
||||||
|
|
||||||
if (error) {
|
|
||||||
return <div className="text-destructive">
|
|
||||||
{`Error loading connection. Reason: ${error.message}`}
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isPending) {
|
|
||||||
return (
|
|
||||||
<div className="grid grid-cols-2 gap-4">
|
|
||||||
{Array.from({ length: 4 }).map((_, i) => (
|
|
||||||
<div key={i} className="rounded-lg border border-border p-4 bg-background">
|
|
||||||
<div className="h-4 w-32 bg-muted rounded animate-pulse" />
|
|
||||||
<div className="mt-2 h-4 w-24 bg-muted rounded animate-pulse" />
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="mt-4 flex flex-col gap-4">
|
|
||||||
<div className="grid grid-cols-2 gap-4">
|
|
||||||
<div className="rounded-lg border border-border p-4 bg-background">
|
|
||||||
<h2 className="text-sm font-medium text-muted-foreground">Connection Type</h2>
|
|
||||||
<p className="mt-2 text-sm">{connection.connectionType}</p>
|
|
||||||
</div>
|
|
||||||
<div className="rounded-lg border border-border p-4 bg-background">
|
|
||||||
<h2 className="text-sm font-medium text-muted-foreground">Last Synced At</h2>
|
|
||||||
<p className="mt-2 text-sm">
|
|
||||||
{connection.syncedAt ? new Date(connection.syncedAt).toLocaleDateString() : "never"}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="rounded-lg border border-border p-4 bg-background">
|
|
||||||
<h2 className="text-sm font-medium text-muted-foreground">Linked Repositories</h2>
|
|
||||||
<p className="mt-2 text-sm">{connection.numLinkedRepos}</p>
|
|
||||||
</div>
|
|
||||||
<div className="rounded-lg border border-border p-4 bg-background">
|
|
||||||
<h2 className="text-sm font-medium text-muted-foreground">Status</h2>
|
|
||||||
<div className="flex items-center gap-2 mt-2">
|
|
||||||
{connection.syncStatus === "FAILED" ? (
|
|
||||||
<HoverCard openDelay={50}>
|
|
||||||
<HoverCardTrigger onMouseEnter={() => captureEvent('wa_connection_failed_status_hover', {})}>
|
|
||||||
<SyncStatusBadge status={connection.syncStatus} />
|
|
||||||
</HoverCardTrigger>
|
|
||||||
<HoverCardContent className="w-80">
|
|
||||||
<DisplayConnectionError
|
|
||||||
syncStatusMetadata={connection.syncStatusMetadata}
|
|
||||||
onSecretsClick={handleSecretsNavigation}
|
|
||||||
/>
|
|
||||||
</HoverCardContent>
|
|
||||||
</HoverCard>
|
|
||||||
) : (
|
|
||||||
<SyncStatusBadge status={connection.syncStatus} />
|
|
||||||
)}
|
|
||||||
{connection.syncStatus === "FAILED" && (
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="ml-2"
|
|
||||||
onClick={onRetrySync}
|
|
||||||
>
|
|
||||||
<ReloadIcon className="h-4 w-4 mr-2" />
|
|
||||||
Retry Sync
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<NotFoundWarning
|
|
||||||
syncStatus={connection.syncStatus}
|
|
||||||
syncStatusMetadata={connection.syncStatusMetadata}
|
|
||||||
onSecretsClick={handleSecretsNavigation}
|
|
||||||
connectionType={connection.connectionType}
|
|
||||||
onRetrySync={onRetrySync}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const SyncStatusBadge = ({ status }: { status: ConnectionSyncStatus }) => {
|
|
||||||
return (
|
|
||||||
<Badge
|
|
||||||
className="select-none px-2 py-1"
|
|
||||||
variant={status === ConnectionSyncStatus.FAILED ? "destructive" : "outline"}
|
|
||||||
>
|
|
||||||
{status === ConnectionSyncStatus.SYNC_NEEDED || status === ConnectionSyncStatus.IN_SYNC_QUEUE ? (
|
|
||||||
<><FiLoader className="w-4 h-4 mr-2 animate-spin-slow" /> Sync queued</>
|
|
||||||
) : status === ConnectionSyncStatus.SYNCING ? (
|
|
||||||
<><FiLoader className="w-4 h-4 mr-2 animate-spin-slow" /> Syncing</>
|
|
||||||
) : status === ConnectionSyncStatus.SYNCED ? (
|
|
||||||
<span className="flex flex-row items-center text-green-700 dark:text-green-400"><CircleCheckIcon className="w-4 h-4 mr-2" /> Synced</span>
|
|
||||||
) : status === ConnectionSyncStatus.SYNCED_WITH_WARNINGS ? (
|
|
||||||
<span className="flex flex-row items-center text-yellow-700 dark:text-yellow-400"><AlertTriangle className="w-4 h-4 mr-2" /> Synced with warnings</span>
|
|
||||||
) : status === ConnectionSyncStatus.FAILED ? (
|
|
||||||
<><CircleXIcon className="w-4 h-4 mr-2" /> Sync failed</>
|
|
||||||
) : null}
|
|
||||||
</Badge>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,229 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { useDomain } from "@/hooks/useDomain";
|
|
||||||
import { useQuery } from "@tanstack/react-query";
|
|
||||||
import { flagReposForIndex, getConnectionInfo, getRepos } from "@/actions";
|
|
||||||
import { RepoListItem } from "./repoListItem";
|
|
||||||
import { isServiceError, unwrapServiceError } from "@/lib/utils";
|
|
||||||
import { ScrollArea } from "@/components/ui/scroll-area";
|
|
||||||
import { ConnectionSyncStatus, RepoIndexingStatus } from "@sourcebot/db";
|
|
||||||
import { Search, Loader2 } from "lucide-react";
|
|
||||||
import { Input } from "@/components/ui/input";
|
|
||||||
import { useCallback, useMemo, useState } from "react";
|
|
||||||
import { RepoListItemSkeleton } from "./repoListItemSkeleton";
|
|
||||||
import { env } from "@/env.mjs";
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { MultiSelect } from "@/components/ui/multi-select";
|
|
||||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
|
||||||
import { useToast } from "@/components/hooks/use-toast";
|
|
||||||
|
|
||||||
interface RepoListProps {
|
|
||||||
connectionId: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
const getPriority = (status: RepoIndexingStatus) => {
|
|
||||||
switch (status) {
|
|
||||||
case RepoIndexingStatus.FAILED:
|
|
||||||
return 0
|
|
||||||
case RepoIndexingStatus.IN_INDEX_QUEUE:
|
|
||||||
case RepoIndexingStatus.INDEXING:
|
|
||||||
return 1
|
|
||||||
case RepoIndexingStatus.INDEXED:
|
|
||||||
return 2
|
|
||||||
default:
|
|
||||||
return 3
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const convertIndexingStatus = (status: RepoIndexingStatus) => {
|
|
||||||
switch (status) {
|
|
||||||
case RepoIndexingStatus.FAILED:
|
|
||||||
return 'failed';
|
|
||||||
case RepoIndexingStatus.NEW:
|
|
||||||
return 'waiting';
|
|
||||||
case RepoIndexingStatus.IN_INDEX_QUEUE:
|
|
||||||
case RepoIndexingStatus.INDEXING:
|
|
||||||
return 'running';
|
|
||||||
case RepoIndexingStatus.INDEXED:
|
|
||||||
return 'succeeded';
|
|
||||||
default:
|
|
||||||
return 'unknown';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export const RepoList = ({ connectionId }: RepoListProps) => {
|
|
||||||
const domain = useDomain();
|
|
||||||
const router = useRouter();
|
|
||||||
const { toast } = useToast();
|
|
||||||
const [searchQuery, setSearchQuery] = useState("");
|
|
||||||
const [selectedStatuses, setSelectedStatuses] = useState<string[]>([]);
|
|
||||||
const captureEvent = useCaptureEvent();
|
|
||||||
const [isRetryAllFailedReposLoading, setIsRetryAllFailedReposLoading] = useState(false);
|
|
||||||
|
|
||||||
const { data: unfilteredRepos, isPending: isReposPending, error: reposError, refetch: refetchRepos } = useQuery({
|
|
||||||
queryKey: ['repos', domain, connectionId],
|
|
||||||
queryFn: async () => {
|
|
||||||
const repos = await unwrapServiceError(getRepos());
|
|
||||||
return repos.sort((a, b) => {
|
|
||||||
const priorityA = getPriority(a.repoIndexingStatus);
|
|
||||||
const priorityB = getPriority(b.repoIndexingStatus);
|
|
||||||
|
|
||||||
// First sort by priority
|
|
||||||
if (priorityA !== priorityB) {
|
|
||||||
return priorityA - priorityB;
|
|
||||||
}
|
|
||||||
|
|
||||||
// If same priority, sort by indexedAt
|
|
||||||
return new Date(a.indexedAt ?? new Date()).getTime() - new Date(b.indexedAt ?? new Date()).getTime();
|
|
||||||
});
|
|
||||||
},
|
|
||||||
refetchInterval: env.NEXT_PUBLIC_POLLING_INTERVAL_MS,
|
|
||||||
});
|
|
||||||
|
|
||||||
const { data: connection, isPending: isConnectionPending, error: isConnectionError } = useQuery({
|
|
||||||
queryKey: ['connection', domain, connectionId],
|
|
||||||
queryFn: () => unwrapServiceError(getConnectionInfo(connectionId, domain)),
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
const failedRepos = useMemo(() => {
|
|
||||||
return unfilteredRepos?.filter((repo) => repo.repoIndexingStatus === RepoIndexingStatus.FAILED) ?? [];
|
|
||||||
}, [unfilteredRepos]);
|
|
||||||
|
|
||||||
|
|
||||||
const onRetryAllFailedRepos = useCallback(() => {
|
|
||||||
if (failedRepos.length === 0) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
setIsRetryAllFailedReposLoading(true);
|
|
||||||
flagReposForIndex(failedRepos.map((repo) => repo.repoId))
|
|
||||||
.then((response) => {
|
|
||||||
if (isServiceError(response)) {
|
|
||||||
captureEvent('wa_connection_retry_all_failed_repos_fail', {});
|
|
||||||
toast({
|
|
||||||
description: `❌ Failed to flag repositories for indexing. Reason: ${response.message}`,
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
captureEvent('wa_connection_retry_all_failed_repos_success', {});
|
|
||||||
toast({
|
|
||||||
description: `✅ ${failedRepos.length} repositories flagged for indexing.`,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.then(() => { refetchRepos() })
|
|
||||||
.finally(() => {
|
|
||||||
setIsRetryAllFailedReposLoading(false);
|
|
||||||
});
|
|
||||||
}, [captureEvent, failedRepos, refetchRepos, toast]);
|
|
||||||
|
|
||||||
const filteredRepos = useMemo(() => {
|
|
||||||
if (isServiceError(unfilteredRepos)) {
|
|
||||||
return unfilteredRepos;
|
|
||||||
}
|
|
||||||
|
|
||||||
const searchLower = searchQuery.toLowerCase();
|
|
||||||
return unfilteredRepos?.filter((repo) => {
|
|
||||||
return repo.repoName.toLowerCase().includes(searchLower);
|
|
||||||
}).filter((repo) => {
|
|
||||||
if (selectedStatuses.length === 0) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
return selectedStatuses.includes(convertIndexingStatus(repo.repoIndexingStatus));
|
|
||||||
});
|
|
||||||
}, [unfilteredRepos, searchQuery, selectedStatuses]);
|
|
||||||
|
|
||||||
if (reposError) {
|
|
||||||
return <div className="text-destructive">
|
|
||||||
{`Error loading repositories. Reason: ${reposError.message}`}
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="space-y-6">
|
|
||||||
<div className="flex gap-4 flex-col sm:flex-row">
|
|
||||||
<div className="relative flex-1">
|
|
||||||
<Search className="absolute left-3 top-2.5 h-4 w-4 text-muted-foreground" />
|
|
||||||
<Input
|
|
||||||
placeholder={`Filter ${isReposPending ? "n" : filteredRepos?.length} ${filteredRepos?.length === 1 ? "repository" : "repositories"} by name`}
|
|
||||||
className="pl-9"
|
|
||||||
value={searchQuery}
|
|
||||||
onChange={(e) => setSearchQuery(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<MultiSelect
|
|
||||||
className="bg-background hover:bg-background w-96"
|
|
||||||
options={[
|
|
||||||
{ value: 'waiting', label: 'Waiting' },
|
|
||||||
{ value: 'running', label: 'Running' },
|
|
||||||
{ value: 'succeeded', label: 'Succeeded' },
|
|
||||||
{ value: 'failed', label: 'Failed' },
|
|
||||||
]}
|
|
||||||
onValueChange={(value) => setSelectedStatuses(value)}
|
|
||||||
defaultValue={[]}
|
|
||||||
placeholder="Filter by status"
|
|
||||||
maxCount={2}
|
|
||||||
animation={0}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{failedRepos.length > 0 && (
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
disabled={isRetryAllFailedReposLoading}
|
|
||||||
onClick={onRetryAllFailedRepos}
|
|
||||||
>
|
|
||||||
{isRetryAllFailedReposLoading && <Loader2 className="w-4 h-4 mr-2 animate-spin" />}
|
|
||||||
Retry All Failed
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<ScrollArea className="mt-4 h-96 pr-4">
|
|
||||||
{isReposPending ? (
|
|
||||||
<div className="flex flex-col gap-4">
|
|
||||||
{Array.from({ length: 3 }).map((_, i) => (
|
|
||||||
<RepoListItemSkeleton key={i} />
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
) : (!filteredRepos || filteredRepos.length === 0) ? (
|
|
||||||
<div className="flex flex-col items-center justify-center h-96 p-4 border rounded-lg">
|
|
||||||
<p className="font-medium text-sm">No Repositories Found</p>
|
|
||||||
<p className="text-sm text-muted-foreground mt-2">
|
|
||||||
{
|
|
||||||
searchQuery.length > 0 ? (
|
|
||||||
<span>No repositories found matching your filters.</span>
|
|
||||||
) : (!isConnectionError && !isConnectionPending && (connection.syncStatus === ConnectionSyncStatus.IN_SYNC_QUEUE || connection.syncStatus === ConnectionSyncStatus.SYNCING || connection.syncStatus === ConnectionSyncStatus.SYNC_NEEDED)) ? (
|
|
||||||
<span>Repositories are being synced. Please check back soon.</span>
|
|
||||||
) : (
|
|
||||||
<Button
|
|
||||||
onClick={() => {
|
|
||||||
router.push(`?tab=settings`)
|
|
||||||
}}
|
|
||||||
variant="outline"
|
|
||||||
>
|
|
||||||
Configure connection
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div className="flex flex-col gap-4">
|
|
||||||
{filteredRepos?.map((repo) => (
|
|
||||||
<RepoListItem
|
|
||||||
key={repo.repoId}
|
|
||||||
imageUrl={repo.imageUrl}
|
|
||||||
name={repo.repoName}
|
|
||||||
indexedAt={repo.indexedAt}
|
|
||||||
status={repo.repoIndexingStatus}
|
|
||||||
repoId={repo.repoId}
|
|
||||||
domain={domain}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</ScrollArea>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,113 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { getDisplayTime, getRepoImageSrc } from "@/lib/utils";
|
|
||||||
import Image from "next/image";
|
|
||||||
import { StatusIcon } from "../../components/statusIcon";
|
|
||||||
import { RepoIndexingStatus } from "@sourcebot/db";
|
|
||||||
import { useMemo } from "react";
|
|
||||||
import { RetryRepoIndexButton } from "./repoRetryIndexButton";
|
|
||||||
|
|
||||||
|
|
||||||
interface RepoListItemProps {
|
|
||||||
name: string;
|
|
||||||
status: RepoIndexingStatus;
|
|
||||||
imageUrl?: string;
|
|
||||||
indexedAt?: Date;
|
|
||||||
repoId: number;
|
|
||||||
domain: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const RepoListItem = ({
|
|
||||||
imageUrl,
|
|
||||||
name,
|
|
||||||
indexedAt,
|
|
||||||
status,
|
|
||||||
repoId,
|
|
||||||
domain,
|
|
||||||
}: RepoListItemProps) => {
|
|
||||||
const statusDisplayName = useMemo(() => {
|
|
||||||
switch (status) {
|
|
||||||
case RepoIndexingStatus.NEW:
|
|
||||||
return 'Waiting...';
|
|
||||||
case RepoIndexingStatus.IN_INDEX_QUEUE:
|
|
||||||
return 'In index queue...';
|
|
||||||
case RepoIndexingStatus.INDEXING:
|
|
||||||
return 'Indexing...';
|
|
||||||
case RepoIndexingStatus.INDEXED:
|
|
||||||
return 'Indexed';
|
|
||||||
case RepoIndexingStatus.FAILED:
|
|
||||||
return 'Index failed';
|
|
||||||
case RepoIndexingStatus.IN_GC_QUEUE:
|
|
||||||
return 'In garbage collection queue...';
|
|
||||||
case RepoIndexingStatus.GARBAGE_COLLECTING:
|
|
||||||
return 'Garbage collecting...';
|
|
||||||
case RepoIndexingStatus.GARBAGE_COLLECTION_FAILED:
|
|
||||||
return 'Garbage collection failed';
|
|
||||||
}
|
|
||||||
}, [status]);
|
|
||||||
|
|
||||||
const imageSrc = getRepoImageSrc(imageUrl, repoId, domain);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="flex flex-row items-center p-4 border rounded-lg bg-background justify-between"
|
|
||||||
>
|
|
||||||
<div className="flex flex-row items-center gap-2">
|
|
||||||
{imageSrc ? (
|
|
||||||
<Image
|
|
||||||
src={imageSrc}
|
|
||||||
alt={name}
|
|
||||||
width={32}
|
|
||||||
height={32}
|
|
||||||
className="object-cover"
|
|
||||||
/>
|
|
||||||
) : (
|
|
||||||
<div className="h-8 w-8 flex items-center justify-center bg-muted text-xs font-medium uppercase text-muted-foreground rounded-md">
|
|
||||||
{name.charAt(0)}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<p className="font-medium">{name}</p>
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-row items-center gap-4">
|
|
||||||
{status === RepoIndexingStatus.FAILED && (
|
|
||||||
<RetryRepoIndexButton repoId={repoId} />
|
|
||||||
)}
|
|
||||||
<div className="flex flex-row items-center gap-0">
|
|
||||||
<StatusIcon
|
|
||||||
status={convertIndexingStatus(status)}
|
|
||||||
className="w-4 h-4 mr-1"
|
|
||||||
/>
|
|
||||||
<p className="text-sm">
|
|
||||||
<span>{statusDisplayName}</span>
|
|
||||||
{
|
|
||||||
(
|
|
||||||
status === RepoIndexingStatus.INDEXED ||
|
|
||||||
status === RepoIndexingStatus.FAILED
|
|
||||||
) && indexedAt && (
|
|
||||||
<span>{` ${getDisplayTime(indexedAt)}`}</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const convertIndexingStatus = (status: RepoIndexingStatus) => {
|
|
||||||
switch (status) {
|
|
||||||
case RepoIndexingStatus.NEW:
|
|
||||||
return 'waiting';
|
|
||||||
case RepoIndexingStatus.IN_INDEX_QUEUE:
|
|
||||||
case RepoIndexingStatus.INDEXING:
|
|
||||||
return 'running';
|
|
||||||
case RepoIndexingStatus.IN_GC_QUEUE:
|
|
||||||
case RepoIndexingStatus.GARBAGE_COLLECTING:
|
|
||||||
return "garbage-collecting"
|
|
||||||
case RepoIndexingStatus.INDEXED:
|
|
||||||
return 'succeeded';
|
|
||||||
case RepoIndexingStatus.GARBAGE_COLLECTION_FAILED:
|
|
||||||
case RepoIndexingStatus.FAILED:
|
|
||||||
return 'failed';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { Skeleton } from "@/components/ui/skeleton"
|
|
||||||
|
|
||||||
export const RepoListItemSkeleton = () => {
|
|
||||||
return (
|
|
||||||
<div className="flex flex-row items-center p-4 border rounded-lg bg-background justify-between">
|
|
||||||
<div className="flex flex-row items-center gap-2">
|
|
||||||
<Skeleton className="h-10 w-10 rounded-full animate-pulse" />
|
|
||||||
<Skeleton className="h-4 w-32 animate-pulse" />
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-row items-center gap-2">
|
|
||||||
<Skeleton className="h-4 w-24 animate-pulse" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,43 +0,0 @@
|
||||||
"use client";
|
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import { ReloadIcon } from "@radix-ui/react-icons"
|
|
||||||
import { toast } from "@/components/hooks/use-toast";
|
|
||||||
import { flagReposForIndex } from "@/actions";
|
|
||||||
import { isServiceError } from "@/lib/utils";
|
|
||||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
|
||||||
|
|
||||||
interface RetryRepoIndexButtonProps {
|
|
||||||
repoId: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const RetryRepoIndexButton = ({ repoId }: RetryRepoIndexButtonProps) => {
|
|
||||||
const captureEvent = useCaptureEvent();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="ml-2"
|
|
||||||
onClick={async () => {
|
|
||||||
const result = await flagReposForIndex([repoId]);
|
|
||||||
if (isServiceError(result)) {
|
|
||||||
toast({
|
|
||||||
description: `❌ Failed to flag repository for indexing.`,
|
|
||||||
});
|
|
||||||
captureEvent('wa_repo_retry_index_fail', {
|
|
||||||
error: result.errorCode,
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
toast({
|
|
||||||
description: "✅ Repository flagged for indexing.",
|
|
||||||
});
|
|
||||||
captureEvent('wa_repo_retry_index_success', {});
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<ReloadIcon className="h-4 w-4 mr-2" />
|
|
||||||
Retry Index
|
|
||||||
</Button>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
@ -1,63 +0,0 @@
|
||||||
import { NotFound } from "@/app/[domain]/components/notFound"
|
|
||||||
import {
|
|
||||||
Breadcrumb,
|
|
||||||
BreadcrumbItem,
|
|
||||||
BreadcrumbLink,
|
|
||||||
BreadcrumbList,
|
|
||||||
BreadcrumbPage,
|
|
||||||
BreadcrumbSeparator,
|
|
||||||
} from "@/components/ui/breadcrumb"
|
|
||||||
import { ConnectionIcon } from "../components/connectionIcon"
|
|
||||||
import { Header } from "../../components/header"
|
|
||||||
import { RepoList } from "./components/repoList"
|
|
||||||
import { getConnectionByDomain } from "@/data/connection"
|
|
||||||
import { Overview } from "./components/overview"
|
|
||||||
|
|
||||||
interface ConnectionManagementPageProps {
|
|
||||||
params: Promise<{
|
|
||||||
domain: string
|
|
||||||
id: string
|
|
||||||
}>,
|
|
||||||
}
|
|
||||||
|
|
||||||
export default async function ConnectionManagementPage(props: ConnectionManagementPageProps) {
|
|
||||||
const params = await props.params;
|
|
||||||
const connection = await getConnectionByDomain(Number(params.id), params.domain);
|
|
||||||
if (!connection) {
|
|
||||||
return <NotFound className="flex w-full h-full items-center justify-center" message="Connection not found" />
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<Header>
|
|
||||||
<Breadcrumb>
|
|
||||||
<BreadcrumbList>
|
|
||||||
<BreadcrumbItem>
|
|
||||||
<BreadcrumbLink href={`/${params.domain}/connections`}>Connections</BreadcrumbLink>
|
|
||||||
</BreadcrumbItem>
|
|
||||||
<BreadcrumbSeparator />
|
|
||||||
<BreadcrumbItem>
|
|
||||||
<BreadcrumbPage>{connection.name}</BreadcrumbPage>
|
|
||||||
</BreadcrumbItem>
|
|
||||||
</BreadcrumbList>
|
|
||||||
</Breadcrumb>
|
|
||||||
<div className="mt-6 flex items-center gap-3">
|
|
||||||
<ConnectionIcon type={connection.connectionType} />
|
|
||||||
<h1 className="text-3xl font-semibold">{connection.name}</h1>
|
|
||||||
</div>
|
|
||||||
</Header>
|
|
||||||
|
|
||||||
<div className="space-y-8">
|
|
||||||
<div>
|
|
||||||
<h2 className="text-lg font-medium mb-4">Overview</h2>
|
|
||||||
<Overview connectionId={connection.id} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<h2 className="text-lg font-medium mb-4">Linked Repositories</h2>
|
|
||||||
<RepoList connectionId={connection.id} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,38 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { cn, CodeHostType, getCodeHostIcon } from "@/lib/utils";
|
|
||||||
import { useMemo } from "react";
|
|
||||||
import Image from "next/image";
|
|
||||||
import placeholderLogo from "@/public/placeholder_avatar.png";
|
|
||||||
|
|
||||||
interface ConnectionIconProps {
|
|
||||||
type: string;
|
|
||||||
className?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const ConnectionIcon = ({
|
|
||||||
type,
|
|
||||||
className,
|
|
||||||
}: ConnectionIconProps) => {
|
|
||||||
const Icon = useMemo(() => {
|
|
||||||
const iconInfo = getCodeHostIcon(type as CodeHostType);
|
|
||||||
if (iconInfo) {
|
|
||||||
return (
|
|
||||||
<Image
|
|
||||||
src={iconInfo.src}
|
|
||||||
className={cn(cn("rounded-full w-8 h-8", iconInfo.className), className)}
|
|
||||||
alt={`${type} logo`}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return <Image
|
|
||||||
src={placeholderLogo}
|
|
||||||
alt={''}
|
|
||||||
className={cn("rounded-full w-8 h-8", className)}
|
|
||||||
/>
|
|
||||||
|
|
||||||
}, [className, type]);
|
|
||||||
|
|
||||||
return Icon;
|
|
||||||
}
|
|
||||||
|
|
@ -1,120 +0,0 @@
|
||||||
import { getDisplayTime } from "@/lib/utils";
|
|
||||||
import { useMemo } from "react";
|
|
||||||
import { ConnectionIcon } from "../connectionIcon";
|
|
||||||
import { ConnectionSyncStatus, Prisma } from "@sourcebot/db";
|
|
||||||
import { StatusIcon } from "../statusIcon";
|
|
||||||
import { ConnectionListItemErrorIndicator } from "./connectionListItemErrorIndicator";
|
|
||||||
import { ConnectionListItemWarningIndicator } from "./connectionListItemWarningIndicator";
|
|
||||||
import { ConnectionListItemManageButton } from "./connectionListItemManageButton";
|
|
||||||
|
|
||||||
const convertSyncStatus = (status: ConnectionSyncStatus) => {
|
|
||||||
switch (status) {
|
|
||||||
case ConnectionSyncStatus.SYNC_NEEDED:
|
|
||||||
return 'waiting';
|
|
||||||
case ConnectionSyncStatus.IN_SYNC_QUEUE:
|
|
||||||
case ConnectionSyncStatus.SYNCING:
|
|
||||||
return 'running';
|
|
||||||
case ConnectionSyncStatus.SYNCED:
|
|
||||||
return 'succeeded';
|
|
||||||
case ConnectionSyncStatus.SYNCED_WITH_WARNINGS:
|
|
||||||
return 'succeeded-with-warnings';
|
|
||||||
case ConnectionSyncStatus.FAILED:
|
|
||||||
return 'failed';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
interface ConnectionListItemProps {
|
|
||||||
id: string;
|
|
||||||
name: string;
|
|
||||||
type: string;
|
|
||||||
status: ConnectionSyncStatus;
|
|
||||||
syncStatusMetadata: Prisma.JsonValue;
|
|
||||||
editedAt: Date;
|
|
||||||
syncedAt?: Date;
|
|
||||||
failedRepos?: { repoId: number, repoName: string }[];
|
|
||||||
disabled: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const ConnectionListItem = ({
|
|
||||||
id,
|
|
||||||
name,
|
|
||||||
type,
|
|
||||||
status,
|
|
||||||
syncStatusMetadata,
|
|
||||||
editedAt,
|
|
||||||
syncedAt,
|
|
||||||
failedRepos,
|
|
||||||
disabled,
|
|
||||||
}: ConnectionListItemProps) => {
|
|
||||||
const statusDisplayName = useMemo(() => {
|
|
||||||
switch (status) {
|
|
||||||
case ConnectionSyncStatus.SYNC_NEEDED:
|
|
||||||
return 'Waiting...';
|
|
||||||
case ConnectionSyncStatus.IN_SYNC_QUEUE:
|
|
||||||
case ConnectionSyncStatus.SYNCING:
|
|
||||||
return 'Syncing...';
|
|
||||||
case ConnectionSyncStatus.SYNCED:
|
|
||||||
return 'Synced';
|
|
||||||
case ConnectionSyncStatus.FAILED:
|
|
||||||
return 'Sync failed';
|
|
||||||
case ConnectionSyncStatus.SYNCED_WITH_WARNINGS:
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
}, [status]);
|
|
||||||
|
|
||||||
const { notFoundData, displayNotFoundWarning } = useMemo(() => {
|
|
||||||
if (!syncStatusMetadata || typeof syncStatusMetadata !== 'object' || !('notFound' in syncStatusMetadata)) {
|
|
||||||
return { notFoundData: null, displayNotFoundWarning: false };
|
|
||||||
}
|
|
||||||
|
|
||||||
const notFoundData = syncStatusMetadata.notFound as {
|
|
||||||
users: string[],
|
|
||||||
orgs: string[],
|
|
||||||
repos: string[],
|
|
||||||
}
|
|
||||||
|
|
||||||
return { notFoundData, displayNotFoundWarning: notFoundData.users.length > 0 || notFoundData.orgs.length > 0 || notFoundData.repos.length > 0 };
|
|
||||||
}, [syncStatusMetadata]);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="flex flex-row justify-between items-center border p-4 rounded-lg bg-background"
|
|
||||||
>
|
|
||||||
<div className="flex flex-row items-center gap-3">
|
|
||||||
<ConnectionIcon
|
|
||||||
type={type}
|
|
||||||
className="w-8 h-8"
|
|
||||||
/>
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<p className="font-medium">{name}</p>
|
|
||||||
<span className="text-sm text-muted-foreground">{`Edited ${getDisplayTime(editedAt)}`}</span>
|
|
||||||
</div>
|
|
||||||
<ConnectionListItemErrorIndicator failedRepos={failedRepos} connectionId={id} />
|
|
||||||
<ConnectionListItemWarningIndicator
|
|
||||||
notFoundData={notFoundData}
|
|
||||||
connectionId={id}
|
|
||||||
type={type}
|
|
||||||
displayWarning={displayNotFoundWarning}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-row items-center">
|
|
||||||
<StatusIcon
|
|
||||||
status={convertSyncStatus(status)}
|
|
||||||
className="w-4 h-4 mr-1"
|
|
||||||
/>
|
|
||||||
<p className="text-sm">
|
|
||||||
<span>{statusDisplayName}</span>
|
|
||||||
{
|
|
||||||
(
|
|
||||||
status === ConnectionSyncStatus.SYNCED ||
|
|
||||||
status === ConnectionSyncStatus.FAILED
|
|
||||||
) && syncedAt && (
|
|
||||||
<span>{` ${getDisplayTime(syncedAt)}`}</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
</p>
|
|
||||||
<ConnectionListItemManageButton id={id} disabled={disabled} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,62 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { HoverCard, HoverCardContent, HoverCardTrigger } from "@/components/ui/hover-card";
|
|
||||||
import { CircleX } from "lucide-react";
|
|
||||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
|
||||||
|
|
||||||
interface ConnectionListItemErrorIndicatorProps {
|
|
||||||
failedRepos: { repoId: number; repoName: string; }[] | undefined;
|
|
||||||
connectionId: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const ConnectionListItemErrorIndicator = ({
|
|
||||||
failedRepos,
|
|
||||||
connectionId
|
|
||||||
}: ConnectionListItemErrorIndicatorProps) => {
|
|
||||||
const captureEvent = useCaptureEvent()
|
|
||||||
|
|
||||||
if (!failedRepos || failedRepos.length === 0) return null;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<HoverCard openDelay={50}>
|
|
||||||
<HoverCardTrigger asChild>
|
|
||||||
<CircleX
|
|
||||||
className="h-5 w-5 text-red-700 dark:text-red-400 cursor-help hover:text-red-600 dark:hover:text-red-300 transition-colors"
|
|
||||||
onClick={() => {
|
|
||||||
captureEvent('wa_connection_list_item_error_pressed', {})
|
|
||||||
window.location.href = `connections/${connectionId}`
|
|
||||||
}}
|
|
||||||
onMouseEnter={() => captureEvent('wa_connection_list_item_error_hover', {})}
|
|
||||||
/>
|
|
||||||
</HoverCardTrigger>
|
|
||||||
<HoverCardContent className="w-80 border border-red-200 dark:border-red-800 rounded-lg">
|
|
||||||
<div className="flex flex-col space-y-3">
|
|
||||||
<div className="flex items-center gap-2 pb-2 border-b border-red-200 dark:border-red-800">
|
|
||||||
<CircleX className="h-4 w-4 text-red-700 dark:text-red-400" />
|
|
||||||
<h3 className="text-sm font-semibold text-red-700 dark:text-red-400">Failed to Index Repositories</h3>
|
|
||||||
</div>
|
|
||||||
<div className="text-sm text-red-600/90 dark:text-red-300/90 space-y-3">
|
|
||||||
<p>
|
|
||||||
{failedRepos.length} {failedRepos.length === 1 ? 'repository' : 'repositories'} failed to index. This is likely due to temporary server load.
|
|
||||||
</p>
|
|
||||||
<div className="space-y-2 text-sm bg-red-50 dark:bg-red-900/20 rounded-md p-3 border border-red-200/50 dark:border-red-800/50">
|
|
||||||
<div className="flex flex-col gap-1.5">
|
|
||||||
{failedRepos.slice(0, 10).map(repo => (
|
|
||||||
<span key={repo.repoId} className="text-red-700 dark:text-red-300">{repo.repoName}</span>
|
|
||||||
))}
|
|
||||||
{failedRepos.length > 10 && (
|
|
||||||
<span className="text-red-600/75 dark:text-red-400/75 text-xs pt-1">
|
|
||||||
And {failedRepos.length - 10} more...
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<p className="text-xs">
|
|
||||||
Navigate to the connection for more details and to retry indexing.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</HoverCardContent>
|
|
||||||
</HoverCard>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
@ -1,37 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { useDomain } from "@/hooks/useDomain";
|
|
||||||
|
|
||||||
interface ConnectionListItemManageButtonProps {
|
|
||||||
id: string;
|
|
||||||
disabled: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const ConnectionListItemManageButton = ({
|
|
||||||
id,
|
|
||||||
disabled,
|
|
||||||
}: ConnectionListItemManageButtonProps) => {
|
|
||||||
const captureEvent = useCaptureEvent()
|
|
||||||
const router = useRouter();
|
|
||||||
const domain = useDomain();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size={"sm"}
|
|
||||||
className="ml-4"
|
|
||||||
disabled={disabled}
|
|
||||||
onClick={() => {
|
|
||||||
if (!disabled) {
|
|
||||||
captureEvent('wa_connection_list_item_manage_pressed', {})
|
|
||||||
router.push(`/${domain}/connections/${id}`)
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Manage
|
|
||||||
</Button>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
@ -1,78 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { HoverCard, HoverCardContent, HoverCardTrigger } from "@/components/ui/hover-card";
|
|
||||||
import { AlertTriangle } from "lucide-react";
|
|
||||||
import { NotFoundData } from "@/lib/syncStatusMetadataSchema";
|
|
||||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
|
||||||
|
|
||||||
|
|
||||||
interface ConnectionListItemWarningIndicatorProps {
|
|
||||||
notFoundData: NotFoundData | null;
|
|
||||||
connectionId: string;
|
|
||||||
type: string;
|
|
||||||
displayWarning: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const ConnectionListItemWarningIndicator = ({
|
|
||||||
notFoundData,
|
|
||||||
connectionId,
|
|
||||||
type,
|
|
||||||
displayWarning
|
|
||||||
}: ConnectionListItemWarningIndicatorProps) => {
|
|
||||||
const captureEvent = useCaptureEvent()
|
|
||||||
|
|
||||||
if (!notFoundData || !displayWarning) return null;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<HoverCard openDelay={50}>
|
|
||||||
<HoverCardTrigger asChild>
|
|
||||||
<AlertTriangle
|
|
||||||
className="h-5 w-5 text-yellow-700 dark:text-yellow-400 cursor-help hover:text-yellow-600 dark:hover:text-yellow-300 transition-colors"
|
|
||||||
onClick={() => {
|
|
||||||
captureEvent('wa_connection_list_item_warning_pressed', {})
|
|
||||||
window.location.href = `connections/${connectionId}`
|
|
||||||
}}
|
|
||||||
onMouseEnter={() => captureEvent('wa_connection_list_item_warning_hover', {})}
|
|
||||||
/>
|
|
||||||
</HoverCardTrigger>
|
|
||||||
<HoverCardContent className="w-80 border border-yellow-200 dark:border-yellow-800 rounded-lg">
|
|
||||||
<div className="flex flex-col space-y-3">
|
|
||||||
<div className="flex items-center gap-2 pb-2 border-b border-yellow-200 dark:border-yellow-800">
|
|
||||||
<AlertTriangle className="h-4 w-4 text-yellow-700 dark:text-yellow-400" />
|
|
||||||
<h3 className="text-sm font-semibold text-yellow-700 dark:text-yellow-400">Unable to fetch all references</h3>
|
|
||||||
</div>
|
|
||||||
<p className="text-sm text-yellow-600/90 dark:text-yellow-300/90">
|
|
||||||
Some requested references couldn't be found. Verify the details below and ensure your connection is using a {" "}
|
|
||||||
<button
|
|
||||||
onClick={() => window.location.href = `secrets`}
|
|
||||||
className="font-medium text-yellow-700 dark:text-yellow-400 hover:text-yellow-600 dark:hover:text-yellow-300 transition-colors"
|
|
||||||
>
|
|
||||||
valid access token
|
|
||||||
</button>{" "}
|
|
||||||
that has access to any private references.
|
|
||||||
</p>
|
|
||||||
<ul className="space-y-2 text-sm bg-yellow-50 dark:bg-yellow-900/20 rounded-md p-3 border border-yellow-200/50 dark:border-yellow-800/50">
|
|
||||||
{notFoundData.users.length > 0 && (
|
|
||||||
<li className="flex items-center gap-2">
|
|
||||||
<span className="font-medium text-yellow-700 dark:text-yellow-400">Users:</span>
|
|
||||||
<span className="text-yellow-700 dark:text-yellow-300">{notFoundData.users.join(', ')}</span>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
{notFoundData.orgs.length > 0 && (
|
|
||||||
<li className="flex items-center gap-2">
|
|
||||||
<span className="font-medium text-yellow-700 dark:text-yellow-400">{type === "gitlab" ? "Groups" : "Organizations"}:</span>
|
|
||||||
<span className="text-yellow-700 dark:text-yellow-300">{notFoundData.orgs.join(', ')}</span>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
{notFoundData.repos.length > 0 && (
|
|
||||||
<li className="flex items-center gap-2">
|
|
||||||
<span className="font-medium text-yellow-700 dark:text-yellow-400">{type === "gitlab" ? "Projects" : "Repositories"}:</span>
|
|
||||||
<span className="text-yellow-700 dark:text-yellow-300">{notFoundData.repos.join(', ')}</span>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</HoverCardContent>
|
|
||||||
</HoverCard>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
@ -1,144 +0,0 @@
|
||||||
"use client";
|
|
||||||
import { useDomain } from "@/hooks/useDomain";
|
|
||||||
import { ConnectionListItem } from "./connectionListItem";
|
|
||||||
import { cn, unwrapServiceError } from "@/lib/utils";
|
|
||||||
import { InfoCircledIcon } from "@radix-ui/react-icons";
|
|
||||||
import { getConnections } from "@/actions";
|
|
||||||
import { Skeleton } from "@/components/ui/skeleton";
|
|
||||||
import { useQuery } from "@tanstack/react-query";
|
|
||||||
import { env } from "@/env.mjs";
|
|
||||||
import { RepoIndexingStatus, ConnectionSyncStatus } from "@sourcebot/db";
|
|
||||||
import { Search } from "lucide-react";
|
|
||||||
import { Input } from "@/components/ui/input";
|
|
||||||
import { useMemo, useState } from "react";
|
|
||||||
import { MultiSelect } from "@/components/ui/multi-select";
|
|
||||||
|
|
||||||
interface ConnectionListProps {
|
|
||||||
className?: string;
|
|
||||||
isDisabled: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
const convertSyncStatus = (status: ConnectionSyncStatus) => {
|
|
||||||
switch (status) {
|
|
||||||
case ConnectionSyncStatus.SYNC_NEEDED:
|
|
||||||
return 'waiting';
|
|
||||||
case ConnectionSyncStatus.SYNCING:
|
|
||||||
return 'running';
|
|
||||||
case ConnectionSyncStatus.SYNCED:
|
|
||||||
return 'succeeded';
|
|
||||||
case ConnectionSyncStatus.SYNCED_WITH_WARNINGS:
|
|
||||||
return 'synced-with-warnings';
|
|
||||||
case ConnectionSyncStatus.FAILED:
|
|
||||||
return 'failed';
|
|
||||||
default:
|
|
||||||
return 'unknown';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export const ConnectionList = ({
|
|
||||||
className,
|
|
||||||
isDisabled,
|
|
||||||
}: ConnectionListProps) => {
|
|
||||||
const domain = useDomain();
|
|
||||||
const [searchQuery, setSearchQuery] = useState("");
|
|
||||||
const [selectedStatuses, setSelectedStatuses] = useState<string[]>([]);
|
|
||||||
|
|
||||||
const { data: unfilteredConnections, isPending, error } = useQuery({
|
|
||||||
queryKey: ['connections', domain],
|
|
||||||
queryFn: () => unwrapServiceError(getConnections(domain)),
|
|
||||||
refetchInterval: env.NEXT_PUBLIC_POLLING_INTERVAL_MS,
|
|
||||||
});
|
|
||||||
|
|
||||||
const connections = useMemo(() => {
|
|
||||||
return unfilteredConnections
|
|
||||||
?.filter((connection) => connection.name.toLowerCase().includes(searchQuery.toLowerCase()))
|
|
||||||
.filter((connection) => {
|
|
||||||
if (selectedStatuses.length === 0) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
return selectedStatuses.includes(convertSyncStatus(connection.syncStatus));
|
|
||||||
})
|
|
||||||
.sort((a, b) => b.updatedAt.getTime() - a.updatedAt.getTime()) ?? [];
|
|
||||||
}, [unfilteredConnections, searchQuery, selectedStatuses]);
|
|
||||||
|
|
||||||
if (error) {
|
|
||||||
return <div className="flex flex-col items-center justify-center border rounded-md p-4 h-full">
|
|
||||||
<p>Error loading connections: {error.message}</p>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={cn("flex flex-col gap-4", className)}>
|
|
||||||
<div className="flex gap-4 flex-col sm:flex-row">
|
|
||||||
<div className="relative flex-1">
|
|
||||||
<Search className="absolute left-3 top-2.5 h-4 w-4 text-muted-foreground" />
|
|
||||||
<Input
|
|
||||||
placeholder={`Filter ${isPending ? "n" : connections.length} ${connections.length === 1 ? "connection" : "connections"} by name`}
|
|
||||||
className="pl-9"
|
|
||||||
value={searchQuery}
|
|
||||||
onChange={(e) => setSearchQuery(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<MultiSelect
|
|
||||||
className="bg-background hover:bg-background w-56"
|
|
||||||
options={[
|
|
||||||
{ value: 'waiting', label: 'Waiting' },
|
|
||||||
{ value: 'running', label: 'Syncing' },
|
|
||||||
{ value: 'succeeded', label: 'Synced' },
|
|
||||||
{ value: 'synced-with-warnings', label: 'Warnings' },
|
|
||||||
{ value: 'failed', label: 'Failed' },
|
|
||||||
]}
|
|
||||||
onValueChange={(value) => setSelectedStatuses(value)}
|
|
||||||
defaultValue={[]}
|
|
||||||
placeholder="Filter by status"
|
|
||||||
maxCount={2}
|
|
||||||
animation={0}
|
|
||||||
/>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{isPending ? (
|
|
||||||
// Skeleton for loading state
|
|
||||||
<div className="flex flex-col gap-4">
|
|
||||||
{Array.from({ length: 3 }).map((_, i) => (
|
|
||||||
<div key={i} className="flex items-center gap-4 border rounded-md p-4">
|
|
||||||
<Skeleton className="w-8 h-8 rounded-full" />
|
|
||||||
<div className="flex-1 space-y-2">
|
|
||||||
<Skeleton className="h-4 w-1/4" />
|
|
||||||
<Skeleton className="h-3 w-1/3" />
|
|
||||||
</div>
|
|
||||||
<Skeleton className="w-24 h-8" />
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
) : connections.length > 0 ? (
|
|
||||||
connections
|
|
||||||
.sort((a, b) => b.updatedAt.getTime() - a.updatedAt.getTime())
|
|
||||||
.map((connection) => (
|
|
||||||
<ConnectionListItem
|
|
||||||
key={connection.id}
|
|
||||||
id={connection.id.toString()}
|
|
||||||
name={connection.name}
|
|
||||||
type={connection.connectionType}
|
|
||||||
status={connection.syncStatus}
|
|
||||||
syncStatusMetadata={connection.syncStatusMetadata}
|
|
||||||
editedAt={connection.updatedAt}
|
|
||||||
syncedAt={connection.syncedAt ?? undefined}
|
|
||||||
failedRepos={connection.linkedRepos.filter((repo) => repo.repoIndexingStatus === RepoIndexingStatus.FAILED).map((repo) => ({
|
|
||||||
repoId: repo.id,
|
|
||||||
repoName: repo.name,
|
|
||||||
}))}
|
|
||||||
disabled={isDisabled}
|
|
||||||
/>
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<div className="flex flex-col items-center justify-center border rounded-md p-4 h-full">
|
|
||||||
<InfoCircledIcon className="w-7 h-7" />
|
|
||||||
<h2 className="mt-2 font-medium">No connections</h2>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
@ -1,29 +0,0 @@
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
import { CircleCheckIcon, CircleXIcon } from "lucide-react";
|
|
||||||
import { useMemo } from "react";
|
|
||||||
import { FiLoader } from "react-icons/fi";
|
|
||||||
|
|
||||||
export type Status = 'waiting' | 'running' | 'succeeded' | 'succeeded-with-warnings' | 'garbage-collecting' | 'failed';
|
|
||||||
|
|
||||||
export const StatusIcon = ({
|
|
||||||
status,
|
|
||||||
className,
|
|
||||||
}: { status: Status, className?: string }) => {
|
|
||||||
const Icon = useMemo(() => {
|
|
||||||
switch (status) {
|
|
||||||
case 'waiting':
|
|
||||||
case 'garbage-collecting':
|
|
||||||
case 'running':
|
|
||||||
return <FiLoader className={cn('animate-spin-slow', className)} />;
|
|
||||||
case 'succeeded':
|
|
||||||
return <CircleCheckIcon className={cn('text-green-600', className)} />;
|
|
||||||
case 'failed':
|
|
||||||
return <CircleXIcon className={cn('text-destructive', className)} />;
|
|
||||||
case 'succeeded-with-warnings':
|
|
||||||
default:
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
}, [className, status]);
|
|
||||||
|
|
||||||
return Icon;
|
|
||||||
}
|
|
||||||
|
|
@ -1,36 +0,0 @@
|
||||||
import { auth } from "@/auth";
|
|
||||||
import { NavigationMenu } from "../components/navigationMenu";
|
|
||||||
import { redirect } from "next/navigation";
|
|
||||||
|
|
||||||
interface LayoutProps {
|
|
||||||
children: React.ReactNode;
|
|
||||||
params: Promise<{ domain: string }>;
|
|
||||||
}
|
|
||||||
|
|
||||||
export default async function Layout(
|
|
||||||
props: LayoutProps
|
|
||||||
) {
|
|
||||||
const params = await props.params;
|
|
||||||
|
|
||||||
const {
|
|
||||||
domain
|
|
||||||
} = params;
|
|
||||||
|
|
||||||
const {
|
|
||||||
children
|
|
||||||
} = props;
|
|
||||||
|
|
||||||
const session = await auth();
|
|
||||||
if (!session) {
|
|
||||||
return redirect(`/${domain}`);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="min-h-screen flex flex-col">
|
|
||||||
<NavigationMenu domain={domain} />
|
|
||||||
<main className="flex-grow flex justify-center p-4 bg-backgroundSecondary relative">
|
|
||||||
<div className="w-full max-w-6xl p-6">{children}</div>
|
|
||||||
</main>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,35 +0,0 @@
|
||||||
import { ConnectionList } from "./components/connectionList";
|
|
||||||
import { Header } from "../components/header";
|
|
||||||
import { getConnections, getOrgMembership } from "@/actions";
|
|
||||||
import { isServiceError } from "@/lib/utils";
|
|
||||||
import { notFound, ServiceErrorException } from "@/lib/serviceError";
|
|
||||||
import { OrgRole } from "@sourcebot/db";
|
|
||||||
|
|
||||||
export default async function ConnectionsPage(props: { params: Promise<{ domain: string }> }) {
|
|
||||||
const params = await props.params;
|
|
||||||
|
|
||||||
const {
|
|
||||||
domain
|
|
||||||
} = params;
|
|
||||||
|
|
||||||
const connections = await getConnections(domain);
|
|
||||||
if (isServiceError(connections)) {
|
|
||||||
throw new ServiceErrorException(connections);
|
|
||||||
}
|
|
||||||
|
|
||||||
const membership = await getOrgMembership(domain);
|
|
||||||
if (isServiceError(membership)) {
|
|
||||||
throw new ServiceErrorException(notFound());
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<Header>
|
|
||||||
<h1 className="text-3xl">Connections</h1>
|
|
||||||
</Header>
|
|
||||||
<ConnectionList
|
|
||||||
isDisabled={membership.role !== OrgRole.OWNER}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
@ -1,575 +0,0 @@
|
||||||
import { GithubConnectionConfig } from "@sourcebot/schemas/v3/github.type"
|
|
||||||
import { GitlabConnectionConfig } from "@sourcebot/schemas/v3/gitlab.type";
|
|
||||||
import { BitbucketConnectionConfig } from "@sourcebot/schemas/v3/bitbucket.type";
|
|
||||||
import { QuickAction } from "../components/configEditor";
|
|
||||||
import { GiteaConnectionConfig } from "@sourcebot/schemas/v3/gitea.type";
|
|
||||||
import { GerritConnectionConfig } from "@sourcebot/schemas/v3/gerrit.type";
|
|
||||||
import { CodeSnippet } from "@/app/components/codeSnippet";
|
|
||||||
|
|
||||||
export const githubQuickActions: QuickAction<GithubConnectionConfig>[] = [
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
repos: [
|
|
||||||
...(previous.repos ?? []),
|
|
||||||
"<owner>/<repo name>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a single repo",
|
|
||||||
selectionText: "<owner>/<repo name>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a individual repository to sync with. Ensure the repository is visible to the provided <CodeSnippet>token</CodeSnippet> (if any).</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"sourcebot/sourcebot",
|
|
||||||
"vercel/next.js",
|
|
||||||
"torvalds/linux"
|
|
||||||
].map((repo) => (
|
|
||||||
<CodeSnippet key={repo}>{repo}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
orgs: [
|
|
||||||
...(previous.orgs ?? []),
|
|
||||||
"<organization name>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add an organization",
|
|
||||||
selectionText: "<organization name>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add an organization to sync with. All repositories in the organization visible to the provided <CodeSnippet>token</CodeSnippet> (if any) will be synced.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-row gap-1 items-center">
|
|
||||||
{[
|
|
||||||
"commaai",
|
|
||||||
"sourcebot",
|
|
||||||
"vercel"
|
|
||||||
].map((org) => (
|
|
||||||
<CodeSnippet key={org}>{org}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
users: [
|
|
||||||
...(previous.users ?? []),
|
|
||||||
"<username>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a user",
|
|
||||||
selectionText: "<username>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a user to sync with. All repositories that the user owns visible to the provided <CodeSnippet>token</CodeSnippet> (if any) will be synced.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-row gap-1 items-center">
|
|
||||||
{[
|
|
||||||
"jane-doe",
|
|
||||||
"torvalds",
|
|
||||||
"octocat"
|
|
||||||
].map((org) => (
|
|
||||||
<CodeSnippet key={org}>{org}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
url: previous.url ?? "https://github.example.com",
|
|
||||||
}),
|
|
||||||
name: "Set url to GitHub instance",
|
|
||||||
selectionText: "https://github.example.com",
|
|
||||||
description: <span>Set a custom GitHub host. Defaults to <CodeSnippet>https://github.com</CodeSnippet>.</span>
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
repos: [
|
|
||||||
...(previous.exclude?.repos ?? []),
|
|
||||||
"<glob pattern>"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude by repo name",
|
|
||||||
selectionText: "<glob pattern>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Exclude repositories from syncing by name. Glob patterns are supported.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"my-org/docs*",
|
|
||||||
"my-org/test*"
|
|
||||||
].map((repo) => (
|
|
||||||
<CodeSnippet key={repo}>{repo}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
topics: [
|
|
||||||
...(previous.exclude?.topics ?? []),
|
|
||||||
"<topic>"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude by topic",
|
|
||||||
selectionText: "<topic>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Exclude topics from syncing. Only repos that do not match any of the provided topics will be synced. Glob patterns are supported.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"docs",
|
|
||||||
"ci"
|
|
||||||
].map((repo) => (
|
|
||||||
<CodeSnippet key={repo}>{repo}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
topics: [
|
|
||||||
...(previous.topics ?? []),
|
|
||||||
"<topic>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Include by topic",
|
|
||||||
selectionText: "<topic>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Include repositories by topic. Only repos that match at least one of the provided topics will be synced. Glob patterns are supported.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"docs",
|
|
||||||
"ci"
|
|
||||||
].map((repo) => (
|
|
||||||
<CodeSnippet key={repo}>{repo}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
archived: true,
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude archived repos",
|
|
||||||
description: <span>Exclude archived repositories from syncing.</span>
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GithubConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
forks: true,
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude forked repos",
|
|
||||||
description: <span>Exclude forked repositories from syncing.</span>
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
export const gitlabQuickActions: QuickAction<GitlabConnectionConfig>[] = [
|
|
||||||
{
|
|
||||||
fn: (previous: GitlabConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
projects: [
|
|
||||||
...previous.projects ?? [],
|
|
||||||
"<project name>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a project",
|
|
||||||
selectionText: "<project name>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a individual project to sync with. Ensure the project is visible to the provided <CodeSnippet>token</CodeSnippet> (if any).</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"gitlab-org/gitlab",
|
|
||||||
"corp/team-project",
|
|
||||||
].map((repo) => (
|
|
||||||
<CodeSnippet key={repo}>{repo}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GitlabConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
users: [
|
|
||||||
...previous.users ?? [],
|
|
||||||
"<username>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a user",
|
|
||||||
selectionText: "<username>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a user to sync with. All projects that the user owns visible to the provided <CodeSnippet>token</CodeSnippet> (if any) will be synced.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-row gap-1 items-center">
|
|
||||||
{[
|
|
||||||
"jane-doe",
|
|
||||||
"torvalds"
|
|
||||||
].map((org) => (
|
|
||||||
<CodeSnippet key={org}>{org}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GitlabConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
groups: [
|
|
||||||
...previous.groups ?? [],
|
|
||||||
"<group name>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a group",
|
|
||||||
selectionText: "<group name>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a group to sync with. All projects in the group (and recursive subgroups) visible to the provided <CodeSnippet>token</CodeSnippet> (if any) will be synced.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"my-group",
|
|
||||||
"path/to/subgroup"
|
|
||||||
].map((org) => (
|
|
||||||
<CodeSnippet key={org}>{org}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GitlabConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
url: previous.url ?? "https://gitlab.example.com",
|
|
||||||
}),
|
|
||||||
name: "Set url to GitLab instance",
|
|
||||||
selectionText: "https://gitlab.example.com",
|
|
||||||
description: <span>Set a custom GitLab host. Defaults to <CodeSnippet>https://gitlab.com</CodeSnippet>.</span>
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GitlabConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
all: true,
|
|
||||||
}),
|
|
||||||
name: "Sync all projects",
|
|
||||||
description: <span>Sync all projects visible to the provided <CodeSnippet>token</CodeSnippet> (if any). Only available when using a self-hosted GitLab instance.</span>
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GitlabConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
projects: [
|
|
||||||
...(previous.exclude?.projects ?? []),
|
|
||||||
"<glob pattern>"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude a project",
|
|
||||||
selectionText: "<glob pattern>",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>List of projects to exclude from syncing. Glob patterns are supported.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"docs/**",
|
|
||||||
"**/tests/**",
|
|
||||||
].map((repo) => (
|
|
||||||
<CodeSnippet key={repo}>{repo}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
export const giteaQuickActions: QuickAction<GiteaConnectionConfig>[] = [
|
|
||||||
{
|
|
||||||
fn: (previous: GiteaConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
orgs: [
|
|
||||||
...(previous.orgs ?? []),
|
|
||||||
"<organization name>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add an organization",
|
|
||||||
selectionText: "<organization name>",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GiteaConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
repos: [
|
|
||||||
...(previous.repos ?? []),
|
|
||||||
"<owner>/<repo name>"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a repo",
|
|
||||||
selectionText: "<owner>/<repo name>",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GiteaConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
url: previous.url ?? "https://gitea.example.com",
|
|
||||||
}),
|
|
||||||
name: "Set url to Gitea instance",
|
|
||||||
selectionText: "https://gitea.example.com",
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
export const gerritQuickActions: QuickAction<GerritConnectionConfig>[] = [
|
|
||||||
{
|
|
||||||
fn: (previous: GerritConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
projects: [
|
|
||||||
...(previous.projects ?? []),
|
|
||||||
""
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a project",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: GerritConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
projects: [
|
|
||||||
...(previous.exclude?.projects ?? []),
|
|
||||||
""
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude a project",
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
export const bitbucketCloudQuickActions: QuickAction<BitbucketConnectionConfig>[] = [
|
|
||||||
{
|
|
||||||
// add user
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
user: previous.user ?? "username"
|
|
||||||
}),
|
|
||||||
name: "Add username",
|
|
||||||
selectionText: "username",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Username to use for authentication. This is only required if you're using an App Password (stored in <CodeSnippet>token</CodeSnippet>) for authentication.</span>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
workspaces: [
|
|
||||||
...(previous.workspaces ?? []),
|
|
||||||
"myWorkspace"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a workspace",
|
|
||||||
selectionText: "myWorkspace",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a workspace to sync with. Ensure the workspace is visible to the provided <CodeSnippet>token</CodeSnippet> (if any).</span>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
repos: [
|
|
||||||
...(previous.repos ?? []),
|
|
||||||
"myWorkspace/myRepo"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a repo",
|
|
||||||
selectionText: "myWorkspace/myRepo",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add an individual repository to sync with. Ensure the repository is visible to the provided <CodeSnippet>token</CodeSnippet> (if any).</span>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
projects: [
|
|
||||||
...(previous.projects ?? []),
|
|
||||||
"myProject"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a project",
|
|
||||||
selectionText: "myProject",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a project to sync with. Ensure the project is visible to the provided <CodeSnippet>token</CodeSnippet> (if any).</span>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
repos: [...(previous.exclude?.repos ?? []), "myWorkspace/myExcludedRepo"]
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude a repo",
|
|
||||||
selectionText: "myWorkspace/myExcludedRepo",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Exclude a repository from syncing. Glob patterns are supported.</span>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
// exclude forked
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
forks: true
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude forked repos",
|
|
||||||
description: <span>Exclude forked repositories from syncing.</span>
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
export const bitbucketDataCenterQuickActions: QuickAction<BitbucketConnectionConfig>[] = [
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
url: previous.url ?? "https://bitbucket.example.com",
|
|
||||||
}),
|
|
||||||
name: "Set url to Bitbucket DC instance",
|
|
||||||
selectionText: "https://bitbucket.example.com",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
repos: [
|
|
||||||
...(previous.repos ?? []),
|
|
||||||
"myProject/myRepo"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a repo",
|
|
||||||
selectionText: "myProject/myRepo",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a individual repository to sync with. Ensure the repository is visible to the provided <CodeSnippet>token</CodeSnippet> (if any).</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"PROJ/repo-name",
|
|
||||||
"MYPROJ/api"
|
|
||||||
].map((repo) => (
|
|
||||||
<CodeSnippet key={repo}>{repo}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
projects: [
|
|
||||||
...(previous.projects ?? []),
|
|
||||||
"myProject"
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
name: "Add a project",
|
|
||||||
selectionText: "myProject",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Add a project to sync with. Ensure the project is visible to the provided <CodeSnippet>token</CodeSnippet> (if any).</span>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
repos: [...(previous.exclude?.repos ?? []), "myProject/myExcludedRepo"]
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude a repo",
|
|
||||||
selectionText: "myProject/myExcludedRepo",
|
|
||||||
description: (
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<span>Exclude a repository from syncing. Glob patterns are supported.</span>
|
|
||||||
<span className="text-sm mt-2 mb-1">Examples:</span>
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{[
|
|
||||||
"myProject/myExcludedRepo",
|
|
||||||
"myProject2/*"
|
|
||||||
].map((repo) => (
|
|
||||||
<CodeSnippet key={repo}>{repo}</CodeSnippet>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
// exclude archived
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
archived: true
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude archived repos",
|
|
||||||
},
|
|
||||||
// exclude forked
|
|
||||||
{
|
|
||||||
fn: (previous: BitbucketConnectionConfig) => ({
|
|
||||||
...previous,
|
|
||||||
exclude: {
|
|
||||||
...previous.exclude,
|
|
||||||
forks: true
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
name: "Exclude forked repos",
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
|
|
@ -1,40 +0,0 @@
|
||||||
import Ajv, { Schema } from "ajv";
|
|
||||||
import { z } from "zod";
|
|
||||||
|
|
||||||
export const createZodConnectionConfigValidator = <T>(jsonSchema: Schema, additionalConfigValidation?: (config: T) => { message: string, isValid: boolean }) => {
|
|
||||||
const ajv = new Ajv({
|
|
||||||
validateFormats: false,
|
|
||||||
});
|
|
||||||
const validate = ajv.compile(jsonSchema);
|
|
||||||
|
|
||||||
return z
|
|
||||||
.string()
|
|
||||||
.superRefine((data, ctx) => {
|
|
||||||
const addIssue = (message: string) => {
|
|
||||||
return ctx.addIssue({
|
|
||||||
code: "custom",
|
|
||||||
message: `Schema validation error: ${message}`
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
let parsed;
|
|
||||||
try {
|
|
||||||
parsed = JSON.parse(data);
|
|
||||||
} catch {
|
|
||||||
addIssue("Invalid JSON");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const valid = validate(parsed);
|
|
||||||
if (!valid) {
|
|
||||||
addIssue(ajv.errorsText(validate.errors));
|
|
||||||
}
|
|
||||||
|
|
||||||
if (additionalConfigValidation) {
|
|
||||||
const result = additionalConfigValidation(parsed as T);
|
|
||||||
if (!result.isValid) {
|
|
||||||
addIssue(result.message);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
Loading…
Reference in a new issue