diff --git a/app/client/ui/AddNewButton.ts b/app/client/ui/AddNewButton.ts index 2e3d33c9..7e792c6a 100644 --- a/app/client/ui/AddNewButton.ts +++ b/app/client/ui/AddNewButton.ts @@ -3,12 +3,14 @@ import {icon} from 'app/client/ui2018/icons'; import {dom, DomElementArg, Observable, styled} from "grainjs"; import {t} from 'app/client/lib/localization'; +const translate = (x: string, args?: any): string => t(`AddNewButton.${x}`, args); + export function addNewButton(isOpen: Observable | boolean = true, ...args: DomElementArg[]) { return cssAddNewButton( cssAddNewButton.cls('-open', isOpen), // Setting spacing as flex items allows them to shrink faster when there isn't enough space. cssLeftMargin(), - cssAddText(t('AddNewButton.AddNew')), + cssAddText(translate('AddNew')), dom('div', {style: 'flex: 1 1 16px'}), cssPlusButton(cssPlusIcon('Plus')), dom('div', {style: 'flex: 0 1 16px'}), diff --git a/app/client/ui/DocMenu.ts b/app/client/ui/DocMenu.ts index 2b2da41e..28ec71ea 100644 --- a/app/client/ui/DocMenu.ts +++ b/app/client/ui/DocMenu.ts @@ -34,6 +34,8 @@ import {localStorageBoolObs} from 'app/client/lib/localStorageObs'; import {bigBasicButton} from 'app/client/ui2018/buttons'; import sortBy = require('lodash/sortBy'); +const translate = (x: string, args?: any): string => t(`DocMenu.${x}`, args); + const testId = makeTestId('test-dm-'); /** @@ -105,10 +107,10 @@ function createLoadedDocMenu(owner: IDisposableOwner, home: HomeModel) { null : css.docListHeader( ( - page === 'all' ? t('DocMenu.AllDocuments') : + page === 'all' ? translate('AllDocuments') : page === 'templates' ? dom.domComputed(use => use(home.featuredTemplates).length > 0, (hasFeaturedTemplates) => - hasFeaturedTemplates ? t('DocMenu.MoreExamplesAndTemplates') : t('DocMenu.ExamplesAndTemplates') + hasFeaturedTemplates ? translate('MoreExamplesAndTemplates') : translate('ExamplesAndTemplates') ) : page === 'trash' ? 'Trash' : workspace && [css.docHeaderIcon('Folder'), workspaceName(home.app, workspace)] @@ -268,7 +270,7 @@ function buildOtherSites(home: HomeModel) { return css.otherSitesBlock( dom.autoDispose(hideOtherSitesObs), css.otherSitesHeader( - t('DocMenu.OtherSites'), + translate('OtherSites'), dom.domComputed(hideOtherSitesObs, (collapsed) => collapsed ? css.otherSitesHeaderIcon('Expand') : css.otherSitesHeaderIcon('Collapse') ), @@ -280,7 +282,7 @@ function buildOtherSites(home: HomeModel) { const siteName = home.app.currentOrgName; return [ dom('div', - t('DocMenu.OtherSitesWelcome', { siteName, context: personal ? 'personal' : '' }), + translate('OtherSitesWelcome', { siteName, context: personal ? 'personal' : '' }), testId('other-sites-message') ), css.otherSitesButtons( diff --git a/app/client/ui/HomeIntro.ts b/app/client/ui/HomeIntro.ts index b47be7f9..02f4d812 100644 --- a/app/client/ui/HomeIntro.ts +++ b/app/client/ui/HomeIntro.ts @@ -14,6 +14,7 @@ import {FullUser} from 'app/common/LoginSessionAPI'; import * as roles from 'app/common/roles'; import {Computed, dom, DomContents, styled} from 'grainjs'; +const translate = (x: string, args?: any): string => t(`HomeIntro.${x}`, args); export function buildHomeIntro(homeModel: HomeModel): DomContents { const isViewer = homeModel.app.currentOrg?.access === roles.VIEWER; @@ -110,9 +111,9 @@ function makePersonalIntro(homeModel: HomeModel, user: FullUser) { } function makeAnonIntro(homeModel: HomeModel) { - const signUp = cssLink({href: getLoginOrSignupUrl()}, t('HomeIntro.SignUp')); + const signUp = cssLink({href: getLoginOrSignupUrl()}, translate('SignUp')); return [ - css.docListHeader(t('HomeIntro.Welcome'), testId('welcome-title')), + css.docListHeader(translate('Welcome'), testId('welcome-title')), cssIntroLine('Get started by exploring templates, or creating your first Grist document.'), cssIntroLine(signUp, ' to save your work.', (shouldHideUiElement('helpCenter') ? null : [' Visit our ', helpCenterLink(), ' to learn more.']), diff --git a/app/server/lib/sendAppPage.ts b/app/server/lib/sendAppPage.ts index 892297cb..377709b0 100644 --- a/app/server/lib/sendAppPage.ts +++ b/app/server/lib/sendAppPage.ts @@ -12,6 +12,8 @@ import jsesc from 'jsesc'; import * as handlebars from 'handlebars'; import * as path from 'path'; +const translate = (req: express.Request, key: string, args?: any) => req.t(`sendAppPage.${key}`, args); + export interface ISendAppPageOptions { path: string; // Ignored if .content is present (set to "" for clarity). content?: string; @@ -154,7 +156,7 @@ function configuredPageTitleSuffix() { */ function getPageTitle(req: express.Request, config: GristLoadConfig): string { const maybeDoc = getDocFromConfig(config); - if (!maybeDoc) { return req.t('sendAppPage.Loading') + "..."; } + if (!maybeDoc) { return translate(req, 'sendAppPage.Loading') + "..."; } return handlebars.Utils.escapeExpression(maybeDoc.name); }