mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-05-01 03:46:25 +02:00
refactor: connector icon handling by centralizing icon retrieval in contracts.
This commit is contained in:
parent
8f1fba52b4
commit
b33c2904a6
25 changed files with 318 additions and 310 deletions
|
|
@ -1,44 +1,12 @@
|
|||
"use client";
|
||||
|
||||
import {
|
||||
IconBook,
|
||||
IconBrandDiscord,
|
||||
IconBrandGithub,
|
||||
IconBrandNotion,
|
||||
IconBrandSlack,
|
||||
IconBrandYoutube,
|
||||
IconCalendar,
|
||||
IconChecklist,
|
||||
IconLayoutKanban,
|
||||
IconMail,
|
||||
IconTable,
|
||||
IconTicket,
|
||||
} from "@tabler/icons-react";
|
||||
import { File, Globe, Webhook } from "lucide-react";
|
||||
import type React from "react";
|
||||
import { getConnectorIcon } from "@/contracts/enums/connectorIcons";
|
||||
|
||||
type IconComponent = React.ComponentType<{ size?: number; className?: string }>;
|
||||
|
||||
const documentTypeIcons: Record<string, IconComponent> = {
|
||||
EXTENSION: Webhook,
|
||||
CRAWLED_URL: Globe,
|
||||
SLACK_CONNECTOR: IconBrandSlack,
|
||||
NOTION_CONNECTOR: IconBrandNotion,
|
||||
FILE: File,
|
||||
YOUTUBE_VIDEO: IconBrandYoutube,
|
||||
GITHUB_CONNECTOR: IconBrandGithub,
|
||||
LINEAR_CONNECTOR: IconLayoutKanban,
|
||||
JIRA_CONNECTOR: IconTicket,
|
||||
DISCORD_CONNECTOR: IconBrandDiscord,
|
||||
CONFLUENCE_CONNECTOR: IconBook,
|
||||
CLICKUP_CONNECTOR: IconChecklist,
|
||||
GOOGLE_CALENDAR_CONNECTOR: IconCalendar,
|
||||
GOOGLE_GMAIL_CONNECTOR: IconMail,
|
||||
AIRTABLE_CONNECTOR: IconTable,
|
||||
};
|
||||
|
||||
export function getDocumentTypeIcon(type: string): IconComponent {
|
||||
return documentTypeIcons[type] ?? File;
|
||||
export function getDocumentTypeIcon(type: string): React.ReactNode {
|
||||
return getConnectorIcon(type);
|
||||
}
|
||||
|
||||
export function getDocumentTypeLabel(type: string): string {
|
||||
|
|
@ -49,7 +17,7 @@ export function getDocumentTypeLabel(type: string): string {
|
|||
}
|
||||
|
||||
export function DocumentTypeChip({ type, className }: { type: string; className?: string }) {
|
||||
const Icon = getDocumentTypeIcon(type);
|
||||
const icon = getDocumentTypeIcon(type);
|
||||
return (
|
||||
<span
|
||||
className={
|
||||
|
|
@ -57,7 +25,7 @@ export function DocumentTypeChip({ type, className }: { type: string; className?
|
|||
(className ?? "")
|
||||
}
|
||||
>
|
||||
<Icon size={14} className="text-primary" />
|
||||
<span className="text-primary">{icon}</span>
|
||||
{getDocumentTypeLabel(type)}
|
||||
</span>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -197,7 +197,7 @@ export function DocumentsTableShell({
|
|||
</TableHeader>
|
||||
<TableBody>
|
||||
{sorted.map((doc, index) => {
|
||||
const Icon = getDocumentTypeIcon(doc.document_type);
|
||||
const icon = getDocumentTypeIcon(doc.document_type);
|
||||
const title = doc.title;
|
||||
const truncatedTitle = title.length > 30 ? `${title.slice(0, 30)}...` : title;
|
||||
return (
|
||||
|
|
@ -235,7 +235,7 @@ export function DocumentsTableShell({
|
|||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<span className="flex items-center gap-2">
|
||||
<Icon size={16} className="text-muted-foreground shrink-0" />
|
||||
<span className="text-muted-foreground shrink-0">{icon}</span>
|
||||
<span>{truncatedTitle}</span>
|
||||
</span>
|
||||
</TooltipTrigger>
|
||||
|
|
@ -293,7 +293,7 @@ export function DocumentsTableShell({
|
|||
</div>
|
||||
<div className="md:hidden divide-y">
|
||||
{sorted.map((doc) => {
|
||||
const Icon = getDocumentTypeIcon(doc.document_type);
|
||||
const icon = getDocumentTypeIcon(doc.document_type);
|
||||
return (
|
||||
<div key={doc.id} className="p-3">
|
||||
<div className="flex items-start gap-3">
|
||||
|
|
@ -305,7 +305,7 @@ export function DocumentsTableShell({
|
|||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<div className="flex items-center gap-2 min-w-0">
|
||||
<Icon size={16} className="text-muted-foreground shrink-0" />
|
||||
<span className="text-muted-foreground shrink-0">{icon}</span>
|
||||
<div className="font-medium truncate">{doc.title}</div>
|
||||
</div>
|
||||
<RowActions
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue