Skip to content

Commit

Permalink
Attempt to get i18n working
Browse files Browse the repository at this point in the history
  • Loading branch information
@vanpelt
vanpelt committed Jun 23, 2024
1 parent b294b29 commit 3b2bce4
Show file tree
Hide file tree
Showing 5 changed files with 203 additions and 155 deletions.
305 changes: 153 additions & 152 deletions frontend/package.json
View file
Original file line number Diff line number Diff line change
@@ -1,154 +1,155 @@
{
"name": "openui",
"license": "MIT",
"private": true,
"version": "1.0.0",
"type": "module",
"scripts": {
"build": "vite build",
"postbuild": "rm -rf ../backend/openui/dist && cp -r dist ../backend/openui/dist",
"deploy": "npm run build -- --mode hosted && fly deploy ../backend",
"commit": "cz",
"dev": "vite --open",
"prepare": "cd .. && husky install frontend/.husky",
"preview": "vite preview",
"preview:test": "start-server-and-test preview http://localhost:4173",
"test": "vitest",
"test:ci": "vitest run",
"test:e2e": "pnpm preview:test 'cypress open'",
"test:e2e:headless": "pnpm preview:test 'cypress run'",
"test:e2e:ci": "vite build && pnpm preview:test 'cypress run --record'",
"format": "prettier -uw --cache --ignore-path .gitignore .",
"run-tsc": "tsc",
"run-eslint": "eslint --cache --fix --ignore-path .gitignore --ext .ts,.tsx .",
"run-stylelint": "stylelint --cache --fix --ignore-path .gitignore **/*.css",
"lint": "run-p run-tsc run-eslint run-stylelint",
"validate": "run-p lint test:ci test:e2e:headless"
},
"dependencies": {
"@monaco-editor/react": "^4.6.0",
"@radix-ui/react-avatar": "^1.0.4",
"@radix-ui/react-checkbox": "^1.0.4",
"@radix-ui/react-dialog": "^1.0.5",
"@radix-ui/react-dropdown-menu": "^2.0.6",
"@radix-ui/react-hover-card": "^1.0.7",
"@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-label": "^2.0.2",
"@radix-ui/react-popover": "^1.0.7",
"@radix-ui/react-select": "^2.0.0",
"@radix-ui/react-slider": "^1.1.2",
"@radix-ui/react-slot": "^1.0.2",
"@radix-ui/react-switch": "^1.0.3",
"@radix-ui/react-tooltip": "^1.0.7",
"@tailwindcss/typography": "^0.5.13",
"@tanstack/react-query": "^5.36.0",
"@types/mdast": "^4.0.3",
"@uiw/copy-to-clipboard": "^1.0.17",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"groq-sdk": "^0.3.3",
"i18next": "^23.11.5",
"jotai": "^2.8.0",
"jotai-devtools": "^0.10.0",
"jotai-minidb": "^0.0.8",
"js-cookie": "^3.0.5",
"litellm": "^0.12.0",
"lucide-react": "^0.378.0",
"monaco-editor": "^0.49.0",
"monaco-tailwindcss": "^0.6.0",
"nanoid": "^5.0.7",
"openai": "^4.45.0",
"prettier": "^3.2.5",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-i18next": "^14.1.2",
"react-markdown": "^9.0.1",
"react-router-dom": "^6.23.1",
"react-syntax-highlighter": "^15.5.0",
"remark": "^15.0.1",
"remark-frontmatter": "^5.0.0",
"remark-parse": "^11.0.0",
"tailwind-merge": "^2.3.0",
"tailwindcss-animate": "^1.0.7",
"unified": "^11.0.4",
"unsplash-js": "^7.0.19"
},
"devDependencies": {
"@nabla/vite-plugin-eslint": "^2.0.4",
"@playwright/test": "^1.44.1",
"@tailwindcss/forms": "^0.5.7",
"@testing-library/dom": "^10.1.0",
"@testing-library/jest-dom": "^6.4.5",
"@testing-library/react": "^15.0.7",
"@testing-library/user-event": "^14.5.2",
"@types/css-mediaquery": "^0.1.4",
"@types/js-cookie": "^3.0.6",
"@types/node": "^20.14.7",
"@types/react": "^18.3.2",
"@types/react-dom": "^18.3.0",
"@types/react-router-dom": "^5.3.3",
"@types/react-syntax-highlighter": "^15.5.13",
"@typescript-eslint/eslint-plugin": "^7.8.0",
"@typescript-eslint/parser": "^7.8.0",
"@vitejs/plugin-react": "^4.2.1",
"@vitest/coverage-istanbul": "^1.6.0",
"autoprefixer": "^10.4.19",
"commitizen": "^4.3.0",
"css-mediaquery": "^0.1.2",
"cz-conventional-changelog": "^3.3.0",
"eslint": "^8.57.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-config-airbnb-typescript": "^18.0.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-import": "^2.29.1",
"eslint-plugin-jsx-a11y": "^6.8.0",
"eslint-plugin-react": "^7.34.1",
"eslint-plugin-react-hooks": "^4.6.2",
"eslint-plugin-react-prefer-function-component": "^3.3.0",
"eslint-plugin-testing-library": "^6.2.2",
"eslint-plugin-unicorn": "^53.0.0",
"husky": "^9.0.11",
"jsdom": "^24.0.0",
"lint-staged": "^15.2.2",
"msw": "^2.3.0",
"npm-run-all": "^4.1.5",
"ollama": "^0.5.1",
"postcss": "^8.4.38",
"prettier-plugin-tailwindcss": "^0.5.14",
"start-server-and-test": "^2.0.3",
"stylelint": "^16.5.0",
"stylelint-config-standard": "^36.0.0",
"tailwindcss": "^3.4.3",
"typescript": "^5.4.5",
"vite": "^5.2.11",
"vite-plugin-mkcert": "^1.17.5",
"vite-plugin-monaco-editor": "^1.1.0",
"vite-plugin-pwa": "^0.20.0",
"vite-tsconfig-paths": "^4.3.2",
"vitest": "^1.6.0",
"whatwg-fetch": "^3.6.20",
"workbox-build": "^7.1.0",
"workbox-window": "^7.1.0"
},
"browserslist": {
"production": "Edge >= 18, Firefox >= 60, Chrome >= 61, Safari >= 11, Opera >= 48",
"development": [
"last 1 chrome version",
"last 1 firefox version"
]
},
"lint-staged": {
"*": "prettier -uw --cache",
"*.css": "stylelint --cache --fix",
"*.{ts,tsx}": [
"eslint --cache --fix",
"vitest related --run --coverage=false"
]
},
"pnpm": {
"overrides": {
"headers-polyfill": "3.1.2"
}
}
"name": "openui",
"license": "MIT",
"private": true,
"version": "1.0.0",
"type": "module",
"scripts": {
"build": "vite build",
"postbuild": "rm -rf ../backend/openui/dist && cp -r dist ../backend/openui/dist",
"deploy": "npm run build -- --mode hosted && fly deploy ../backend && git restore backend/openui/dist && git clean -f ../backend/openui/dist/assets/",
"commit": "cz",
"dev": "vite --open",
"prepare": "cd .. && husky install frontend/.husky",
"preview": "vite preview",
"preview:test": "start-server-and-test preview http://localhost:4173",
"test": "vitest",
"test:ci": "vitest run",
"test:e2e": "pnpm preview:test 'cypress open'",
"test:e2e:headless": "pnpm preview:test 'cypress run'",
"test:e2e:ci": "vite build && pnpm preview:test 'cypress run --record'",
"format": "prettier -uw --cache --ignore-path .gitignore .",
"run-tsc": "tsc",
"run-eslint": "eslint --cache --fix --ignore-path .gitignore --ext .ts,.tsx .",
"run-stylelint": "stylelint --cache --fix --ignore-path .gitignore **/*.css",
"lint": "run-p run-tsc run-eslint run-stylelint",
"validate": "run-p lint test:ci test:e2e:headless"
},
"dependencies": {
"@monaco-editor/react": "^4.6.0",
"@radix-ui/react-avatar": "^1.0.4",
"@radix-ui/react-checkbox": "^1.0.4",
"@radix-ui/react-dialog": "^1.0.5",
"@radix-ui/react-dropdown-menu": "^2.0.6",
"@radix-ui/react-hover-card": "^1.0.7",
"@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-label": "^2.0.2",
"@radix-ui/react-popover": "^1.0.7",
"@radix-ui/react-select": "^2.0.0",
"@radix-ui/react-slider": "^1.1.2",
"@radix-ui/react-slot": "^1.0.2",
"@radix-ui/react-switch": "^1.0.3",
"@radix-ui/react-tooltip": "^1.0.7",
"@tailwindcss/typography": "^0.5.13",
"@tanstack/react-query": "^5.36.0",
"@types/mdast": "^4.0.3",
"@uiw/copy-to-clipboard": "^1.0.17",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"groq-sdk": "^0.3.3",
"i18next": "^23.11.5",
"i18next-browser-languagedetector": "^8.0.0",
"jotai": "^2.8.0",
"jotai-devtools": "^0.10.0",
"jotai-minidb": "^0.0.8",
"js-cookie": "^3.0.5",
"litellm": "^0.12.0",
"lucide-react": "^0.378.0",
"monaco-editor": "^0.49.0",
"monaco-tailwindcss": "^0.6.0",
"nanoid": "^5.0.7",
"openai": "^4.45.0",
"prettier": "^3.2.5",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-i18next": "^14.1.2",
"react-markdown": "^9.0.1",
"react-router-dom": "^6.23.1",
"react-syntax-highlighter": "^15.5.0",
"remark": "^15.0.1",
"remark-frontmatter": "^5.0.0",
"remark-parse": "^11.0.0",
"tailwind-merge": "^2.3.0",
"tailwindcss-animate": "^1.0.7",
"unified": "^11.0.4",
"unsplash-js": "^7.0.19"
},
"devDependencies": {
"@nabla/vite-plugin-eslint": "^2.0.4",
"@playwright/test": "^1.44.1",
"@tailwindcss/forms": "^0.5.7",
"@testing-library/dom": "^10.1.0",
"@testing-library/jest-dom": "^6.4.5",
"@testing-library/react": "^15.0.7",
"@testing-library/user-event": "^14.5.2",
"@types/css-mediaquery": "^0.1.4",
"@types/js-cookie": "^3.0.6",
"@types/node": "^20.14.7",
"@types/react": "^18.3.2",
"@types/react-dom": "^18.3.0",
"@types/react-router-dom": "^5.3.3",
"@types/react-syntax-highlighter": "^15.5.13",
"@typescript-eslint/eslint-plugin": "^7.8.0",
"@typescript-eslint/parser": "^7.8.0",
"@vitejs/plugin-react": "^4.2.1",
"@vitest/coverage-istanbul": "^1.6.0",
"autoprefixer": "^10.4.19",
"commitizen": "^4.3.0",
"css-mediaquery": "^0.1.2",
"cz-conventional-changelog": "^3.3.0",
"eslint": "^8.57.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-config-airbnb-typescript": "^18.0.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-import": "^2.29.1",
"eslint-plugin-jsx-a11y": "^6.8.0",
"eslint-plugin-react": "^7.34.1",
"eslint-plugin-react-hooks": "^4.6.2",
"eslint-plugin-react-prefer-function-component": "^3.3.0",
"eslint-plugin-testing-library": "^6.2.2",
"eslint-plugin-unicorn": "^53.0.0",
"husky": "^9.0.11",
"jsdom": "^24.0.0",
"lint-staged": "^15.2.2",
"msw": "^2.3.0",
"npm-run-all": "^4.1.5",
"ollama": "^0.5.1",
"postcss": "^8.4.38",
"prettier-plugin-tailwindcss": "^0.5.14",
"start-server-and-test": "^2.0.3",
"stylelint": "^16.5.0",
"stylelint-config-standard": "^36.0.0",
"tailwindcss": "^3.4.3",
"typescript": "^5.4.5",
"vite": "^5.2.11",
"vite-plugin-mkcert": "^1.17.5",
"vite-plugin-monaco-editor": "^1.1.0",
"vite-plugin-pwa": "^0.20.0",
"vite-tsconfig-paths": "^4.3.2",
"vitest": "^1.6.0",
"whatwg-fetch": "^3.6.20",
"workbox-build": "^7.1.0",
"workbox-window": "^7.1.0"
},
"browserslist": {
"production": "Edge >= 18, Firefox >= 60, Chrome >= 61, Safari >= 11, Opera >= 48",
"development": [
"last 1 chrome version",
"last 1 firefox version"
]
},
"lint-staged": {
"*": "prettier -uw --cache",
"*.css": "stylelint --cache --fix",
"*.{ts,tsx}": [
"eslint --cache --fix",
"vitest related --run --coverage=false"
]
},
"pnpm": {
"overrides": {
"headers-polyfill": "3.1.2"
}
}
}
10 changes: 10 additions & 0 deletions frontend/pnpm-lock.yaml
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

