refactor(i18n): add i18n context provider

This commit is contained in:
kunish 2023-09-23 01:46:42 +08:00
parent e4a324625f
commit 81bab5d0ab
No known key found for this signature in database
GPG Key ID: 647A12B4F782C430
3 changed files with 36 additions and 36 deletions

View File

@ -5,6 +5,7 @@ import { Toaster } from 'solid-toast'
import { twMerge } from 'tailwind-merge'
import { Header } from '~/components'
import { ROUTES } from '~/constants'
import { I18nProvider, locale } from '~/i18n'
import {
WsMsg,
autoSwitchTheme,
@ -59,36 +60,38 @@ export const App = () => {
})
return (
<div
class={twMerge(
'relative flex h-screen flex-col subpixel-antialiased p-safe',
useTwemoji() ? 'font-twemoji' : 'font-no-twemoji',
)}
data-theme={curTheme()}
>
<Header />
<I18nProvider locale={locale()}>
<div
class={twMerge(
'relative flex h-screen flex-col subpixel-antialiased p-safe',
useTwemoji() ? 'font-twemoji' : 'font-no-twemoji',
)}
data-theme={curTheme()}
>
<Header />
<div class="flex-1 overflow-y-auto p-2 sm:p-4">
<Routes>
<Show when={endpoint()}>
<Route path={ROUTES.Overview} component={Overview} />
<Route path={ROUTES.Proxies} component={Proxies} />
<Route path={ROUTES.Rules} component={Rules} />
<Route path={ROUTES.Conns} component={Connections} />
<Route path={ROUTES.Log} component={Logs} />
<Route path={ROUTES.Config} component={Config} />
<Route path="*" element={<Navigate href={ROUTES.Overview} />} />
</Show>
<Route path={endpoint() ? ROUTES.Setup : '*'} component={Setup} />
</Routes>
<div class="flex-1 overflow-y-auto p-2 sm:p-4">
<Routes>
<Show when={endpoint()}>
<Route path={ROUTES.Overview} component={Overview} />
<Route path={ROUTES.Proxies} component={Proxies} />
<Route path={ROUTES.Rules} component={Rules} />
<Route path={ROUTES.Conns} component={Connections} />
<Route path={ROUTES.Log} component={Logs} />
<Route path={ROUTES.Config} component={Config} />
<Route path="*" element={<Navigate href={ROUTES.Overview} />} />
<ProtectedResources />
</Show>
</div>
<Route path={endpoint() ? ROUTES.Setup : '*'} component={Setup} />
</Routes>
<Show when={endpoint()}>
<ProtectedResources />
</Show>
<Toaster position="bottom-center" />
</div>
<Toaster position="bottom-center" />
</div>
</I18nProvider>
)
}

View File

@ -7,17 +7,14 @@ import 'dayjs/locale/zh-cn'
import relativeTime from 'dayjs/plugin/relativeTime'
import { render } from 'solid-js/web'
import { App } from '~/App'
import { I18nProvider, locale } from '~/i18n'
dayjs.extend(relativeTime)
render(
() => (
<I18nProvider locale={locale()}>
<Router source={hashIntegration()}>
<App />
</Router>
</I18nProvider>
<Router source={hashIntegration()}>
<App />
</Router>
),
document.getElementById('root')!,
)

View File

@ -15,7 +15,7 @@ import {
getFilteredRowModel,
getSortedRowModel,
} from '@tanstack/solid-table'
import { For, Index, createEffect, createMemo, createSignal } from 'solid-js'
import { For, Index, createEffect, createSignal } from 'solid-js'
import { twMerge } from 'tailwind-merge'
import { Button, LogsSettingsModal } from '~/components'
import { LOG_LEVEL, MODAL } from '~/constants'
@ -65,7 +65,7 @@ export default () => {
storage: localStorage,
})
const columns = createMemo<ColumnDef<LogWithSeq>[]>(() => [
const columns: ColumnDef<LogWithSeq>[] = [
{
header: t('sequence'),
accessorFn: (row) => row.seq,
@ -100,7 +100,7 @@ export default () => {
header: t('payload'),
accessorFn: (row) => row.payload,
},
])
]
const table = createSolidTable({
filterFns: {
@ -118,7 +118,7 @@ export default () => {
return logs()
},
sortDescFirst: true,
columns: columns(),
columns,
onGlobalFilterChange: setGlobalFilter,
onSortingChange: setSorting,
globalFilterFn: fuzzyFilter,