replace knowledge table with ag grid
This commit is contained in:
Cole Goldsmith
parent
8dc737c124
commit
c7b213b365
7 changed files with 427 additions and 146 deletions
8
Makefile
8
Makefile
|
|
@ -75,6 +75,14 @@ infra:
|
|||
@echo " OpenSearch: http://localhost:9200"
|
||||
@echo " Dashboards: http://localhost:5601"
|
||||
|
||||
infra-cpu:
|
||||
@echo "🔧 Starting infrastructure services only..."
|
||||
docker-compose -f docker-compose-cpu.yml up -d opensearch dashboards langflow
|
||||
@echo "✅ Infrastructure services started!"
|
||||
@echo " Langflow: http://localhost:7860"
|
||||
@echo " OpenSearch: http://localhost:9200"
|
||||
@echo " Dashboards: http://localhost:5601"
|
||||
|
||||
# Container management
|
||||
stop:
|
||||
@echo "🛑 Stopping all containers..."
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
|
|||
/>
|
||||
<span
|
||||
className={cn(
|
||||
"pointer-events-none absolute top-1/2 -translate-y-1/2 pl-px text-placeholder-foreground",
|
||||
"pointer-events-none absolute top-1/2 -translate-y-1/2 pl-px text-placeholder-foreground font-mono",
|
||||
icon ? "left-9" : "left-3",
|
||||
props.value && "hidden",
|
||||
)}
|
||||
|
|
|
|||
28
frontend/package-lock.json
generated
28
frontend/package-lock.json
generated
|
|
@ -25,6 +25,8 @@
|
|||
"@tailwindcss/forms": "^0.5.10",
|
||||
"@tailwindcss/typography": "^0.5.16",
|
||||
"@tanstack/react-query": "^5.86.0",
|
||||
"ag-grid-community": "^34.2.0",
|
||||
"ag-grid-react": "^34.2.0",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
"cmdk": "^1.1.1",
|
||||
|
|
@ -2950,6 +2952,32 @@
|
|||
"node": ">=0.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/ag-charts-types": {
|
||||
"version": "12.2.0",
|
||||
"resolved": "https://registry.npmjs.org/ag-charts-types/-/ag-charts-types-12.2.0.tgz",
|
||||
"integrity": "sha512-d2qQrQirt9wP36YW5HPuOvXsiajyiFnr1CTsoCbs02bavPDz7Lk2jHp64+waM4YKgXb3GN7gafbBI9Qgk33BmQ=="
|
||||
},
|
||||
"node_modules/ag-grid-community": {
|
||||
"version": "34.2.0",
|
||||
"resolved": "https://registry.npmjs.org/ag-grid-community/-/ag-grid-community-34.2.0.tgz",
|
||||
"integrity": "sha512-peS7THEMYwpIrwLQHmkRxw/TlOnddD/F5A88RqlBxf8j+WqVYRWMOOhU5TqymGcha7z2oZ8IoL9ROl3gvtdEjg==",
|
||||
"dependencies": {
|
||||
"ag-charts-types": "12.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/ag-grid-react": {
|
||||
"version": "34.2.0",
|
||||
"resolved": "https://registry.npmjs.org/ag-grid-react/-/ag-grid-react-34.2.0.tgz",
|
||||
"integrity": "sha512-dLKFw6hz75S0HLuZvtcwjm+gyiI4gXVzHEu7lWNafWAX0mb8DhogEOP5wbzAlsN6iCfi7bK/cgZImZFjenlqwg==",
|
||||
"dependencies": {
|
||||
"ag-grid-community": "34.2.0",
|
||||
"prop-types": "^15.8.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
||||
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/agent-base": {
|
||||
"version": "6.0.2",
|
||||
"resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
|
||||
|
|
|
|||
|
|
@ -26,6 +26,8 @@
|
|||
"@tailwindcss/forms": "^0.5.10",
|
||||
"@tailwindcss/typography": "^0.5.16",
|
||||
"@tanstack/react-query": "^5.86.0",
|
||||
"ag-grid-community": "^34.2.0",
|
||||
"ag-grid-react": "^34.2.0",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
"cmdk": "^1.1.1",
|
||||
|
|
|
|||
|
|
@ -8,7 +8,14 @@ import {
|
|||
Loader2,
|
||||
Search,
|
||||
} from "lucide-react";
|
||||
import { type FormEvent, useCallback, useEffect, useState } from "react";
|
||||
import { AgGridReact, CustomCellRendererProps } from "ag-grid-react";
|
||||
import {
|
||||
type FormEvent,
|
||||
useCallback,
|
||||
useEffect,
|
||||
useState,
|
||||
useRef,
|
||||
} from "react";
|
||||
import { SiGoogledrive } from "react-icons/si";
|
||||
import { TbBrandOnedrive } from "react-icons/tb";
|
||||
import { KnowledgeDropdown } from "@/components/knowledge-dropdown";
|
||||
|
|
@ -18,6 +25,9 @@ import { Input } from "@/components/ui/input";
|
|||
import { useKnowledgeFilter } from "@/contexts/knowledge-filter-context";
|
||||
import { useTask } from "@/contexts/task-context";
|
||||
import { type File, useGetSearchQuery } from "../api/queries/useGetSearchQuery";
|
||||
import { ColDef } from "ag-grid-community";
|
||||
import "@/components/AgGrid/registerAgGridModules";
|
||||
import "@/components/AgGrid/agGridStyles.css";
|
||||
|
||||
// Function to get the appropriate icon for a connector type
|
||||
function getSourceIcon(connectorType?: string) {
|
||||
|
|
@ -64,11 +74,76 @@ function SearchPage() {
|
|||
}
|
||||
setQuery(queryInputText);
|
||||
},
|
||||
[queryInputText, refetchSearch, query],
|
||||
[queryInputText, refetchSearch, query]
|
||||
);
|
||||
|
||||
const fileResults = data as File[];
|
||||
|
||||
const gridRef = useRef<AgGridReact>(null);
|
||||
|
||||
const [columnDefs] = useState<ColDef<File>[]>([
|
||||
{
|
||||
field: "filename",
|
||||
headerName: "Source",
|
||||
cellRenderer: ({ data, value }: CustomCellRendererProps<File>) => {
|
||||
return (
|
||||
<div className="flex items-center gap-2">
|
||||
{getSourceIcon(data?.connector_type)}
|
||||
<span className="font-medium text-foreground truncate">
|
||||
{value}
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
field: "size",
|
||||
headerName: "Size",
|
||||
valueFormatter: (params) =>
|
||||
params.value ? `${Math.round(params.value / 1024)} KB` : "-",
|
||||
},
|
||||
{
|
||||
field: "mimetype",
|
||||
headerName: "Type",
|
||||
},
|
||||
{
|
||||
field: "owner",
|
||||
headerName: "Owner",
|
||||
valueFormatter: (params) =>
|
||||
params.value ||
|
||||
params.data?.owner_name ||
|
||||
params.data?.owner_email ||
|
||||
"—",
|
||||
},
|
||||
|
||||
{
|
||||
field: "chunkCount",
|
||||
headerName: "Chunks",
|
||||
},
|
||||
{
|
||||
field: "avgScore",
|
||||
headerName: "Avg score",
|
||||
cellRenderer: ({ value }: CustomCellRendererProps<File>) => {
|
||||
return (
|
||||
<span className="text-xs text-green-400 bg-green-400/20 px-2 py-1 rounded">
|
||||
{value.toFixed(2)}
|
||||
</span>
|
||||
);
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
const defaultColDef: ColDef<File> = {
|
||||
cellStyle: () => ({
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
}),
|
||||
initialFlex: 1,
|
||||
minWidth: 100,
|
||||
resizable: false,
|
||||
suppressMovable: true,
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`fixed inset-0 md:left-72 top-[53px] flex flex-col transition-all duration-300 ${
|
||||
|
|
@ -85,6 +160,10 @@ function SearchPage() {
|
|||
}`}
|
||||
>
|
||||
<div className="flex-1 flex flex-col min-h-0 px-6 py-6">
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<h2 className="text-lg font-semibold">Project Knowledge</h2>
|
||||
<KnowledgeDropdown variant="button" />
|
||||
</div>
|
||||
{/* Search Input Area */}
|
||||
<div className="flex-shrink-0 mb-6">
|
||||
<form onSubmit={handleSearch} className="flex gap-3">
|
||||
|
|
@ -100,7 +179,7 @@ function SearchPage() {
|
|||
/>
|
||||
<Button
|
||||
type="submit"
|
||||
variant="secondary"
|
||||
variant="outline"
|
||||
className="rounded-lg h-12 w-12 p-0 flex-shrink-0"
|
||||
>
|
||||
{isFetching ? (
|
||||
|
|
@ -109,17 +188,61 @@ function SearchPage() {
|
|||
<Search className="h-4 w-4" />
|
||||
)}
|
||||
</Button>
|
||||
<div className="flex-shrink-0">
|
||||
<KnowledgeDropdown variant="button" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{/* Results Area */}
|
||||
<div className="flex-1 overflow-y-auto">
|
||||
<div className="space-y-4">
|
||||
{fileResults.length === 0 && !isFetching ? (
|
||||
<div className="text-center py-12">
|
||||
{selectedFile ? (
|
||||
// Show chunks for selected file
|
||||
<>
|
||||
<div className="flex items-center gap-2 mb-4">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => setSelectedFile(null)}
|
||||
>
|
||||
← Back to files
|
||||
</Button>
|
||||
<span className="text-sm text-muted-foreground">
|
||||
Chunks from {selectedFile}
|
||||
</span>
|
||||
</div>
|
||||
{fileResults
|
||||
.filter((file) => file.filename === selectedFile)
|
||||
.flatMap((file) => file.chunks)
|
||||
.map((chunk, index) => (
|
||||
<div
|
||||
key={chunk.filename + index}
|
||||
className="bg-muted/20 rounded-lg p-4 border border-border/50"
|
||||
>
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<div className="flex items-center gap-2">
|
||||
<FileText className="h-4 w-4 text-blue-400" />
|
||||
<span className="font-medium truncate">
|
||||
{chunk.filename}
|
||||
</span>
|
||||
</div>
|
||||
<span className="text-xs text-green-400 bg-green-400/20 px-2 py-1 rounded">
|
||||
{chunk.score.toFixed(2)}
|
||||
</span>
|
||||
</div>
|
||||
<div className="text-sm text-muted-foreground mb-2">
|
||||
{chunk.mimetype} • Page {chunk.page}
|
||||
</div>
|
||||
<p className="text-sm text-foreground/90 leading-relaxed">
|
||||
{chunk.text}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
) : (
|
||||
<AgGridReact
|
||||
columnDefs={columnDefs}
|
||||
defaultColDef={defaultColDef}
|
||||
loading={isFetching}
|
||||
ref={gridRef}
|
||||
rowData={fileResults}
|
||||
onRowClicked={(params) => setSelectedFile(params.data?.filename)}
|
||||
noRowsOverlayComponent={() => (
|
||||
<div className="text-center">
|
||||
<Search className="h-12 w-12 mx-auto mb-4 text-muted-foreground/50" />
|
||||
<p className="text-lg text-muted-foreground">
|
||||
No documents found
|
||||
|
|
@ -128,143 +251,209 @@ function SearchPage() {
|
|||
Try adjusting your search terms
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
{/* Results Count */}
|
||||
<div className="mb-4">
|
||||
<div className="text-sm text-muted-foreground">
|
||||
{fileResults.length} file
|
||||
{fileResults.length !== 1 ? "s" : ""} found
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Results Display */}
|
||||
<div
|
||||
className={isFetching ? "opacity-50 pointer-events-none" : ""}
|
||||
>
|
||||
{selectedFile ? (
|
||||
// Show chunks for selected file
|
||||
<>
|
||||
<div className="flex items-center gap-2 mb-4">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => setSelectedFile(null)}
|
||||
>
|
||||
← Back to files
|
||||
</Button>
|
||||
<span className="text-sm text-muted-foreground">
|
||||
Chunks from {selectedFile}
|
||||
</span>
|
||||
</div>
|
||||
{fileResults
|
||||
.filter((file) => file.filename === selectedFile)
|
||||
.flatMap((file) => file.chunks)
|
||||
.map((chunk, index) => (
|
||||
<div
|
||||
key={chunk.filename + index}
|
||||
className="bg-muted/20 rounded-lg p-4 border border-border/50"
|
||||
>
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<div className="flex items-center gap-2">
|
||||
<FileText className="h-4 w-4 text-blue-400" />
|
||||
<span className="font-medium truncate">
|
||||
{chunk.filename}
|
||||
</span>
|
||||
</div>
|
||||
<span className="text-xs text-green-400 bg-green-400/20 px-2 py-1 rounded">
|
||||
{chunk.score.toFixed(2)}
|
||||
</span>
|
||||
</div>
|
||||
<div className="text-sm text-muted-foreground mb-2">
|
||||
{chunk.mimetype} • Page {chunk.page}
|
||||
</div>
|
||||
<p className="text-sm text-foreground/90 leading-relaxed">
|
||||
{chunk.text}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</>
|
||||
) : (
|
||||
// Show files table
|
||||
<div className="bg-muted/20 rounded-lg border border-border/50 overflow-hidden">
|
||||
<table className="w-full">
|
||||
<thead>
|
||||
<tr className="border-b border-border/50 bg-muted/10">
|
||||
<th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
Source
|
||||
</th>
|
||||
<th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
Type
|
||||
</th>
|
||||
<th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
Size
|
||||
</th>
|
||||
<th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
Matching chunks
|
||||
</th>
|
||||
<th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
Average score
|
||||
</th>
|
||||
<th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
Owner
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{fileResults.map((file) => (
|
||||
<tr
|
||||
key={file.filename}
|
||||
className="border-b border-border/30 hover:bg-muted/20 cursor-pointer transition-colors"
|
||||
onClick={() => setSelectedFile(file.filename)}
|
||||
>
|
||||
<td className="p-3">
|
||||
<div className="flex items-center gap-2">
|
||||
{getSourceIcon(file.connector_type)}
|
||||
<span
|
||||
className="font-medium truncate"
|
||||
title={file.filename}
|
||||
>
|
||||
{file.filename}
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="p-3 text-sm text-muted-foreground">
|
||||
{file.mimetype}
|
||||
</td>
|
||||
<td className="p-3 text-sm text-muted-foreground">
|
||||
{file.size
|
||||
? `${Math.round(file.size / 1024)} KB`
|
||||
: "—"}
|
||||
</td>
|
||||
<td className="p-3 text-sm text-muted-foreground">
|
||||
{file.chunkCount}
|
||||
</td>
|
||||
<td className="p-3">
|
||||
<span className="text-xs text-green-400 bg-green-400/20 px-2 py-1 rounded">
|
||||
{file.avgScore.toFixed(2)}
|
||||
</span>
|
||||
</td>
|
||||
<td
|
||||
className="p-3 text-sm text-muted-foreground"
|
||||
title={file.owner_email}
|
||||
>
|
||||
{file.owner_name || file.owner || "—"}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
// return (
|
||||
// <div
|
||||
// className={`fixed inset-0 md:left-72 top-[53px] flex flex-col transition-all duration-300 ${
|
||||
// isMenuOpen && isPanelOpen
|
||||
// ? "md:right-[704px]"
|
||||
// : // Both open: 384px (menu) + 320px (KF panel)
|
||||
// isMenuOpen
|
||||
// ? "md:right-96"
|
||||
// : // Only menu open: 384px
|
||||
// isPanelOpen
|
||||
// ? "md:right-80"
|
||||
// : // Only KF panel open: 320px
|
||||
// "md:right-6" // Neither open: 24px
|
||||
// }`}
|
||||
// >
|
||||
// <div className="flex-1 flex flex-col min-h-0 px-6 py-6">
|
||||
// {/* Search Input Area */}
|
||||
// <div className="flex-shrink-0 mb-6">
|
||||
// <form onSubmit={handleSearch} className="flex gap-3">
|
||||
// <Input
|
||||
// name="search-query"
|
||||
// id="search-query"
|
||||
// type="text"
|
||||
// defaultValue={parsedFilterData?.query}
|
||||
// value={queryInputText}
|
||||
// onChange={(e) => setQueryInputText(e.target.value)}
|
||||
// placeholder="Search your documents..."
|
||||
// className="flex-1 bg-muted/20 rounded-lg border border-border/50 px-4 py-3 h-12 focus-visible:ring-1 focus-visible:ring-ring"
|
||||
// />
|
||||
// <Button
|
||||
// type="submit"
|
||||
// variant="secondary"
|
||||
// className="rounded-lg h-12 w-12 p-0 flex-shrink-0"
|
||||
// >
|
||||
// {isFetching ? (
|
||||
// <Loader2 className="h-4 w-4 animate-spin" />
|
||||
// ) : (
|
||||
// <Search className="h-4 w-4" />
|
||||
// )}
|
||||
// </Button>
|
||||
// <div className="flex-shrink-0">
|
||||
// <KnowledgeDropdown variant="button" />
|
||||
// </div>
|
||||
// </form>
|
||||
// </div>
|
||||
|
||||
// {/* Results Area */}
|
||||
// <div className="flex-1 overflow-y-auto">
|
||||
// <div className="space-y-4">
|
||||
// {fileResults.length === 0 && !isFetching ? (
|
||||
// <div className="text-center py-12">
|
||||
// <Search className="h-12 w-12 mx-auto mb-4 text-muted-foreground/50" />
|
||||
// <p className="text-lg text-muted-foreground">
|
||||
// No documents found
|
||||
// </p>
|
||||
// <p className="text-sm text-muted-foreground/70 mt-2">
|
||||
// Try adjusting your search terms
|
||||
// </p>
|
||||
// </div>
|
||||
// ) : (
|
||||
// <div className="space-y-4">
|
||||
// {/* Results Count */}
|
||||
// <div className="mb-4">
|
||||
// <div className="text-sm text-muted-foreground">
|
||||
// {fileResults.length} file
|
||||
// {fileResults.length !== 1 ? "s" : ""} found
|
||||
// </div>
|
||||
// </div>
|
||||
|
||||
// {/* Results Display */}
|
||||
// <div
|
||||
// className={isFetching ? "opacity-50 pointer-events-none" : ""}
|
||||
// >
|
||||
// {selectedFile ? (
|
||||
// // Show chunks for selected file
|
||||
// <>
|
||||
// <div className="flex items-center gap-2 mb-4">
|
||||
// <Button
|
||||
// variant="ghost"
|
||||
// size="sm"
|
||||
// onClick={() => setSelectedFile(null)}
|
||||
// >
|
||||
// ← Back to files
|
||||
// </Button>
|
||||
// <span className="text-sm text-muted-foreground">
|
||||
// Chunks from {selectedFile}
|
||||
// </span>
|
||||
// </div>
|
||||
// {fileResults
|
||||
// .filter((file) => file.filename === selectedFile)
|
||||
// .flatMap((file) => file.chunks)
|
||||
// .map((chunk, index) => (
|
||||
// <div
|
||||
// key={chunk.filename + index}
|
||||
// className="bg-muted/20 rounded-lg p-4 border border-border/50"
|
||||
// >
|
||||
// <div className="flex items-center justify-between mb-2">
|
||||
// <div className="flex items-center gap-2">
|
||||
// <FileText className="h-4 w-4 text-blue-400" />
|
||||
// <span className="font-medium truncate">
|
||||
// {chunk.filename}
|
||||
// </span>
|
||||
// </div>
|
||||
// <span className="text-xs text-green-400 bg-green-400/20 px-2 py-1 rounded">
|
||||
// {chunk.score.toFixed(2)}
|
||||
// </span>
|
||||
// </div>
|
||||
// <div className="text-sm text-muted-foreground mb-2">
|
||||
// {chunk.mimetype} • Page {chunk.page}
|
||||
// </div>
|
||||
// <p className="text-sm text-foreground/90 leading-relaxed">
|
||||
// {chunk.text}
|
||||
// </p>
|
||||
// </div>
|
||||
// ))}
|
||||
// </>
|
||||
// ) : (
|
||||
// // Show files table
|
||||
// <div className="bg-muted/20 rounded-lg border border-border/50 overflow-hidden">
|
||||
// <table className="w-full">
|
||||
// <thead>
|
||||
// <tr className="border-b border-border/50 bg-muted/10">
|
||||
// <th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
// Source
|
||||
// </th>
|
||||
// <th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
// Type
|
||||
// </th>
|
||||
// <th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
// Size
|
||||
// </th>
|
||||
// <th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
// Matching chunks
|
||||
// </th>
|
||||
// <th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
// Average score
|
||||
// </th>
|
||||
// <th className="text-left p-3 text-sm font-medium text-muted-foreground">
|
||||
// Owner
|
||||
// </th>
|
||||
// </tr>
|
||||
// </thead>
|
||||
// <tbody>
|
||||
// {fileResults.map((file) => (
|
||||
// <tr
|
||||
// key={file.filename}
|
||||
// className="border-b border-border/30 hover:bg-muted/20 cursor-pointer transition-colors"
|
||||
// onClick={() => setSelectedFile(file.filename)}
|
||||
// >
|
||||
// <td className="p-3">
|
||||
// <div className="flex items-center gap-2">
|
||||
// {getSourceIcon(file.connector_type)}
|
||||
// <span
|
||||
// className="font-medium truncate"
|
||||
// title={file.filename}
|
||||
// >
|
||||
// {file.filename}
|
||||
// </span>
|
||||
// </div>
|
||||
// </td>
|
||||
// <td className="p-3 text-sm text-muted-foreground">
|
||||
// {file.mimetype}
|
||||
// </td>
|
||||
// <td className="p-3 text-sm text-muted-foreground">
|
||||
// {file.size
|
||||
// ? `${Math.round(file.size / 1024)} KB`
|
||||
// : "—"}
|
||||
// </td>
|
||||
// <td className="p-3 text-sm text-muted-foreground">
|
||||
// {file.chunkCount}
|
||||
// </td>
|
||||
// <td className="p-3">
|
||||
// <span className="text-xs text-green-400 bg-green-400/20 px-2 py-1 rounded">
|
||||
// {file.avgScore.toFixed(2)}
|
||||
// </span>
|
||||
// </td>
|
||||
// <td
|
||||
// className="p-3 text-sm text-muted-foreground"
|
||||
// title={file.owner_email}
|
||||
// >
|
||||
// {file.owner_name || file.owner || "—"}
|
||||
// </td>
|
||||
// </tr>
|
||||
// ))}
|
||||
// </tbody>
|
||||
// </table>
|
||||
// </div>
|
||||
// )}
|
||||
// </div>
|
||||
// </div>
|
||||
// )}
|
||||
// </div>
|
||||
// </div>
|
||||
// </div>
|
||||
// </div>
|
||||
// );
|
||||
}
|
||||
|
||||
export default function ProtectedSearchPage() {
|
||||
|
|
|
|||
21
frontend/src/components/AgGrid/agGridStyles.css
Normal file
21
frontend/src/components/AgGrid/agGridStyles.css
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
body {
|
||||
--ag-text-color: hsl(var(--muted-foreground));
|
||||
--ag-background-color: hsl(var(--background));
|
||||
--ag-header-background-color: hsl(var(--background));
|
||||
--ag-header-text-color: hsl(var(--muted-foreground));
|
||||
--ag-header-column-resize-handle-color: hsl(var(--border));
|
||||
--ag-header-row-border: hsl(var(--border));
|
||||
--ag-header-font-weight: var(--font-medium);
|
||||
--ag-row-border: undefined;
|
||||
--ag-row-hover-color: hsl(var(--muted));
|
||||
--ag-wrapper-border: none;
|
||||
--ag-font-family: var(--font-sans);
|
||||
|
||||
.ag-header {
|
||||
border-bottom: 1px solid hsl(var(--border));
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.ag-row {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
33
frontend/src/components/AgGrid/registerAgGridModules.ts
Normal file
33
frontend/src/components/AgGrid/registerAgGridModules.ts
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
import {
|
||||
ModuleRegistry,
|
||||
ValidationModule,
|
||||
ColumnAutoSizeModule,
|
||||
ColumnApiModule,
|
||||
PaginationModule,
|
||||
CellStyleModule,
|
||||
QuickFilterModule,
|
||||
ClientSideRowModelModule,
|
||||
TextFilterModule,
|
||||
DateFilterModule,
|
||||
EventApiModule,
|
||||
GridStateModule,
|
||||
} from 'ag-grid-community';
|
||||
|
||||
// Importing necessary modules from ag-grid-community
|
||||
// https://www.ag-grid.com/javascript-data-grid/modules/#selecting-modules
|
||||
|
||||
ModuleRegistry.registerModules([
|
||||
ColumnAutoSizeModule,
|
||||
ColumnApiModule,
|
||||
PaginationModule,
|
||||
CellStyleModule,
|
||||
QuickFilterModule,
|
||||
ClientSideRowModelModule,
|
||||
TextFilterModule,
|
||||
DateFilterModule,
|
||||
EventApiModule,
|
||||
GridStateModule,
|
||||
// The ValidationModule adds helpful console warnings/errors that can help identify bad configuration during development.
|
||||
...(process.env.NODE_ENV !== 'production' ? [ValidationModule] : []),
|
||||
]);
|
||||
|
||||
Loading…
Add table
Reference in a new issue