From 16b4ee7b6d076827ce7b2791b77166119f6a0097 Mon Sep 17 00:00:00 2001 From: Pig Fang Date: Fri, 15 May 2020 11:39:31 +0800 Subject: [PATCH] refactor: `trans` -> `t` --- resources/assets/src/components/Modal.tsx | 8 ++--- .../assets/src/components/ViewerSkeleton.tsx | 4 +-- resources/assets/src/scripts/i18n.ts | 6 ++-- resources/assets/src/scripts/logout.ts | 4 +-- resources/assets/src/scripts/net.ts | 6 ++-- resources/assets/src/views/admin/Update.ts | 4 +-- .../assets/src/views/user/profile/password.ts | 4 +-- .../assets/tests/components/Modal.test.tsx | 34 +++++++++---------- resources/assets/tests/scripts/i18n.test.ts | 12 +++---- resources/assets/tests/scripts/modal.test.ts | 4 +-- resources/assets/tests/scripts/net.test.ts | 10 +++--- .../tests/views/user/Dashboard.test.tsx | 4 +-- .../tests/views/user/profile/password.test.ts | 4 +-- 13 files changed, 51 insertions(+), 53 deletions(-) diff --git a/resources/assets/src/components/Modal.tsx b/resources/assets/src/components/Modal.tsx index 3ec6c203..055d06cd 100644 --- a/resources/assets/src/components/Modal.tsx +++ b/resources/assets/src/components/Modal.tsx @@ -1,7 +1,7 @@ import React, { useState, useEffect, useRef } from 'react' import $ from 'jquery' import 'bootstrap' -import { trans } from '../scripts/i18n' +import { t } from '../scripts/i18n' import ModalHeader from './ModalHeader' import ModalBody from './ModalBody' import ModalFooter from './ModalFooter' @@ -38,7 +38,7 @@ export type ModalResult = { const Modal: React.FC = (props) => { const { mode = 'confirm', - title = trans('general.tip'), + title = t('general.tip'), text = '', input = '', placeholder = '', @@ -46,9 +46,9 @@ const Modal: React.FC = (props) => { type = 'default', showHeader = true, center = false, - okButtonText = trans('general.confirm'), + okButtonText = t('general.confirm'), okButtonType = 'primary', - cancelButtonText = trans('general.cancel'), + cancelButtonText = t('general.cancel'), cancelButtonType = 'secondary', flexFooter = false, } = props diff --git a/resources/assets/src/components/ViewerSkeleton.tsx b/resources/assets/src/components/ViewerSkeleton.tsx index d6d5c357..3dfd1e67 100644 --- a/resources/assets/src/components/ViewerSkeleton.tsx +++ b/resources/assets/src/components/ViewerSkeleton.tsx @@ -1,12 +1,12 @@ import React from 'react' -import { trans } from '@/scripts/i18n' +import { t } from '@/scripts/i18n' const ViewerSkeleton: React.FC = () => (

- {trans('general.texturePreview')} + {t('general.texturePreview')}

diff --git a/resources/assets/src/scripts/i18n.ts b/resources/assets/src/scripts/i18n.ts index 42a635ae..d361cd31 100644 --- a/resources/assets/src/scripts/i18n.ts +++ b/resources/assets/src/scripts/i18n.ts @@ -1,4 +1,4 @@ -export function trans(key: string, parameters = Object.create(null)): string { +export function t(key: string, parameters = Object.create(null)): string { const segments = key.split('.') let temp = (blessing.i18n) as { [k: string]: string | { [k: string]: string } @@ -23,6 +23,4 @@ export function trans(key: string, parameters = Object.create(null)): string { return result } -export const t = trans - -Object.assign(window, { trans }) +Object.assign(window, { trans: t }) diff --git a/resources/assets/src/scripts/logout.ts b/resources/assets/src/scripts/logout.ts index e1446505..7564f652 100644 --- a/resources/assets/src/scripts/logout.ts +++ b/resources/assets/src/scripts/logout.ts @@ -1,11 +1,11 @@ import { post } from './net' -import { trans } from './i18n' +import { t } from './i18n' import { showModal } from './notify' export async function logout() { try { await showModal({ - text: trans('general.confirmLogout'), + text: t('general.confirmLogout'), center: true, }) } catch { diff --git a/resources/assets/src/scripts/net.ts b/resources/assets/src/scripts/net.ts index 467b6094..125306a8 100644 --- a/resources/assets/src/scripts/net.ts +++ b/resources/assets/src/scripts/net.ts @@ -1,6 +1,6 @@ import { emit } from './event' import { showModal } from './notify' -import { trans, t } from './i18n' +import { t } from './i18n' export interface ResponseBody { code: number @@ -87,13 +87,13 @@ export async function walkFetch(request: Request): Promise { emit('fetchError', error) showModal({ mode: 'alert', - title: trans('general.fatalError'), + title: t('general.fatalError'), dangerousHTML: error.message, type: 'danger', okButtonType: 'outline-light', }) - return { code: -1, message: trans('general.fatalError') } + return { code: -1, message: t('general.fatalError') } } } diff --git a/resources/assets/src/views/admin/Update.ts b/resources/assets/src/views/admin/Update.ts index b8566586..222661ae 100644 --- a/resources/assets/src/views/admin/Update.ts +++ b/resources/assets/src/views/admin/Update.ts @@ -1,13 +1,13 @@ import { post, ResponseBody } from '../../scripts/net' import { showModal } from '../../scripts/notify' -import { trans } from '../../scripts/i18n' +import { t } from '../../scripts/i18n' export default async function handler(event: MouseEvent) { const button = event.target as HTMLButtonElement button.disabled = true const text = button.textContent - button.innerHTML = ` ${trans('admin.downloading')}` + button.innerHTML = ` ${t('admin.downloading')}` const { code, message }: ResponseBody = await post('/admin/update/download') button.textContent = text diff --git a/resources/assets/src/views/user/profile/password.ts b/resources/assets/src/views/user/profile/password.ts index e4ced9bf..7d12d033 100644 --- a/resources/assets/src/views/user/profile/password.ts +++ b/resources/assets/src/views/user/profile/password.ts @@ -1,5 +1,5 @@ import { post, ResponseBody } from '@/scripts/net' -import { trans } from '@/scripts/i18n' +import { t } from '@/scripts/i18n' import { showModal, toast } from '@/scripts/notify' export default async function handler(event: Event) { @@ -11,7 +11,7 @@ export default async function handler(event: Event) { const confirmPassword = form.confirm.value if (newPassword !== confirmPassword) { - toast.error(trans('auth.invalidConfirmPwd')) + toast.error(t('auth.invalidConfirmPwd')) ;(form.confirm as HTMLInputElement).focus() return } diff --git a/resources/assets/tests/components/Modal.test.tsx b/resources/assets/tests/components/Modal.test.tsx index deee1b1b..a80cb7ac 100644 --- a/resources/assets/tests/components/Modal.test.tsx +++ b/resources/assets/tests/components/Modal.test.tsx @@ -1,6 +1,6 @@ import React from 'react' import { render, fireEvent, act } from '@testing-library/react' -import { trans } from '@/scripts/i18n' +import { t } from '@/scripts/i18n' import $ from 'jquery' import Modal from '@/components/Modal' @@ -31,7 +31,7 @@ test('jQuery events', () => { $('.modal').trigger('hidden.bs.modal') }) - fireEvent.click(getByText(trans('general.cancel'))) + fireEvent.click(getByText(t('general.cancel'))) act(() => { jest.runAllTimers() $('.modal').trigger('hidden.bs.modal') @@ -107,7 +107,7 @@ describe('modal footer', () => { it('custom footer content', () => { const { queryByText } = render(footer
} show />) expect(queryByText('footer')).toBeInTheDocument() - expect(queryByText(trans('general.confirm'))).not.toBeInTheDocument() + expect(queryByText(t('general.confirm'))).not.toBeInTheDocument() }) it('flex footer', () => { @@ -136,22 +136,22 @@ describe('"alert" mode', () => { const { getByText, queryByText } = render( , ) - fireEvent.click(getByText(trans('general.confirm'))) + fireEvent.click(getByText(t('general.confirm'))) expect(resolve).toBeCalledWith({ value: '' }) - expect(queryByText(trans('general.cancel'))).toBeNull() + expect(queryByText(t('general.cancel'))).toBeNull() }) it('confirm callback is optional', () => { const { getByText } = render() - fireEvent.click(getByText(trans('general.confirm'))) + fireEvent.click(getByText(t('general.confirm'))) }) }) describe('"confirm" mode', () => { it('default mode is "confirm"', () => { const { queryByText } = render() - expect(queryByText(trans('general.confirm'))).toBeInTheDocument() - expect(queryByText(trans('general.cancel'))).toBeInTheDocument() + expect(queryByText(t('general.confirm'))).toBeInTheDocument() + expect(queryByText(t('general.cancel'))).toBeInTheDocument() }) it('"confirm" button', () => { @@ -160,7 +160,7 @@ describe('"confirm" mode', () => { const { getByText } = render( , ) - fireEvent.click(getByText(trans('general.confirm'))) + fireEvent.click(getByText(t('general.confirm'))) expect(resolve).toBeCalledWith({ value: '' }) expect(reject).not.toBeCalled() }) @@ -171,7 +171,7 @@ describe('"confirm" mode', () => { const { getByText } = render( , ) - fireEvent.click(getByText(trans('general.cancel'))) + fireEvent.click(getByText(t('general.cancel'))) expect(resolve).not.toBeCalled() expect(reject).toBeCalled() }) @@ -193,7 +193,7 @@ describe('"prompt" mode', () => { fireEvent.change(getByPlaceholderText('hint'), { target: { value: 'my' }, }) - fireEvent.click(getByText(trans('general.confirm'))) + fireEvent.click(getByText(t('general.confirm'))) expect(resolve).toBeCalledWith({ value: 'my' }) expect(reject).not.toBeCalled() }) @@ -204,7 +204,7 @@ describe('"prompt" mode', () => { const { getByText } = render( , ) - fireEvent.click(getByText(trans('general.cancel'))) + fireEvent.click(getByText(t('general.cancel'))) expect(resolve).not.toBeCalled() expect(reject).toBeCalled() }) @@ -225,7 +225,7 @@ describe('"prompt" mode', () => { />, ) fireEvent.click(getByLabelText('B')) - fireEvent.click(getByText(trans('general.confirm'))) + fireEvent.click(getByText(t('general.confirm'))) expect(resolve).toBeCalledWith({ value: 'b' }) }) @@ -243,7 +243,7 @@ describe('"prompt" mode', () => { show />, ) - fireEvent.click(getByText(trans('general.confirm'))) + fireEvent.click(getByText(t('general.confirm'))) expect(resolve).toBeCalledWith({ value: 'val' }) expect(reject).not.toBeCalled() }) @@ -265,7 +265,7 @@ describe('"prompt" mode', () => { ) expect(queryByText(message)).not.toBeInTheDocument() - fireEvent.click(getByText(trans('general.confirm'))) + fireEvent.click(getByText(t('general.confirm'))) expect(queryByText(message)).toBeInTheDocument() expect(resolve).not.toBeCalled() expect(reject).not.toBeCalled() @@ -276,14 +276,14 @@ describe('"onClose" event', () => { it('button confirm', () => { const mock = jest.fn() const { getByText } = render() - fireEvent.click(getByText(trans('general.confirm'))) + fireEvent.click(getByText(t('general.confirm'))) expect(mock).toBeCalled() }) it('button cancel', () => { const mock = jest.fn() const { getByText } = render() - fireEvent.click(getByText(trans('general.cancel'))) + fireEvent.click(getByText(t('general.cancel'))) expect(mock).toBeCalled() }) }) diff --git a/resources/assets/tests/scripts/i18n.test.ts b/resources/assets/tests/scripts/i18n.test.ts index 457cad12..47fb7709 100644 --- a/resources/assets/tests/scripts/i18n.test.ts +++ b/resources/assets/tests/scripts/i18n.test.ts @@ -1,13 +1,13 @@ -import { trans } from '@/scripts/i18n' +import { t } from '@/scripts/i18n' test('mount to global', () => { - expect(window.trans).toBe(trans) + expect(window.trans).toBe(t) }) test('translate text', () => { window.blessing.i18n = { a: { b: { c: 'text', d: 'Hi, :name!' } } } - expect(trans('a.b.c')).toBe('text') - expect(trans('a.b.d')).toBe('Hi, :name!') - expect(trans('a.b.d', { name: 'me' })).toBe('Hi, me!') - expect(trans('d.e')).toBe('d.e') + expect(t('a.b.c')).toBe('text') + expect(t('a.b.d')).toBe('Hi, :name!') + expect(t('a.b.d', { name: 'me' })).toBe('Hi, me!') + expect(t('d.e')).toBe('d.e') }) diff --git a/resources/assets/tests/scripts/modal.test.ts b/resources/assets/tests/scripts/modal.test.ts index 26ccc6ff..932e1625 100644 --- a/resources/assets/tests/scripts/modal.test.ts +++ b/resources/assets/tests/scripts/modal.test.ts @@ -1,10 +1,10 @@ -import { trans } from '@/scripts/i18n' +import { t } from '@/scripts/i18n' import { showModal } from '@/scripts/modal' test('show modal', async () => { process.nextTick(() => { expect(document.querySelector('.modal-title')!.textContent).toBe( - trans('general.tip'), + t('general.tip'), ) document.querySelector('.btn-primary')!.click() }) diff --git a/resources/assets/tests/scripts/net.test.ts b/resources/assets/tests/scripts/net.test.ts index 64de4d2d..16c67486 100644 --- a/resources/assets/tests/scripts/net.test.ts +++ b/resources/assets/tests/scripts/net.test.ts @@ -1,6 +1,6 @@ import * as net from '@/scripts/net' import { on } from '@/scripts/event' -import { trans, t } from '@/scripts/i18n' +import { t } from '@/scripts/i18n' import { showModal } from '@/scripts/notify' jest.mock('@/scripts/notify') @@ -150,7 +150,7 @@ test('low level fetch', async () => { await net.walkFetch(request as Request) expect(showModal).toBeCalledWith({ mode: 'alert', - title: trans('general.fatalError'), + title: t('general.fatalError'), dangerousHTML: 'network', type: 'danger', okButtonType: 'outline-light', @@ -160,7 +160,7 @@ test('low level fetch', async () => { await net.walkFetch(request as Request) expect(showModal).toBeCalledWith({ mode: 'alert', - title: trans('general.fatalError'), + title: t('general.fatalError'), dangerousHTML: '404', type: 'danger', okButtonType: 'outline-light', @@ -171,7 +171,7 @@ test('low level fetch', async () => { await net.walkFetch(request as Request) expect(showModal).toBeCalledWith({ mode: 'alert', - title: trans('general.fatalError'), + title: t('general.fatalError'), dangerousHTML: 'error', type: 'danger', okButtonType: 'outline-light', @@ -254,7 +254,7 @@ test('process backend errors', async () => { await net.walkFetch({ headers: new Headers() } as Request) expect(showModal).toBeCalledWith({ mode: 'alert', - title: trans('general.fatalError'), + title: t('general.fatalError'), dangerousHTML: 'fake exception
[1] k.php#L2
[2] v.php#L3
', type: 'danger', okButtonType: 'outline-light', diff --git a/resources/assets/tests/views/user/Dashboard.test.tsx b/resources/assets/tests/views/user/Dashboard.test.tsx index b02565b9..d55cd55f 100644 --- a/resources/assets/tests/views/user/Dashboard.test.tsx +++ b/resources/assets/tests/views/user/Dashboard.test.tsx @@ -1,7 +1,7 @@ import React from 'react' import { render, fireEvent, waitFor } from '@testing-library/react' import * as fetch from '@/scripts/net' -import { trans } from '@/scripts/i18n' +import { t } from '@/scripts/i18n' import Dashboard from '@/views/user/Dashboard' jest.mock('@/scripts/net') @@ -112,7 +112,7 @@ describe('sign button', () => { const button = getByRole('button') expect(button).toBeEnabled() - expect(button).toHaveTextContent(trans('user.sign')) + expect(button).toHaveTextContent(t('user.sign')) }) it('sign is allowed if last sign is yesterday', async () => { diff --git a/resources/assets/tests/views/user/profile/password.test.ts b/resources/assets/tests/views/user/profile/password.test.ts index 3aeb5d0a..54498702 100644 --- a/resources/assets/tests/views/user/profile/password.test.ts +++ b/resources/assets/tests/views/user/profile/password.test.ts @@ -1,5 +1,5 @@ import { flushPromises } from '../../../utils' -import { trans } from '@/scripts/i18n' +import { t } from '@/scripts/i18n' import { showModal, toast } from '@/scripts/notify' import { post } from '@/scripts/net' import handler from '@/views/user/profile/password' @@ -37,7 +37,7 @@ test('change password', async () => { form.dispatchEvent(event) await flushPromises() expect(post).not.toBeCalled() - expect(toast.error).toBeCalledWith(trans('auth.invalidConfirmPwd')) + expect(toast.error).toBeCalledWith(t('auth.invalidConfirmPwd')) confirm.value = '1' form.dispatchEvent(event)