diff --git a/docs/src/theme/FeatureTables.js b/docs/src/theme/FeatureTables.js
deleted file mode 100644
index 756e7941cd1..00000000000
--- a/docs/src/theme/FeatureTables.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import React from "react";
-
-const FeatureTables = {
- llms: {
- link: "/docs/integrations/llms",
- items:[
- {
- "Model": "Anthropic",
- "link": "anthropic.ipynb",
- "package": "langchain-anthropic",
- }
- ]
- },
- text_embedding: {
- link: "/docs/integrations/text_embedding",
- items:[
- {
- "Model": "Cohere",
- "link": "cohere.ipynb",
- "package": "langchain-cohere",
- }
- ]
- },
-};
-
-function formatItem(item: object) {
- const rtn = {...item};
- //
-}
-
-function to2dArray(items: object[]) {
- const keys = Object.keys(items[0]);
-
- return items.map((item) => Object.values(item));
-}
-
-export function CategoryTable() {
- return (
);
-}
-
-export function ItemTable() {
- return Item Table
;
-}
\ No newline at end of file
diff --git a/docs/src/theme/FeatureTables.tsx b/docs/src/theme/FeatureTables.tsx
new file mode 100644
index 00000000000..d85a634bce9
--- /dev/null
+++ b/docs/src/theme/FeatureTables.tsx
@@ -0,0 +1,73 @@
+import React from "react";
+
+interface Column {
+ title: string | React.ReactNode;
+ formatter: (item: any) => React.ReactNode;
+}
+interface Category {
+ link: string;
+ columns: Column[];
+ items: any[];
+}
+
+const FeatureTables: Record = {
+ llms: {
+ link: "/docs/integrations/llms",
+ columns: [
+ {title: "Model", formatter: (item) => {item.name}},
+
+ ],
+ items:[
+ {
+ name: "Anthropic",
+ link: "anthropic.ipynb",
+ package: "langchain-anthropic",
+ }
+ ]
+ },
+ text_embedding: {
+ link: "/docs/integrations/text_embedding",
+ columns: [],
+ items:[
+ {
+ name: "Cohere",
+ link: "cohere.ipynb",
+ package: "langchain-cohere",
+ }
+ ]
+ },
+};
+
+function toTable(columns: Column[], items: any[]) {
+ const headers = columns.map((col) => col.title);
+ return (
+
+
+
+ {headers.map((header) => | {header} | )}
+
+
+
+ {items.map((item) => (
+
+ {columns.map((col) => | {col.formatter(item)} | )}
+
+ ))}
+
+
+ );
+}
+
+export function CategoryTable({category}: {category: string}) {
+ const cat = FeatureTables[category];
+ return toTable(cat.columns, cat.items);
+}
+
+export function ItemTable({category, item}: {category: string, item: string}) {
+ const cat = FeatureTables[category];
+ const row = cat.items.find((i) => i.name === item);
+ if (!row) {
+ throw new Error(`Item ${item} not found in category ${category}`);
+ }
+ return toTable(cat.columns, [row]);
+}
\ No newline at end of file