70 lines
1.8 KiB
TypeScript
70 lines
1.8 KiB
TypeScript
"use client";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card, CardContent } from "@/components/ui/card";
|
|
import { Plus } from "lucide-react";
|
|
import { CloudProvider } from "./types";
|
|
|
|
interface PickerHeaderProps {
|
|
provider: CloudProvider;
|
|
onAddFiles: () => void;
|
|
isPickerLoaded: boolean;
|
|
isPickerOpen: boolean;
|
|
accessToken?: string;
|
|
isAuthenticated: boolean;
|
|
}
|
|
|
|
const getProviderName = (provider: CloudProvider): string => {
|
|
switch (provider) {
|
|
case "google_drive":
|
|
return "Google Drive";
|
|
case "onedrive":
|
|
return "OneDrive";
|
|
case "sharepoint":
|
|
return "SharePoint";
|
|
default:
|
|
return "Cloud Storage";
|
|
}
|
|
};
|
|
|
|
export const PickerHeader = ({
|
|
provider,
|
|
onAddFiles,
|
|
isPickerLoaded,
|
|
isPickerOpen,
|
|
accessToken,
|
|
isAuthenticated,
|
|
}: PickerHeaderProps) => {
|
|
if (!isAuthenticated) {
|
|
return (
|
|
<div className="text-sm text-muted-foreground p-4 bg-muted/20 rounded-md">
|
|
Please connect to {getProviderName(provider)} first to select specific
|
|
files.
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Card>
|
|
<CardContent className="flex flex-col items-center text-center py-8">
|
|
<p className="text-sm text-primary mb-4">
|
|
Select files from {getProviderName(provider)} to ingest.
|
|
</p>
|
|
<Button
|
|
size="sm"
|
|
onClick={onAddFiles}
|
|
disabled={!isPickerLoaded || isPickerOpen || !accessToken}
|
|
className="bg-foreground text-background hover:bg-foreground/90 font-semibold"
|
|
>
|
|
<Plus className="h-4 w-4" />
|
|
Add Files
|
|
</Button>
|
|
<div className="text-xs text-muted-foreground pt-4">
|
|
csv, json, pdf,{" "}
|
|
<a className="underline dark:text-pink-400 text-pink-600">+16 more</a>{" "}
|
|
<b>150 MB</b> max
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
};
|