7 changes: 4 additions & 3 deletions frontend/src/components/Chat.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import {
} from 'lib/utils'
import { CircleUser, ImageIcon } from 'lucide-react'
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { useParams } from 'react-router-dom'
import {
ItemWrapper,
Expand Down Expand Up @@ -56,7 +57,7 @@ export default function Chat({ isShared = false }: { isShared: boolean }) {
[rawItem, setRawItem]
)

// const { t } = useTranslation()
const { t } = useTranslation()
const [uiState, setUiState] = useAtom(uiStateAtom)
const uiTheme = useAtomValue(uiThemeAtom)
const theme = themes.find(th => th.name === uiTheme)
Expand Down Expand Up @@ -207,11 +208,11 @@ export default function Chat({ isShared = false }: { isShared: boolean }) {
/>
) : undefined}
<h1 className='mb-1 flex-row text-center text-2xl font-medium text-zinc-800 dark:text-zinc-300 md:text-3xl'>
Describe the UI you&apos;d like to generate.
{t('Chat Header')}
</h1>
{modelSupportsImages ? (
<h2 className='mb-4 text-center text-lg font-normal text-muted-foreground md:text-xl'>
Pro Tip: You can drag or paste a reference screenshot.
{t('Pro Tip')}
</h2>
) : undefined}
</div>
Expand Down
Loading

0 comments on commit 3b2bce4

Please sign in to comment.