diff --git a/frontend/.eslintrc.js b/frontend/.eslintrc.js deleted file mode 100644 index 8d92473..0000000 --- a/frontend/.eslintrc.js +++ /dev/null @@ -1,10 +0,0 @@ -// This configuration only applies to the package manager root. -/** @type {import("eslint").Linter.Config} */ -module.exports = { - ignorePatterns: ["apps/**", "packages/**"], - extends: ["@missingstudio/eslint-config/library.js"], - parser: "@typescript-eslint/parser", - parserOptions: { - project: true, - }, -}; diff --git a/frontend/.gitignore b/frontend/.gitignore deleted file mode 100644 index 96fab4f..0000000 --- a/frontend/.gitignore +++ /dev/null @@ -1,38 +0,0 @@ -# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. - -# Dependencies -node_modules -.pnp -.pnp.js - -# Local env files -.env -.env.local -.env.development.local -.env.test.local -.env.production.local - -# Testing -coverage - -# Turbo -.turbo - -# Vercel -.vercel - -# Build Outputs -.next/ -out/ -build -dist - - -# Debug -npm-debug.log* -yarn-debug.log* -yarn-error.log* - -# Misc -.DS_Store -*.pem diff --git a/frontend/.npmrc b/frontend/.npmrc deleted file mode 100644 index e69de29..0000000 diff --git a/frontend/README.md b/frontend/README.md deleted file mode 100644 index 03062fc..0000000 --- a/frontend/README.md +++ /dev/null @@ -1,73 +0,0 @@ -## Missing studio - -Run the following command: - -```sh -npx create-turbo@latest -``` - -## What's inside? - -This Turborepo includes the following packages/apps: - -### Apps and Packages - -- `studio`: a [Next.js](https://nextjs.org/) app -- `@missingstudio/eslint-config`: `eslint` configurations (includes `eslint-config-next` and `eslint-config-prettier`) -- `@missingstudio/typescript-config`: `tsconfig.json`s used throughout the monorepo - -### Utilities - -This Turborepo has some additional tools already setup for you: - -- [TypeScript](https://www.typescriptlang.org/) for static type checking -- [ESLint](https://eslint.org/) for code linting -- [Prettier](https://prettier.io) for code formatting - -### Build - -To build all apps and packages, run the following command: - -``` -cd my-turborepo -pnpm build -``` - -### Develop - -To develop all apps and packages, run the following command: - -``` -cd my-turborepo -pnpm dev -``` - -### Remote Caching - -Turborepo can use a technique known as [Remote Caching](https://turbo.build/repo/docs/core-concepts/remote-caching) to share cache artifacts across machines, enabling you to share build caches with your team and CI/CD pipelines. - -By default, Turborepo will cache locally. To enable Remote Caching you will need an account with Vercel. If you don't have an account you can [create one](https://vercel.com/signup), then enter the following commands: - -``` -cd my-turborepo -npx turbo login -``` - -This will authenticate the Turborepo CLI with your [Vercel account](https://vercel.com/docs/concepts/personal-accounts/overview). - -Next, you can link your Turborepo to your Remote Cache by running the following command from the root of your Turborepo: - -``` -npx turbo link -``` - -## Useful Links - -Learn more about the power of Turborepo: - -- [Tasks](https://turbo.build/repo/docs/core-concepts/monorepos/running-tasks) -- [Caching](https://turbo.build/repo/docs/core-concepts/caching) -- [Remote Caching](https://turbo.build/repo/docs/core-concepts/remote-caching) -- [Filtering](https://turbo.build/repo/docs/core-concepts/monorepos/filtering) -- [Configuration Options](https://turbo.build/repo/docs/reference/configuration) -- [CLI Usage](https://turbo.build/repo/docs/reference/command-line-reference) diff --git a/frontend/bun.lockb b/frontend/bun.lockb deleted file mode 100755 index 7a06945..0000000 Binary files a/frontend/bun.lockb and /dev/null differ diff --git a/frontend/package.json b/frontend/package.json deleted file mode 100644 index 9cd3de5..0000000 --- a/frontend/package.json +++ /dev/null @@ -1,26 +0,0 @@ -{ - "name": "frontend", - "private": true, - "scripts": { - "build": "turbo build", - "dev": "turbo dev", - "lint": "turbo lint", - "format": "prettier --write \"**/*.{ts,tsx,md}\"" - }, - "devDependencies": { - "@missingstudio/eslint-config": "https://gitpkg.now.sh/missingstudio/apsara/packages/eslint-config?main", - "@missingstudio/typescript-config": "https://gitpkg.now.sh/missingstudio/apsara/packages/typescript-config?main", - "prettier": "^3.1.1", - "turbo": "latest" - }, - "engines": { - "node": ">=18" - }, - "packageManager": "bun@1.0.25", - "workspaces": [ - "playgrounds/*" - ], - "dependencies": { - "prettier-plugin-tailwindcss": "^0.5.11" - } -} \ No newline at end of file diff --git a/frontend/playgrounds/studio/.eslintrc.js b/frontend/playgrounds/studio/.eslintrc.js deleted file mode 100644 index d3bb944..0000000 --- a/frontend/playgrounds/studio/.eslintrc.js +++ /dev/null @@ -1,9 +0,0 @@ -/** @type {import("eslint").Linter.Config} */ -module.exports = { - root: true, - extends: ["@missingstudio/eslint-config/next.js"], - parser: "@typescript-eslint/parser", - parserOptions: { - project: true, - }, -}; diff --git a/frontend/playgrounds/studio/README.md b/frontend/playgrounds/studio/README.md deleted file mode 100644 index 018709d..0000000 --- a/frontend/playgrounds/studio/README.md +++ /dev/null @@ -1,26 +0,0 @@ -## Getting Started - -First, run the development server: - -```bash -npm run dev -``` - -Open [http://localhost:3002](http://localhost:3002) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn/foundations/about-nextjs) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_source=github.com&utm_medium=referral&utm_campaign=turborepo-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/columnheader.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/columnheader.tsx deleted file mode 100644 index 4e285a1..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/columnheader.tsx +++ /dev/null @@ -1,70 +0,0 @@ -import { Button } from "@missingstudio/ui/button"; -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuSeparator, - DropdownMenuTrigger, -} from "@missingstudio/ui/dropdown-menu"; -import { - ArrowDownIcon, - ArrowUpIcon, - CaretSortIcon, - EyeNoneIcon, -} from "@radix-ui/react-icons"; -import { Column } from "@tanstack/react-table"; -import { cn } from "~/lib/utils"; - -interface DataTableColumnHeaderProps - extends React.HTMLAttributes { - column: Column; - title: string; -} - -export function DataTableColumnHeader({ - column, - title, - className, -}: DataTableColumnHeaderProps) { - if (!column.getCanSort()) { - return
{title}
; - } - - return ( -
- - - - - - column.toggleSorting(false)}> - - Asc - - column.toggleSorting(true)}> - - Desc - - - column.toggleVisibility(false)}> - - Hide - - - -
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/columns.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/columns.tsx deleted file mode 100644 index 05c4f29..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/columns.tsx +++ /dev/null @@ -1,120 +0,0 @@ -"use client"; - -import { ColumnDef } from "@tanstack/react-table"; - -import { Badge } from "@missingstudio/ui/badge"; -import { Checkbox } from "@missingstudio/ui/checkbox"; - -import { DataTableColumnHeader } from "~/app/(llm)/playground/components/datatable/columnheader"; -import { DataTableRowActions } from "~/app/(llm)/playground/components/datatable/rowactions"; - -export const columns: ColumnDef[] = [ - { - id: "select", - header: ({ table }) => ( - table.toggleAllPageRowsSelected(!!value)} - aria-label="Select all" - className="translate-y-[2px]" - /> - ), - cell: ({ row }) => ( - row.toggleSelected(!!value)} - aria-label="Select row" - className="translate-y-[2px]" - /> - ), - enableSorting: false, - enableHiding: false, - }, - - { - accessorKey: "model", - header: ({ column }) => ( - - ), - cell: ({ row }) => { - return ( -
- {row.original.provider} - - {row.original.model} - -
- ); - }, - enableSorting: false, - }, - - { - accessorKey: "prompt_tokens", - header: ({ column }) => ( - - ), - cell: ({ row }) => { - return ( -
- - {row.original.prompt_tokens} - -
- ); - }, - }, - { - accessorKey: "completion_tokens", - header: ({ column }) => ( - - ), - cell: ({ row }) => { - return ( -
- - {row.original.completion_tokens} - -
- ); - }, - }, - { - accessorKey: "total_tokens", - header: ({ column }) => ( - - ), - cell: ({ row }) => { - return ( -
- - {row.original.total_tokens} - -
- ); - }, - }, - { - accessorKey: "latency", - header: ({ column }) => ( - - ), - cell: ({ row }) => { - return ( -
- - {row.original.latency} - -
- ); - }, - }, - - { - id: "actions", - cell: ({ row }) => , - }, -]; diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/datatable.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/datatable.tsx deleted file mode 100644 index ba4b72e..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/datatable.tsx +++ /dev/null @@ -1,121 +0,0 @@ -"use client"; - -import { - ColumnFiltersState, - SortingState, - VisibilityState, - flexRender, - getCoreRowModel, - getFacetedRowModel, - getFacetedUniqueValues, - getFilteredRowModel, - getPaginationRowModel, - getSortedRowModel, - useReactTable, -} from "@tanstack/react-table"; -import * as React from "react"; - -import { - Table, - TableBody, - TableCell, - TableHead, - TableHeader, - TableRow, -} from "@missingstudio/ui/table"; - -import { columns } from "~/app/(llm)/playground/components/datatable/columns"; -import { DataTablePagination } from "~/app/(llm)/playground/components/datatable/pagination"; -import { useLogsFetch } from "~/app/(llm)/playground/hooks/useLogsFetch"; -import { useStore } from "~/app/(llm)/playground/store"; - -export default function DataTable() { - const [rowSelection, setRowSelection] = React.useState({}); - const [columnVisibility, setColumnVisibility] = - React.useState({}); - const [columnFilters, setColumnFilters] = React.useState( - [] - ); - const [sorting, setSorting] = React.useState([]); - - useLogsFetch(); - const { logs } = useStore(); - - const table = useReactTable({ - data: logs, - columns, - state: { - sorting, - columnVisibility, - rowSelection, - columnFilters, - }, - enableRowSelection: true, - onRowSelectionChange: setRowSelection, - onSortingChange: setSorting, - onColumnFiltersChange: setColumnFilters, - onColumnVisibilityChange: setColumnVisibility, - getCoreRowModel: getCoreRowModel(), - getFilteredRowModel: getFilteredRowModel(), - getPaginationRowModel: getPaginationRowModel(), - getSortedRowModel: getSortedRowModel(), - getFacetedRowModel: getFacetedRowModel(), - getFacetedUniqueValues: getFacetedUniqueValues(), - }); - - return ( -
-
- - - {table.getHeaderGroups().map((headerGroup) => ( - - {headerGroup.headers.map((header) => { - return ( - - {header.isPlaceholder - ? null - : flexRender( - header.column.columnDef.header, - header.getContext() - )} - - ); - })} - - ))} - - - {table.getRowModel().rows?.length ? ( - table.getRowModel().rows.map((row) => ( - - {row.getVisibleCells().map((cell) => ( - - {flexRender( - cell.column.columnDef.cell, - cell.getContext() - )} - - ))} - - )) - ) : ( - - - No results. - - - )} - -
-
- -
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/pagination.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/pagination.tsx deleted file mode 100644 index fef0694..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/pagination.tsx +++ /dev/null @@ -1,97 +0,0 @@ -import { - ChevronLeftIcon, - ChevronRightIcon, - DoubleArrowLeftIcon, - DoubleArrowRightIcon, -} from "@radix-ui/react-icons"; -import { Table } from "@tanstack/react-table"; - -import { Button } from "@missingstudio/ui/button"; -import { - Select, - SelectContent, - SelectItem, - SelectTrigger, - SelectValue, -} from "@missingstudio/ui/select"; - -interface DataTablePaginationProps { - table: Table; -} - -export function DataTablePagination({ - table, -}: DataTablePaginationProps) { - return ( -
-
- {table.getFilteredSelectedRowModel().rows.length} of{" "} - {table.getFilteredRowModel().rows.length} row(s) selected. -
-
-
-

Rows per page

- -
-
- Page {table.getState().pagination.pageIndex + 1} of{" "} - {table.getPageCount()} -
-
- - - - -
-
-
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/rowactions.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/rowactions.tsx deleted file mode 100644 index 630dedf..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/rowactions.tsx +++ /dev/null @@ -1,56 +0,0 @@ -"use client"; - -import { DotsHorizontalIcon } from "@radix-ui/react-icons"; -import { Row } from "@tanstack/react-table"; - -import { Button } from "@missingstudio/ui/button"; -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuShortcut, - DropdownMenuTrigger, -} from "@missingstudio/ui/dropdown-menu"; -import { Log, useStore } from "~/app/(llm)/playground/store"; - -interface DataTableRowActionsProps { - row: Row; -} - -export function DataTableRowActions({ - row, -}: DataTableRowActionsProps) { - const { setInput, setOutput, setModel, setProvider, setParameter } = - useStore(); - - const restore = () => { - setInput(row.original.chat_input); - setOutput(row.original.chat_output); - setModel(row.original.model); - setProvider(row.original.provider); - Object.entries(row.original.parameters).forEach(([key, value]) => - setParameter(key, value) - ); - }; - - return ( - - - - - - Restore - -
Delete
- ⌘⌫ - - - - ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/toolbar.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/toolbar.tsx deleted file mode 100644 index 37b40a9..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/datatable/toolbar.tsx +++ /dev/null @@ -1,49 +0,0 @@ -"use client"; - -import { Table } from "@tanstack/react-table"; - -import { Button } from "@missingstudio/ui/button"; -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@missingstudio/ui/dropdown-menu"; -import { useExport } from "~/app/(llm)/playground/hooks/useExport"; - -interface DataTableToolbarProps { - table: Table; -} - -export function DataTableToolbar({ - table, -}: DataTableToolbarProps) { - const exportLogs = useExport(); - - return ( -
- - - - - - exportLogs()}> - Export all - - - exportLogs( - table.getSelectedRowModel().rows.map((row) => row.original) - ) - } - > - Export selected - - - -
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/index.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/index.tsx deleted file mode 100644 index fce0553..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/index.tsx +++ /dev/null @@ -1,5 +0,0 @@ -export { default as DataTable } from "./datatable/datatable"; -export { default as Input } from "./input"; -export { default as ModelSelector } from "./modelselector"; -export { default as Output } from "./output"; -export { default as Parameters } from "./parameters"; diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/input.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/input.tsx deleted file mode 100644 index 72fe280..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/input.tsx +++ /dev/null @@ -1,62 +0,0 @@ -"use client"; -import { useChat } from "~/app/(llm)/playground/hooks/useChat"; -import { useStore } from "~/app/(llm)/playground/store"; - -import { Button } from "@missingstudio/ui/button"; -import { Loader2 } from "lucide-react"; -import { useRef } from "react"; - -export default function Input() { - const { input, status, setInput, setStatus } = useStore(); - const textareaRef = useRef(null); - const submitChat = useChat(); - - const onSubmit = (e: React.FormEvent) => { - e.preventDefault(); - setStatus("loading"); - textareaRef.current?.blur(); - submitChat(); - }; - - const onKeyDown = (e: React.KeyboardEvent) => { - if ((e.metaKey || e.ctrlKey) && e.key === "Enter") - onSubmit(e as unknown as React.FormEvent); - }; - - const onInputChange = (e: React.ChangeEvent) => { - setInput(e.target.value); - setStatus("idle"); - }; - - return ( -
-
-
-

Input

- -
-
- -
-
-
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/logsheet.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/logsheet.tsx deleted file mode 100644 index 9731a3a..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/logsheet.tsx +++ /dev/null @@ -1,50 +0,0 @@ -"use client"; - -import { Button } from "@missingstudio/ui/button"; -import { Input } from "@missingstudio/ui/input"; -import { Label } from "@missingstudio/ui/label"; -import { - Sheet, - SheetClose, - SheetContent, - SheetDescription, - SheetFooter, - SheetHeader, - SheetTitle, -} from "@missingstudio/ui/sheet"; - -export default function LogSheet() { - return ( -
- - - - Edit profile - - Make changes to your profile here. Click save when youre done. - - -
-
- - -
-
- - -
-
- - - - - - - -
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/modelitem.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/modelitem.tsx deleted file mode 100644 index 27437a2..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/modelitem.tsx +++ /dev/null @@ -1,27 +0,0 @@ -"use client"; -import { CommandItem } from "@missingstudio/ui/command"; -import { CheckIcon } from "@radix-ui/react-icons"; -import { cn } from "~/lib/utils"; - -interface ModelItemProps { - id: string; - isSelected: boolean; - onSelect: () => void; -} - -export function ModelItem({ id, isSelected, onSelect }: ModelItemProps) { - return ( - - {id} - - - ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/modelselector.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/modelselector.tsx deleted file mode 100644 index ad00039..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/modelselector.tsx +++ /dev/null @@ -1,75 +0,0 @@ -"use client"; -import { CaretSortIcon } from "@radix-ui/react-icons"; -import { PopoverProps } from "@radix-ui/react-popover"; -import React from "react"; - -import { - Popover, - PopoverContent, - PopoverTrigger, -} from "@missingstudio/ui/popover"; - -import { Button } from "@missingstudio/ui/button"; -import { - Command, - CommandEmpty, - CommandGroup, - CommandInput, - CommandList, -} from "@missingstudio/ui/command"; -import { Label } from "@missingstudio/ui/label"; -import { ModelItem } from "~/app/(llm)/playground/components/modelitem"; -import { useModelFetch } from "~/app/(llm)/playground/hooks/useModelFetch"; -import { useStore } from "~/app/(llm)/playground/store"; - -interface ModelSelectorProps extends PopoverProps {} - -export default function ModelSelector(props: ModelSelectorProps) { - const [open, setOpen] = React.useState(false); - const { providers } = useModelFetch(); - const { model, setModel, setProvider } = useStore(); - - return ( -
- - - - - - - - - - No Models found. - {providers.map((provider) => ( - - {provider.models.map((singleModel, index) => ( - { - setProvider(provider.name); - setModel(singleModel.value); - setOpen(false); - }} - /> - ))} - - ))} - - - - -
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/output.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/output.tsx deleted file mode 100644 index 84a1b32..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/output.tsx +++ /dev/null @@ -1,33 +0,0 @@ -"use client"; -import { useEffect, useRef } from "react"; -import { useStore } from "~/app/(llm)/playground/store"; -import Markdown from "~/components/markdown"; - -export default function Output() { - const { output, status } = useStore(); - const textareaRef = useRef(null); - - useEffect(() => { - if (textareaRef.current) - textareaRef.current.scrollTop = textareaRef.current.scrollHeight; - }); - - const getStatusColor = (status: string) => { - if (status === "idle") return "bg-slate-400"; - if (status === "waiting") return "bg-yellow-400"; - if (status === "done") return "bg-green-500"; - if (status === "error") return "bg-red-600"; - }; - - return ( -
-
-

Output

-
-
-
- -
-
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/components/parameters.tsx b/frontend/playgrounds/studio/app/(llm)/playground/components/parameters.tsx deleted file mode 100644 index bb7b127..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/components/parameters.tsx +++ /dev/null @@ -1,81 +0,0 @@ -"use client"; - -import { PopoverProps } from "@radix-ui/react-popover"; -import { Settings } from "lucide-react"; -import React, { useEffect } from "react"; - -import { Button } from "@missingstudio/ui/button"; -import { Input } from "@missingstudio/ui/input"; -import { Label } from "@missingstudio/ui/label"; -import { - Popover, - PopoverContent, - PopoverTrigger, -} from "@missingstudio/ui/popover"; -import { Slider } from "@missingstudio/ui/slider"; -import { - ParameterType, - useParameterFetch, -} from "~/app/(llm)/playground/hooks/useParameterFetch"; -import { useStore } from "~/app/(llm)/playground/store"; - -interface ModelSelectorProps extends PopoverProps {} - -export default function ModelSelector(props: ModelSelectorProps) { - const [open, setOpen] = React.useState(false); - const { parameters } = useParameterFetch(); - const { setParameter, getParameter } = useStore(); - - useEffect(() => { - for (const param of parameters) setParameter(param.id, param.default); - }, [parameters, setParameter]); - - return ( -
- - - - - -
-
-

Parameters

-
- - {parameters.map((param: ParameterType) => { - if (param.type === "float" || param.type === "int") - return ( -
-
- - { - setParameter(param.id, parseFloat(e.target.value)); - }} - /> -
- - setParameter(param.id, value[0]) - } - /> -
- ); - })} -
- - -
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/hooks/data/models.json b/frontend/playgrounds/studio/app/(llm)/playground/hooks/data/models.json deleted file mode 100644 index 0973091..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/hooks/data/models.json +++ /dev/null @@ -1,44 +0,0 @@ -{ - "anthropic": { - "name": "Anthropic", - "models": [ - "claude-2.1", - "claude-2", - "claude-instant-1.2", - "claude-instant-1" - ] - }, - "ollama": { - "name": "Ollama", - "models": ["llama2"] - }, - "openai": { - "name": "OpenAI", - "models": [ - "gpt-4-1106-preview", - "gpt-4", - "gpt-4-0314", - "gpt-4-0613", - "gpt-3.5-turbo", - "gpt-3.5-turbo-0301", - "gpt-3.5-turbo-0613", - "gpt-3.5-turbo-1106", - "gpt-3.5-turbo-16k", - "gpt-3.5-turbo-16k-0613" - ] - }, - "cohere": { - "name": "Cohere", - "models": [ - "command-nightly", - "command", - "command-light", - "command-medium-beta", - "command-xlarge-beta" - ] - }, - "azure": { - "name": "Azure", - "models": ["gpt-4-1106-preview", "gpt-3.5-turbo-16k", "gpt-3.5-turbo"] - } -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/hooks/data/parameters.json b/frontend/playgrounds/studio/app/(llm)/playground/hooks/data/parameters.json deleted file mode 100644 index 7c1491e..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/hooks/data/parameters.json +++ /dev/null @@ -1,47 +0,0 @@ -[ - { - "id": "temperature", - "name": "Temperature", - "type": "float", - "default": 1, - "min": 0, - "max": 2, - "step": 0.01 - }, - { - "id": "max_tokens", - "name": "Maximum length", - "type": "int", - "default": 256, - "min": 1, - "max": 4096, - "step": 1 - }, - { - "id": "top_p", - "name": "Top P", - "type": "float", - "default": 1, - "min": 0, - "max": 1, - "step": 0.01 - }, - { - "id": "frequency_penalty", - "name": "Frequency Penalty", - "type": "float", - "default": 0, - "min": 0, - "max": 2, - "step": 0.01 - }, - { - "id": "presence_penalty", - "name": "Presence Penalty", - "type": "float", - "default": 0, - "min": 0, - "max": 2, - "step": 0.01 - } -] diff --git a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useChat.tsx b/frontend/playgrounds/studio/app/(llm)/playground/hooks/useChat.tsx deleted file mode 100644 index 94a29ea..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useChat.tsx +++ /dev/null @@ -1,68 +0,0 @@ -import pathOr from "ramda/es/pathOr"; -import { useCallback } from "react"; -import { toast } from "sonner"; -import { useStore } from "~/app/(llm)/playground/store"; - -const BASE_URL = process.env.NEXT_PUBLIC_GATEWAY_URL ?? "http://localhost:3000"; -export const useChat = (): (() => Promise) => { - const { input, provider, model, parameters, setOutput, setStatus } = - useStore(); - - const submitChat = useCallback(async () => { - setStatus("waiting"); - setOutput(""); - - async function chatCompletions() { - try { - const providerResponse = await fetch( - `${BASE_URL}/api/v1/providers/${provider}` - ); - const providerData = await providerResponse.json(); - const apikey = pathOr("", ["provider", "config", "auth", "api_key"])( - providerData - ); - - if (!apikey) - return toast.error(`Provide API key for provider - ${provider}`); - - const response = await fetch(`${BASE_URL}/api/v1/chat/completions`, { - method: "post", - headers: { - "x-ms-provider": provider, - Authorization: `Bearer ${apikey}`, - "Content-Type": "application/json", - }, - body: JSON.stringify({ - messages: [ - { - role: "user", - content: input, - }, - ], - model: model, - temperature: parameters?.temperature, - max_tokens: parameters?.max_tokens, - top_p: parameters?.top_p, - frequency_penalty: parameters?.frequency_penalty, - presence_penalty: parameters?.presence_penalty, - }), - }); - const data = await response.json(); - if (data?.choices.length) { - setOutput(data.choices[0]?.message?.content); - } else { - setOutput(""); - } - } catch (e: any) { - toast.error(e.message); - setStatus("error"); - } finally { - setStatus("done"); - } - } - - chatCompletions(); - }, [input, model, parameters, provider, setStatus, setOutput]); - - return submitChat; -}; diff --git a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useExport.tsx b/frontend/playgrounds/studio/app/(llm)/playground/hooks/useExport.tsx deleted file mode 100644 index 5ff6825..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useExport.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import { useCallback } from "react"; -import { useStore } from "~/app/(llm)/playground/store"; - -export const useExport = (): ((selected?: any[]) => void) => { - const { logs } = useStore(); - const exportLogs = useCallback((selected?: any[]): void => {}, [logs]); - return exportLogs; -}; diff --git a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useLogsFetch.tsx b/frontend/playgrounds/studio/app/(llm)/playground/hooks/useLogsFetch.tsx deleted file mode 100644 index 7acf02c..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useLogsFetch.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import { useEffect } from "react"; -import { toast } from "sonner"; -import { useStore } from "~/app/(llm)/playground/store"; - -const BASE_URL = process.env.NEXT_PUBLIC_GATEWAY_URL ?? "http://localhost:3000"; -export function useLogsFetch() { - const { status, setLogs } = useStore(); - - useEffect(() => { - async function fetchLogs() { - try { - const response = await fetch(`${BASE_URL}/api/v1/tracking/logs`); - const { logs = [] } = await response.json(); - setLogs(logs); - } catch (e) { - toast.error("Tracking API is not available"); - } - } - - fetchLogs(); - }, [status, setLogs]); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useModelFetch.tsx b/frontend/playgrounds/studio/app/(llm)/playground/hooks/useModelFetch.tsx deleted file mode 100644 index 48bcac8..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useModelFetch.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import { useEffect, useState } from "react"; -import { toast } from "sonner"; - -interface ModelType { - name: string; - models: Model[]; -} - -interface Model { - name: string; - value: string; -} - -const BASE_URL = process.env.NEXT_PUBLIC_GATEWAY_URL ?? "http://localhost:3000"; -export function useModelFetch() { - const [providers, setProviders] = useState([]); - - useEffect(() => { - async function fetchModels() { - try { - const response = await fetch(`${BASE_URL}/api/v1/models`); - const { models } = await response.json(); - const fetchedProviders: ModelType[] = Object.keys(models).map( - (key) => ({ - name: models[key].name, - models: models[key].models, - }) - ); - setProviders(fetchedProviders); - } catch (e) { - toast.error("AI Studio is not running"); - } - } - - fetchModels(); - }, []); - - return { providers }; -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useParameterFetch.tsx b/frontend/playgrounds/studio/app/(llm)/playground/hooks/useParameterFetch.tsx deleted file mode 100644 index 5f2a902..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/hooks/useParameterFetch.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import { useEffect, useState } from "react"; -import { toast } from "sonner"; -import { useStore } from "~/app/(llm)/playground/store"; -import parametersData from "./data/parameters.json"; - -export interface ParameterType { - id: string; - name: string; - type: string; - default: number; - min?: number; - max?: number; - step?: number; -} - -export function useParameterFetch() { - const [parameters, setParameters] = useState([]); - const { provider } = useStore(); - - useEffect(() => { - async function fetchParameters() { - try { - var data = (parametersData as ParameterType[]) || []; - setParameters(data); - } catch (e) { - toast.error("AIstudio Engine is not running"); - } - } - - if (provider) fetchParameters(); - }, [provider]); - - return { parameters }; -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/page.tsx b/frontend/playgrounds/studio/app/(llm)/playground/page.tsx deleted file mode 100644 index 659cd85..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/page.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import { - DataTable, - Input, - ModelSelector, - Output, - Parameters, -} from "~/app/(llm)/playground/components"; - -export default function Playground() { - return ( - <> -
-
- - -
-
-
- -
-
- -
-
-
-
- -
- - ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/playground/store.tsx b/frontend/playgrounds/studio/app/(llm)/playground/store.tsx deleted file mode 100644 index ee9026e..0000000 --- a/frontend/playgrounds/studio/app/(llm)/playground/store.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import { create } from "zustand"; - -export interface Log { - provider: string; - model: string; - latency: string; - prompt_tokens: number; - completion_tokens: number; - total_tokens: number; -} - -interface Store { - status: string; - logs: Log[]; - input: string; - output: string; - provider: string; - model: string; - parameters: Record; - setStatus: (status: string) => void; - setLogs: (logs: Log[]) => void; - setInput: (input: string) => void; - setOutput: (output: string, isChunk?: boolean) => void; - setModel: (model: string) => void; - setProvider: (provider: string) => void; - setParameter: (parameter: string, value: any) => void; - getParameter: ( - parameter: string - ) => string | number | readonly string[] | undefined; -} - -export const useStore = create()((set, get) => ({ - status: "idle", - logs: [], - input: "", - output: "", - provider: "openai", - model: "gpt-3.5-turbo", - parameters: {}, - setStatus: (status) => set({ status: status }), - setLogs: (logs: Log[]) => set({ logs: logs }), - setInput: (input) => set({ input: input }), - setOutput: (output, isChunk = false) => - set((state) => ({ - output: isChunk ? state.output + output : output, - })), - setModel: (model) => set({ model: model }), - setProvider: (provider) => set({ provider: provider }), - setParameter: (parameter, value) => { - set((state) => ({ - parameters: { - ...state.parameters, - [parameter]: Number(value), - }, - })); - }, - getParameter: (parameter: string) => - get().parameters[parameter] as - | string - | number - | readonly string[] - | undefined, -})); diff --git a/frontend/playgrounds/studio/app/(llm)/providers/[providerId]/page.tsx b/frontend/playgrounds/studio/app/(llm)/providers/[providerId]/page.tsx deleted file mode 100644 index 9991fa1..0000000 --- a/frontend/playgrounds/studio/app/(llm)/providers/[providerId]/page.tsx +++ /dev/null @@ -1,256 +0,0 @@ -"use client"; - -import { EyeClosedIcon, EyeOpenIcon } from "@radix-ui/react-icons"; - -import { Button } from "@missingstudio/ui/button"; -import { Input } from "@missingstudio/ui/input"; -import { Loader } from "lucide-react"; -import Image from "next/image"; -import Link from "next/link"; -import { useParams } from "next/navigation"; -import mergeDeepRight from "ramda/es/mergeDeepRight"; -import pathOr from "ramda/es/pathOr"; - -import { Controller, SubmitHandler, useForm } from "react-hook-form"; -import { toast } from "sonner"; -import * as z from "zod"; - -import { Label } from "@missingstudio/ui/label"; -import { HTMLInputTypeAttribute, useEffect, useState } from "react"; -import ProvidersIcon from "~/public/providers-icon.svg"; -import ProvidersImg from "~/public/providers-image.png"; -import Star from "~/public/star.svg"; -import { useProviderFetch } from "../hooks/useProviderFetch"; - -const initialValues = { - config: { - auth: { - api_key: "", - }, - }, -}; -const formSchema = z.object({ - config: z.object({ - auth: z.object({ - api_key: z.string({ required_error: "Authorization is required" }), - }), - }), -}); -type FormValues = z.infer; - -const BASE_URL = process.env.NEXT_PUBLIC_GATEWAY_URL ?? "http://localhost:3000"; -export default function SingleProvider() { - const [authInputType, setAuthInputType] = - useState("password"); - const params = useParams<{ providerId: string }>(); - const { config, provider } = useProviderFetch(params.providerId); - - const defaultValue = mergeDeepRight(initialValues, provider ?? {}); - - const { - control, - getValues, - handleSubmit, - formState: { errors, isValid, isLoading }, - reset, - } = useForm({ - defaultValues: defaultValue, - mode: "all", - }); - - useEffect(() => { - reset(defaultValue); - }, [provider]); - - const onSubmit: SubmitHandler = async () => { - try { - const data = getValues(); - const response = await fetch( - `${BASE_URL}/api/v1/providers/${params.providerId}`, - { - method: "put", - body: JSON.stringify(data), - headers: { - "Content-Type": "application/json", - }, - } - ); - var res = await response.json(); - if (!response.ok) { - return toast.error("Something went wrong", { - description: res.message, - }); - } - - toast.info("Updated", { - description: "Configuration has been updated", - }); - } catch (error) { - toast.error("Something went wrong", { - description: "Not able to update configurations", - }); - } - }; - - const authProperties = pathOr({}, ["properties", "auth", "properties"])( - config - ) as Record; - - const requiredAuthProperties = pathOr( - [], - ["properties", "auth", "required"] - )(config) as String[]; - - return ( -
-
-
-
-
-
-
-
-
- - Go back - - - - -
-
- -
-
-
- Provider image -
- -

GitHub

- -
-

Overview

-

- This powerful GitHub provider keeps your work in sync - in both applications. It links features to Pull - Requests so that details update automatically from In - Progress to Done as the PR moves from drafted to - merged - there is no need to update the issue in - Stellar at all. -

-
-
-
-
-
-
- - -
-
-
-
- ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/providers/hooks/useProviderFetch.tsx b/frontend/playgrounds/studio/app/(llm)/providers/hooks/useProviderFetch.tsx deleted file mode 100644 index ce2f5a9..0000000 --- a/frontend/playgrounds/studio/app/(llm)/providers/hooks/useProviderFetch.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import { useEffect, useState } from "react"; -import { toast } from "sonner"; - -export interface Provider { - name: string; - title: string; - description: string; -} - -const BASE_URL = process.env.NEXT_PUBLIC_GATEWAY_URL ?? "http://localhost:3000"; -export function useProviderFetch(pname: string) { - const [provider, setProvider] = useState(); - const [config, setConfig] = useState(); - - useEffect(() => { - async function fetchProvider() { - try { - const response = await fetch(`${BASE_URL}/api/v1/providers/${pname}`); - const { provider } = await response.json(); - - setProvider(provider); - } catch (e) { - toast.error("AI Studio is not running"); - } - } - - fetchProvider(); - }, []); - useEffect(() => { - async function fetchProviderConfig() { - try { - const response = await fetch( - `${BASE_URL}/api/v1/providers/${pname}/config` - ); - const { config } = await response.json(); - - setConfig(config); - } catch (e) { - toast.error("AI Studio is not running"); - } - } - - fetchProviderConfig(); - }, []); - - return { provider, config }; -} diff --git a/frontend/playgrounds/studio/app/(llm)/providers/hooks/useProvidersFetch.tsx b/frontend/playgrounds/studio/app/(llm)/providers/hooks/useProvidersFetch.tsx deleted file mode 100644 index 3ad4e44..0000000 --- a/frontend/playgrounds/studio/app/(llm)/providers/hooks/useProvidersFetch.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { useEffect, useState } from "react"; -import { toast } from "sonner"; - -export interface Provider { - name: string; - title: string; - description: string; -} - -const BASE_URL = process.env.NEXT_PUBLIC_GATEWAY_URL ?? "http://localhost:3000"; -export function useProvidersFetch() { - const [providers, setProviders] = useState([]); - - useEffect(() => { - async function fetchModels() { - try { - const response = await fetch(`${BASE_URL}/api/v1/providers`); - const { providers } = await response.json(); - - setProviders(providers); - } catch (e) { - toast.error("AI Studio is not running"); - } - } - - fetchModels(); - }, []); - - return { providers }; -} diff --git a/frontend/playgrounds/studio/app/(llm)/providers/page.tsx b/frontend/playgrounds/studio/app/(llm)/providers/page.tsx deleted file mode 100644 index a5f190d..0000000 --- a/frontend/playgrounds/studio/app/(llm)/providers/page.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import ProvidersList from "./providers-list"; - -export const metadata = { - title: "Providers - AI studio", - description: "List of providers", -}; - -export default function Providers() { - return ( - <> -
- -
- - ); -} diff --git a/frontend/playgrounds/studio/app/(llm)/providers/providers-list.tsx b/frontend/playgrounds/studio/app/(llm)/providers/providers-list.tsx deleted file mode 100644 index d032316..0000000 --- a/frontend/playgrounds/studio/app/(llm)/providers/providers-list.tsx +++ /dev/null @@ -1,71 +0,0 @@ -"use client"; -import Link from "next/link"; -import { usePathname } from "next/navigation"; -import { Provider, useProvidersFetch } from "./hooks/useProvidersFetch"; - -export default function ProvidersList() { - const { providers } = useProvidersFetch(); - - return ( -
-
-
-
-
-

-
- Providers -
-

- -
- {providers.map((provider, index) => ( - - ))} -
-
-
-
-
-
- ); -} - -type CardProps = { - provider: Provider; - index: number; -}; - -export function ProviderCard({ provider, index }: CardProps) { - const pathname = usePathname(); - - return ( -
-
-
- - {provider.title} - -
-
-
- {provider.description} -
-
-
-
- ); -} diff --git a/frontend/playgrounds/studio/app/favicon.ico b/frontend/playgrounds/studio/app/favicon.ico deleted file mode 100644 index df443b9..0000000 Binary files a/frontend/playgrounds/studio/app/favicon.ico and /dev/null differ diff --git a/frontend/playgrounds/studio/app/layout.tsx b/frontend/playgrounds/studio/app/layout.tsx deleted file mode 100644 index dacccd4..0000000 --- a/frontend/playgrounds/studio/app/layout.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import type { Metadata } from "next"; -import Header from "~/components/header"; -import { ThemeProvider } from "~/components/theme-provider"; -import { Toaster } from "~/components/toaster"; -import { spaceGrotesk } from "~/styles/fonts"; -import "~/styles/globals.css"; - -export const metadata: Metadata = { - title: "AIstudio", - description: "A Robust Open Source AI studio", -}; - -export default function RootLayout({ - children, -}: { - children: React.ReactNode; -}) { - return ( - - - -
- - {children} - - - - ); -} diff --git a/frontend/playgrounds/studio/app/page.tsx b/frontend/playgrounds/studio/app/page.tsx deleted file mode 100644 index aa509d3..0000000 --- a/frontend/playgrounds/studio/app/page.tsx +++ /dev/null @@ -1,6 +0,0 @@ -"use client"; -import Playground from "./(llm)/playground/page"; - -export default function Page(): JSX.Element { - return ; -} diff --git a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Bold.ttf b/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Bold.ttf deleted file mode 100644 index 0408641..0000000 Binary files a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Bold.ttf and /dev/null differ diff --git a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Light.ttf b/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Light.ttf deleted file mode 100644 index d41bccc..0000000 Binary files a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Light.ttf and /dev/null differ diff --git a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Medium.ttf b/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Medium.ttf deleted file mode 100644 index 7d44b66..0000000 Binary files a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Medium.ttf and /dev/null differ diff --git a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Regular.ttf b/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Regular.ttf deleted file mode 100644 index 981bcf5..0000000 Binary files a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-Regular.ttf and /dev/null differ diff --git a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-SemiBold.ttf b/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-SemiBold.ttf deleted file mode 100644 index e7e02e5..0000000 Binary files a/frontend/playgrounds/studio/assets/fonts/SpaceGrotesk-SemiBold.ttf and /dev/null differ diff --git a/frontend/playgrounds/studio/bun.lockb b/frontend/playgrounds/studio/bun.lockb deleted file mode 100755 index 339b8dc..0000000 Binary files a/frontend/playgrounds/studio/bun.lockb and /dev/null differ diff --git a/frontend/playgrounds/studio/components/codeblock.tsx b/frontend/playgrounds/studio/components/codeblock.tsx deleted file mode 100644 index 89db107..0000000 --- a/frontend/playgrounds/studio/components/codeblock.tsx +++ /dev/null @@ -1,70 +0,0 @@ -import hljs from "highlight.js"; -import { useState } from "react"; -import { cn } from "~/lib/utils"; - -import CopyButton from "~/components/copybutton"; - -function CodeBlock({ - language, - value, - className, - codeClass, - copyable = true, - codeWrap = false, - copyOnHover = false, - noCodeFont = false, - noMask = true, -}: { - language: string; - value: string; - className?: string; - codeClass?: string; - copyable?: boolean; - codeWrap?: boolean; - copyOnHover?: boolean; - noCodeFont?: boolean; - noMask?: boolean; -}) { - value = value || ""; - hljs.getLanguage(language) ? (language = language) : (language = "plaintext"); - const highlightedCode = hljs.highlight(value, { language }).value; - const [isBlockHovered, setIsBlockHovered] = useState(false); - - return ( - 
 {
-        setIsBlockHovered(true);
-      }}
-      onMouseLeave={() => {
-        setIsBlockHovered(false);
-      }}
-    >
-      
-
-      {!noMask && (
-        

-      )}
-      
-
- ); -} - -export default CodeBlock; diff --git a/frontend/playgrounds/studio/components/copybutton.tsx b/frontend/playgrounds/studio/components/copybutton.tsx deleted file mode 100644 index b5f3e12..0000000 --- a/frontend/playgrounds/studio/components/copybutton.tsx +++ /dev/null @@ -1,95 +0,0 @@ -import copy from "copy-to-clipboard"; -import { AnimatePresence, MotionConfig, motion } from "framer-motion"; -import { useCallback, useState } from "react"; - -import { cn } from "~/lib/utils"; - -export default function CopyButton({ - value, - copyable = true, - isBlockHovered, - className, -}: { - value: string; - copyable?: boolean; - isBlockHovered?: boolean; - className?: string; -}) { - const [copying, setCopying] = useState(0); - - const onCopy = useCallback(() => { - copy(value); - setCopying((c) => c + 1); - setTimeout(() => { - setCopying((c) => c - 1); - }, 2000); - }, [value]); - - if (!value || !copyable) return <>; - - const variants = { - visible: { opacity: 1, scale: 1 }, - hidden: { opacity: 0, scale: 0.5 }, - }; - return ( - - ); -} diff --git a/frontend/playgrounds/studio/components/form.tsx b/frontend/playgrounds/studio/components/form.tsx deleted file mode 100644 index c1a0720..0000000 --- a/frontend/playgrounds/studio/components/form.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import { zodResolver } from "@hookform/resolvers/zod"; -import { useEffect } from "react"; -import { - FieldValues, - SubmitHandler, - UseFormProps, - UseFormReturn, - useForm, -} from "react-hook-form"; -import type { Schema } from "zod"; - -type ServerErrors = { - [Property in keyof T]: string; -}; - -type FormProps = { - onSubmit: SubmitHandler; - children: (methods: UseFormReturn) => React.ReactNode; - useFormProps?: UseFormProps; - validationSchema?: Schema; - fieldErrors?: any[] | null; - formError?: string | string[] | null | any; - serverError?: ServerErrors> | null; - resetValues?: any | null; - className?: string; -}; - -export const Form = < - TFormValues extends Record = Record, ->({ - onSubmit, - children, - useFormProps, - validationSchema, - fieldErrors, - formError, - resetValues, - className, - ...formProps -}: FormProps) => { - const methods = useForm({ - ...useFormProps, - ...(validationSchema && { resolver: zodResolver(validationSchema) }), - }); - - useEffect(() => { - if (resetValues) { - methods.reset(resetValues); - } - }, [resetValues, methods]); - - return ( -
- {children(methods)} -
- ); -}; diff --git a/frontend/playgrounds/studio/components/header.tsx b/frontend/playgrounds/studio/components/header.tsx deleted file mode 100644 index ef60538..0000000 --- a/frontend/playgrounds/studio/components/header.tsx +++ /dev/null @@ -1,80 +0,0 @@ -"use client"; -import React, { useMemo } from "react"; -import { Toggle } from "~/components/theme"; - -import { Button } from "@missingstudio/ui/button"; -import { Blocks, BookAIcon, Shapes } from "lucide-react"; -import Link from "next/link"; -import { usePathname } from "next/navigation"; - -const links = [ - { - name: "Docs", - route: "https://docs.missing.studio", - icon: BookAIcon, - }, -]; - -const navigations = { - playground: { - name: "Playground", - route: "/playground", - icon: Shapes, - }, - providers: { - name: "Providers", - route: "/providers", - icon: Blocks, - }, -}; - -export default function Header() { - const pathName = usePathname(); - const selectedPage = useMemo(() => { - if (pathName.endsWith("/playground")) { - return "playground"; - } - - if (pathName.endsWith("/providers")) { - return "providers"; - } - - return "playground"; - }, [pathName]); - - const page = navigations[selectedPage]; - return ( -
-
- AIstudio -
-
- {Object.values(navigations).map((link) => ( - - ))} - - {links.map((link) => ( - - ))} - -
-
- ); -} diff --git a/frontend/playgrounds/studio/components/markdown.tsx b/frontend/playgrounds/studio/components/markdown.tsx deleted file mode 100644 index 1bd8c13..0000000 --- a/frontend/playgrounds/studio/components/markdown.tsx +++ /dev/null @@ -1,232 +0,0 @@ -import React from "react"; -import ReactMarkdown from "react-markdown"; -import rehypeAutolinkHeadings from "rehype-autolink-headings"; -import rehypeKatex from "rehype-katex"; -import rehypeRaw from "rehype-raw"; -import rehypeSlug from "rehype-slug"; -import remarkEmoji from "remark-emoji"; -import remarkGfm from "remark-gfm"; -import remarkMath from "remark-math"; - -import CodeBlock from "~/components/codeblock"; -import { cn } from "~/lib/utils"; - -interface ComponentTypes { - className?: string; - href?: string; - [key: string]: any; -} - -function Markdown({ - code, - codeCopyable = false, - codeClass = "", - className, -}: { - code: string; - codeCopyable?: boolean; - codeClass?: string; - className?: string; -}) { - const components = { - h1: ({ className, ...props }: ComponentTypes) => ( -

- ), - h2: ({ className, ...props }: ComponentTypes) => ( -

- ), - h3: ({ className, ...props }: ComponentTypes) => ( -

- ), - h4: ({ className, ...props }: ComponentTypes) => ( -

- ), - h5: ({ className, ...props }: ComponentTypes) => ( -

- ), - h6: ({ className, ...props }: ComponentTypes) => ( -
- ), - a: ({ className, href, ...props }: ComponentTypes) => { - const isHashURL = href?.includes("#"); // Ex. https://example.com#section - - return ( - - ); - }, - p: ({ className, ...props }: ComponentTypes) => ( -

- ), - ul: ({ className, ...props }: ComponentTypes) => ( -

    - ), - ol: ({ className, ...props }: ComponentTypes) => ( -
      - ), - li: ({ className, ...props }: ComponentTypes) => ( -
    1. - ), - blockquote: ({ className, ...props }: ComponentTypes) => ( -
      *]:text-muted-foreground", - className - )} - {...props} - /> - ), - img: ({ - className, - alt, - ...props - }: React.ImgHTMLAttributes) => ( - // eslint-disable-next-line @next/next/no-img-element - {alt} - ), - iframe: ({ className, ...props }: ComponentTypes) => ( -