mirror of
https://github.com/khoj-ai/khoj.git
synced 2024-11-23 15:38:55 +01:00
Consolidate file name to icon mapping
This commit is contained in:
parent
8805e731fd
commit
ae4eb96d48
4 changed files with 11 additions and 123 deletions
|
@ -50,8 +50,10 @@ import {
|
|||
Broadcast,
|
||||
KeyReturn,
|
||||
FilePdf,
|
||||
FileMd,
|
||||
MicrosoftWordLogo,
|
||||
} from "@phosphor-icons/react";
|
||||
import { Markdown, OrgMode, Pdf, Word } from "@/app/components/logo/fileLogo";
|
||||
import { OrgMode } from "@/app/components/logo/fileLogo";
|
||||
|
||||
interface IconMap {
|
||||
[key: string]: (color: string, width: string, height: string) => JSX.Element | null;
|
||||
|
@ -217,13 +219,6 @@ export function getIconForSlashCommand(command: string, customClassName: string
|
|||
return <ArrowRight className={className} />;
|
||||
}
|
||||
|
||||
export function getIconFromFileType(fileType: string) {
|
||||
if (fileType == "pdf") {
|
||||
return <FilePdf className="w-6 h-6 text-muted-foreground inline-flex mr-1" />;
|
||||
}
|
||||
return <File className="w-6 h-6 text-muted-foreground inline-flex mr-1" />;
|
||||
}
|
||||
|
||||
function getIconFromIconName(
|
||||
iconName: string,
|
||||
color: string = "gray",
|
||||
|
@ -246,11 +241,12 @@ function getIconFromFilename(
|
|||
return <OrgMode className={className} />;
|
||||
case "markdown":
|
||||
case "md":
|
||||
return <Markdown className={className} />;
|
||||
return <FileMd className={className} />;
|
||||
case "pdf":
|
||||
return <Pdf className={className} />;
|
||||
return <FilePdf className={className} />;
|
||||
case "doc":
|
||||
return <Word className={className} />;
|
||||
case "docx":
|
||||
return <MicrosoftWordLogo className={className} />;
|
||||
case "jpg":
|
||||
case "jpeg":
|
||||
case "png":
|
||||
|
|
|
@ -41,7 +41,7 @@ import { convertColorToTextClass, convertToBGClass } from "@/app/common/colorUti
|
|||
|
||||
import LoginPrompt from "../loginPrompt/loginPrompt";
|
||||
import { InlineLoading } from "../loading/loading";
|
||||
import { getIconForSlashCommand, getIconFromFileType } from "@/app/common/iconUtils";
|
||||
import { getIconForSlashCommand, getIconFromFilename } from "@/app/common/iconUtils";
|
||||
import { packageFilesForUpload } from "@/app/common/chatFunctions";
|
||||
import { convertBytesToText } from "@/app/common/utils";
|
||||
import {
|
||||
|
@ -549,7 +549,7 @@ export const ChatInputArea = forwardRef<HTMLTextAreaElement, ChatInputProps>((pr
|
|||
{file.name}
|
||||
</span>
|
||||
<span className="flex items-center gap-1">
|
||||
{getIconFromFileType(file.file_type)}
|
||||
{getIconFromFilename(file.file_type)}
|
||||
<span className="text-xs text-neutral-500 dark:text-neutral-400">
|
||||
{convertBytesToText(file.size)}
|
||||
</span>
|
||||
|
|
|
@ -51,7 +51,7 @@ import {
|
|||
import { DialogTitle } from "@radix-ui/react-dialog";
|
||||
import { convertBytesToText } from "@/app/common/utils";
|
||||
import { ScrollArea } from "@/components/ui/scroll-area";
|
||||
import { getIconFromFileType } from "@/app/common/iconUtils";
|
||||
import { getIconFromFilename } from "@/app/common/iconUtils";
|
||||
|
||||
const md = new markdownIt({
|
||||
html: true,
|
||||
|
@ -714,7 +714,7 @@ const ChatMessage = forwardRef<HTMLDivElement, ChatMessageProps>((props, ref) =>
|
|||
<Dialog key={index}>
|
||||
<DialogTrigger>
|
||||
<div className="flex items-center space-x-2 cursor-pointer bg-gray-500 bg-opacity-25 rounded-lg m-1 p-2 w-full">
|
||||
{getIconFromFileType(file.file_type)}
|
||||
{getIconFromFilename(file.file_type)}
|
||||
<span className="truncate">{file.name}</span>
|
||||
{file.size && (
|
||||
<span className="text-gray-400">
|
||||
|
|
|
@ -81,111 +81,3 @@ export function OrgMode({ className }: { className?: string }) {
|
|||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
export function Markdown({ className }: { className?: string }) {
|
||||
const classes = className ?? "w-6 h-6 text-muted-foreground inline-flex mr-1";
|
||||
return (
|
||||
<svg
|
||||
className={`${classes}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="208"
|
||||
height="128"
|
||||
viewBox="0 0 208 128"
|
||||
>
|
||||
<rect
|
||||
width="198"
|
||||
height="118"
|
||||
x="5"
|
||||
y="5"
|
||||
ry="10"
|
||||
stroke="#000"
|
||||
strokeWidth="10"
|
||||
fill="none"
|
||||
/>
|
||||
<path d="M30 98V30h20l20 25 20-25h20v68H90V59L70 84 50 59v39zm125 0l-30-33h20V30h20v35h20z" />
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
export function Pdf({ className }: { className?: string }) {
|
||||
const classes = className ?? "w-6 h-6 text-muted-foreground inline-flex mr-1";
|
||||
return (
|
||||
<svg
|
||||
className={`${classes}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
enableBackground="new 0 0 334.371 380.563"
|
||||
version="1.1"
|
||||
viewBox="0 0 14 16"
|
||||
>
|
||||
<g transform="matrix(.04589 0 0 .04589 -.66877 -.73379)">
|
||||
<polygon
|
||||
points="51.791 356.65 51.791 23.99 204.5 23.99 282.65 102.07 282.65 356.65"
|
||||
fill="#fff"
|
||||
strokeWidth="212.65"
|
||||
/>
|
||||
<path
|
||||
d="m201.19 31.99 73.46 73.393v243.26h-214.86v-316.66h141.4m6.623-16h-164.02v348.66h246.85v-265.9z"
|
||||
strokeWidth="21.791"
|
||||
/>
|
||||
</g>
|
||||
<g transform="matrix(.04589 0 0 .04589 -.66877 -.73379)">
|
||||
<polygon
|
||||
points="282.65 356.65 51.791 356.65 51.791 23.99 204.5 23.99 206.31 25.8 206.31 100.33 280.9 100.33 282.65 102.07"
|
||||
fill="#fff"
|
||||
strokeWidth="212.65"
|
||||
/>
|
||||
<path
|
||||
d="m198.31 31.99v76.337h76.337v240.32h-214.86v-316.66h138.52m9.5-16h-164.02v348.66h246.85v-265.9l-6.43-6.424h-69.907v-69.842z"
|
||||
strokeWidth="21.791"
|
||||
/>
|
||||
</g>
|
||||
<g transform="matrix(.04589 0 0 .04589 -.66877 -.73379)" strokeWidth="21.791">
|
||||
<polygon points="258.31 87.75 219.64 87.75 219.64 48.667 258.31 86.38" />
|
||||
<path d="m227.64 67.646 12.41 12.104h-12.41v-12.104m-5.002-27.229h-10.998v55.333h54.666v-12.742z" />
|
||||
</g>
|
||||
<g
|
||||
transform="matrix(.04589 0 0 .04589 -.66877 -.73379)"
|
||||
fill="#ed1c24"
|
||||
strokeWidth="212.65"
|
||||
>
|
||||
<polygon points="311.89 284.49 22.544 284.49 22.544 167.68 37.291 152.94 37.291 171.49 297.15 171.49 297.15 152.94 311.89 167.68" />
|
||||
<path d="m303.65 168.63 1.747 1.747v107.62h-276.35v-107.62l1.747-1.747v9.362h272.85v-9.362m-12.999-31.385v27.747h-246.86v-27.747l-27.747 27.747v126h302.35v-126z" />
|
||||
</g>
|
||||
<rect x="1.7219" y="7.9544" width="10.684" height="4.0307" fill="none" />
|
||||
<g transform="matrix(.04589 0 0 .04589 1.7219 11.733)" fill="#fff" strokeWidth="21.791">
|
||||
<path d="m9.216 0v-83.2h30.464q6.784 0 12.928 1.408 6.144 1.28 10.752 4.608 4.608 3.2 7.296 8.576 2.816 5.248 2.816 13.056 0 7.68-2.816 13.184-2.688 5.504-7.296 9.088-4.608 3.456-10.624 5.248-6.016 1.664-12.544 1.664h-8.96v26.368zm22.016-43.776h7.936q6.528 0 9.6-3.072 3.2-3.072 3.2-8.704t-3.456-7.936-9.856-2.304h-7.424z" />
|
||||
<path d="m87.04 0v-83.2h24.576q9.472 0 17.28 2.304 7.936 2.304 13.568 7.296t8.704 12.8q3.2 7.808 3.2 18.816t-3.072 18.944-8.704 13.056q-5.504 5.12-13.184 7.552-7.552 2.432-16.512 2.432zm22.016-17.664h1.28q4.48 0 8.448-1.024 3.968-1.152 6.784-3.84 2.944-2.688 4.608-7.424t1.664-12.032-1.664-11.904-4.608-7.168q-2.816-2.56-6.784-3.456-3.968-1.024-8.448-1.024h-1.28z" />
|
||||
<path d="m169.22 0v-83.2h54.272v18.432h-32.256v15.872h27.648v18.432h-27.648v30.464z" />
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
export function Word({ className }: { className?: string }) {
|
||||
const classes = className ?? "w-6 h-6 text-muted-foreground inline-flex mr-1";
|
||||
return (
|
||||
<svg
|
||||
className={`${classes}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="#FFF"
|
||||
stroke-miterlimit="10"
|
||||
strokeWidth="2"
|
||||
viewBox="0 0 96 96"
|
||||
>
|
||||
<path
|
||||
stroke="#979593"
|
||||
d="M67.1716 7H27c-1.1046 0-2 .8954-2 2v78c0 1.1046.8954 2 2 2h58c1.1046 0 2-.8954 2-2V26.8284c0-.5304-.2107-1.0391-.5858-1.4142L68.5858 7.5858C68.2107 7.2107 67.702 7 67.1716 7z"
|
||||
/>
|
||||
<path fill="none" stroke="#979593" d="M67 7v18c0 1.1046.8954 2 2 2h18" />
|
||||
<path
|
||||
fill="#C8C6C4"
|
||||
d="M79 61H48v-2h31c.5523 0 1 .4477 1 1s-.4477 1-1 1zm0-6H48v-2h31c.5523 0 1 .4477 1 1s-.4477 1-1 1zm0-6H48v-2h31c.5523 0 1 .4477 1 1s-.4477 1-1 1zm0-6H48v-2h31c.5523 0 1 .4477 1 1s-.4477 1-1 1zm0 24H48v-2h31c.5523 0 1 .4477 1 1s-.4477 1-1 1z"
|
||||
/>
|
||||
<path
|
||||
fill="#185ABD"
|
||||
d="M12 74h32c2.2091 0 4-1.7909 4-4V38c0-2.2091-1.7909-4-4-4H12c-2.2091 0-4 1.7909-4 4v32c0 2.2091 1.7909 4 4 4z"
|
||||
/>
|
||||
<path d="M21.6245 60.6455c.0661.522.109.9769.1296 1.3657h.0762c.0306-.3685.0889-.8129.1751-1.3349.0862-.5211.1703-.961.2517-1.319L25.7911 44h4.5702l3.6562 15.1272c.183.7468.3353 1.6973.457 2.8532h.0608c.0508-.7979.1777-1.7184.3809-2.7615L37.8413 44H42l-5.1183 22h-4.86l-3.4885-14.5744c-.1016-.4197-.2158-.9663-.3428-1.6417-.127-.6745-.2057-1.1656-.236-1.4724h-.0608c-.0407.358-.1195.8896-.2364 1.595-.1169.7062-.211 1.2273-.2819 1.565L24.1 66h-4.9357L14 44h4.2349l3.1843 15.3882c.0709.3165.1392.7362.2053 1.2573z" />
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue