Github/screenshot-to-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move stack info to a separate file

Browse Source
This commit is contained in:
Abi Raja 2024-01-09 06:43:32 -08:00
parent a8b562e392
commit 3723c81a04
4 changed files with 28 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/components/OutputSettingsSection.tsx
View File

@ -6,11 +6,12 @@ import {
SelectItem,
SelectTrigger,
} from "./ui/select";
import { GeneratedCodeConfig, STACK_DESCRIPTION } from "../types";
import { Badge } from "./ui/badge";
import { GeneratedCodeConfig } from "../lib/stacks/types";
import { STACK_DESCRIPTIONS } from "../lib/stacks/descriptions";
function generateDisplayComponent(stack: GeneratedCodeConfig) {
const stackComponents = STACK_DESCRIPTION[stack].components;
const stackComponents = STACK_DESCRIPTIONS[stack].components;
return (
<div>
@ -59,7 +60,7 @@ function OutputSettingsSection({
<SelectItem value={stack}>
<div className="flex items-center">
{generateDisplayComponent(stack)}
{STACK_DESCRIPTION[stack].inBeta && (
{STACK_DESCRIPTIONS[stack].inBeta && (
<Badge className="ml-2" variant="secondary">
Beta
</Badge>

12
frontend/src/lib/stacks/descriptions.ts Normal file
View File

@ -0,0 +1,12 @@
import { GeneratedCodeConfig } from "./types";
export const STACK_DESCRIPTIONS: {
[key in GeneratedCodeConfig]: { components: string[]; inBeta: boolean };
} = {
html_tailwind: { components: ["HTML", "Tailwind"], inBeta: false },
react_tailwind: { components: ["React", "Tailwind"], inBeta: false },
bootstrap: { components: ["Bootstrap"], inBeta: false },
vue_tailwind: { components: ["Vue", "Tailwind"], inBeta: true },
ionic_tailwind: { components: ["Ionic", "Tailwind"], inBeta: true },
svg: { components: ["SVG"], inBeta: true },
};

9
frontend/src/lib/stacks/types.ts Normal file
View File

@ -0,0 +1,9 @@
// Keep in sync with backend (prompts/types.py)
export enum GeneratedCodeConfig {
HTML_TAILWIND = "html_tailwind",
REACT_TAILWIND = "react_tailwind",
BOOTSTRAP = "bootstrap",
VUE_TAILWIND = "vue_tailwind",
IONIC_TAILWIND = "ionic_tailwind",
SVG = "svg",
}

24
frontend/src/types.ts
View File

@ -1,29 +1,10 @@
import { GeneratedCodeConfig } from "./lib/stacks/types";
export enum EditorTheme {
ESPRESSO = "espresso",
COBALT = "cobalt",
}
// Keep in sync with backend (prompts/types.py)
export enum GeneratedCodeConfig {
HTML_TAILWIND = "html_tailwind",
REACT_TAILWIND = "react_tailwind",
BOOTSTRAP = "bootstrap",
VUE_TAILWIND = "vue_tailwind",
IONIC_TAILWIND = "ionic_tailwind",
SVG = "svg",
}
export const STACK_DESCRIPTION: {
[key in GeneratedCodeConfig]: { components: string[]; inBeta: boolean };
} = {
html_tailwind: { components: ["HTML", "Tailwind"], inBeta: false },
react_tailwind: { components: ["React", "Tailwind"], inBeta: false },
bootstrap: { components: ["Bootstrap"], inBeta: false },
vue_tailwind: { components: ["Vue", "Tailwind"], inBeta: true },
ionic_tailwind: { components: ["Ionic", "Tailwind"], inBeta: true },
svg: { components: ["SVG"], inBeta: true },
};
export interface Settings {
openAiApiKey: string | null;
openAiBaseURL: string | null;
@ -51,3 +32,4 @@ export interface CodeGenerationParams {
}
export type FullGenerationSettings = CodeGenerationParams & Settings;
export { GeneratedCodeConfig };