From 8430b1ec95c4cfc96e34d3c4efc7984abbca390c Mon Sep 17 00:00:00 2001 From: Jeff <42182408+jeffvli@users.noreply.github.com> Date: Mon, 30 Oct 2023 19:22:45 -0700 Subject: [PATCH] Add localization support (#333) * Add updated i18n config and en locale --- package-lock.json | 38 +- package.json | 8 +- src/i18n/i18n.js | 32 - src/i18n/i18n.ts | 72 +++ src/i18n/i18next-parser.config.js | 155 ++--- src/i18n/locales/en.json | 611 +++++++++++++++++- src/renderer/api/controller.ts | 18 +- src/renderer/api/navidrome/navidrome-api.ts | 16 +- src/renderer/api/subsonic/subsonic-api.ts | 3 +- src/renderer/app.tsx | 8 + .../components/feature-carousel/index.tsx | 4 +- .../components/query-builder/index.tsx | 11 +- .../components/virtual-table/index.tsx | 47 +- .../virtual-table/table-config-dropdown.tsx | 317 +++++++-- .../virtual-table/table-pagination.tsx | 8 +- .../routes/action-required-route.tsx | 8 +- .../components/album-detail-content.tsx | 11 +- .../components/album-list-header-filters.tsx | 133 +++- .../albums/components/album-list-header.tsx | 10 +- .../components/jellyfin-album-filters.tsx | 14 +- .../components/navidrome-album-filters.tsx | 17 +- ...um-artist-detail-top-songs-list-header.tsx | 8 +- .../album-artist-list-header-filters.tsx | 32 +- .../components/album-artist-list-header.tsx | 8 +- .../context-menu/context-menu-provider.tsx | 70 +- .../components/genre-list-header-filters.tsx | 38 +- .../genres/components/genre-list-header.tsx | 8 +- .../features/home/routes/home-route.tsx | 14 +- .../lyrics/components/lyrics-search-form.tsx | 15 +- .../features/lyrics/lyrics-actions.tsx | 10 +- .../components/play-queue-list-controls.tsx | 18 +- .../player/components/center-controls.tsx | 55 +- .../components/full-screen-player-queue.tsx | 12 +- .../player/components/full-screen-player.tsx | 93 ++- .../player/components/left-controls.tsx | 13 +- .../player/components/right-controls.tsx | 13 +- .../player/components/shuffle-all-modal.tsx | 3 +- .../player/hooks/use-center-controls.ts | 10 +- .../player/hooks/use-handle-playqueue-add.ts | 19 +- .../add-to-playlist-context-modal.tsx | 33 +- .../components/create-playlist-form.tsx | 32 +- .../components/playlist-detail-content.tsx | 11 +- ...aylist-detail-song-list-header-filters.tsx | 27 +- .../playlist-detail-song-list-header.tsx | 6 +- .../playlist-list-header-filters.tsx | 30 +- .../components/playlist-list-header.tsx | 13 +- .../components/playlist-query-builder.tsx | 20 +- .../components/save-as-playlist-form.tsx | 30 +- .../components/update-playlist-form.tsx | 35 +- .../playlist-detail-song-list-route.tsx | 4 +- .../search/components/go-to-commands.tsx | 38 +- .../search/components/home-commands.tsx | 30 +- .../components/library-command-item.tsx | 20 +- .../search/components/server-commands.tsx | 18 +- .../servers/components/add-server-form.tsx | 63 +- .../servers/components/edit-server-form.tsx | 58 +- .../servers/components/server-list.tsx | 14 +- .../general/application-settings.tsx | 84 ++- .../components/general/control-settings.tsx | 109 +++- .../components/general/remote-settings.tsx | 65 +- .../components/general/sidebar-settings.tsx | 25 +- .../components/general/theme-settings.tsx | 37 +- .../hotkeys/hotkey-manager-settings.tsx | 118 +++- .../hotkeys/window-hotkey-settings.tsx | 11 +- .../components/playback/audio-settings.tsx | 71 +- .../components/playback/lyric-settings.tsx | 32 +- .../components/playback/mpv-settings.tsx | 137 ++-- .../components/playback/playback-tab.tsx | 8 +- .../components/playback/scrobble-settings.tsx | 39 +- .../settings/components/settings-content.tsx | 20 +- .../settings/components/settings-header.tsx | 16 +- .../settings/components/settings-section.tsx | 2 +- .../components/window/discord-settings.tsx | 48 +- .../components/window/update-settings.tsx | 9 +- .../components/window/window-settings.tsx | 32 +- .../shared/components/library-header.tsx | 23 +- .../shared/components/order-toggle-button.tsx | 10 +- src/renderer/features/shared/utils.ts | 7 +- .../sidebar/components/action-bar.tsx | 4 +- .../sidebar/components/collapsed-sidebar.tsx | 6 +- .../components/sidebar-playlist-list.tsx | 17 +- .../features/sidebar/components/sidebar.tsx | 31 +- .../components/jellyfin-song-filters.tsx | 12 +- .../components/navidrome-song-filters.tsx | 10 +- .../components/song-list-header-filters.tsx | 46 +- .../songs/components/song-list-header.tsx | 6 +- .../features/titlebar/components/app-menu.tsx | 27 +- src/renderer/store/settings.store.ts | 59 +- src/renderer/utils/index.ts | 1 + src/renderer/utils/sentence-case.ts | 3 + 90 files changed, 2679 insertions(+), 908 deletions(-) delete mode 100644 src/i18n/i18n.js create mode 100644 src/i18n/i18n.ts create mode 100644 src/renderer/utils/sentence-case.ts diff --git a/package-lock.json b/package-lock.json index 7d13889f..001eae96 100644 --- a/package-lock.json +++ b/package-lock.json @@ -42,7 +42,7 @@ "framer-motion": "^10.13.0", "fuse.js": "^6.6.2", "history": "^5.3.0", - "i18next": "^21.6.16", + "i18next": "^21.10.0", "idb-keyval": "^6.2.1", "immer": "^9.0.21", "is-electron": "^2.2.2", @@ -57,7 +57,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-error-boundary": "^3.1.4", - "react-i18next": "^11.16.7", + "react-i18next": "^11.18.6", "react-icons": "^4.10.1", "react-player": "^2.11.0", "react-router": "^6.16.0", @@ -125,7 +125,7 @@ "file-loader": "^6.2.0", "html-webpack-plugin": "^5.5.0", "husky": "^7.0.4", - "i18next-parser": "^6.3.0", + "i18next-parser": "^6.6.0", "identity-obj-proxy": "^3.0.0", "jest": "^27.5.1", "lint-staged": "^12.3.7", @@ -11871,7 +11871,8 @@ "node_modules/html-escaper": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz", - "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==" + "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==", + "dev": true }, "node_modules/html-minifier-terser": { "version": "6.1.0", @@ -12129,9 +12130,9 @@ } }, "node_modules/i18next": { - "version": "21.6.16", - "resolved": "https://registry.npmjs.org/i18next/-/i18next-21.6.16.tgz", - "integrity": "sha512-xJlzrVxG9CyAGsbMP1aKuiNr1Ed2m36KiTB7hjGMG2Zo4idfw3p9THUEu+GjBwIgEZ7F11ZbCzJcfv4uyfKNuw==", + "version": "21.10.0", + "resolved": "https://registry.npmjs.org/i18next/-/i18next-21.10.0.tgz", + "integrity": "sha512-YeuIBmFsGjUfO3qBmMOc0rQaun4mIpGKET5WDwvu8lU7gvwpcariZLNtL0Fzj+zazcHUrlXHiptcFhBMFaxzfg==", "funding": [ { "type": "individual", @@ -16968,12 +16969,11 @@ "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==" }, "node_modules/react-i18next": { - "version": "11.16.7", - "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-11.16.7.tgz", - "integrity": "sha512-7yotILJLnKfvUfrl/nt9eK9vFpVFjZPLWAwBzWL6XppSZZEvlmlKk0GBGDCAPfLfs8oND7WAbry8wGzdoiW5Nw==", + "version": "11.18.6", + "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-11.18.6.tgz", + "integrity": "sha512-yHb2F9BiT0lqoQDt8loZ5gWP331GwctHz9tYQ8A2EIEUu+CcEdjBLQWli1USG3RdWQt3W+jqQLg/d4rrQR96LA==", "dependencies": { "@babel/runtime": "^7.14.5", - "html-escaper": "^2.0.2", "html-parse-stringify": "^3.0.1" }, "peerDependencies": { @@ -30233,7 +30233,8 @@ "html-escaper": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz", - "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==" + "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==", + "dev": true }, "html-minifier-terser": { "version": "6.1.0", @@ -30419,9 +30420,9 @@ "dev": true }, "i18next": { - "version": "21.6.16", - "resolved": "https://registry.npmjs.org/i18next/-/i18next-21.6.16.tgz", - "integrity": "sha512-xJlzrVxG9CyAGsbMP1aKuiNr1Ed2m36KiTB7hjGMG2Zo4idfw3p9THUEu+GjBwIgEZ7F11ZbCzJcfv4uyfKNuw==", + "version": "21.10.0", + "resolved": "https://registry.npmjs.org/i18next/-/i18next-21.10.0.tgz", + "integrity": "sha512-YeuIBmFsGjUfO3qBmMOc0rQaun4mIpGKET5WDwvu8lU7gvwpcariZLNtL0Fzj+zazcHUrlXHiptcFhBMFaxzfg==", "requires": { "@babel/runtime": "^7.17.2" } @@ -33952,12 +33953,11 @@ "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==" }, "react-i18next": { - "version": "11.16.7", - "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-11.16.7.tgz", - "integrity": "sha512-7yotILJLnKfvUfrl/nt9eK9vFpVFjZPLWAwBzWL6XppSZZEvlmlKk0GBGDCAPfLfs8oND7WAbry8wGzdoiW5Nw==", + "version": "11.18.6", + "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-11.18.6.tgz", + "integrity": "sha512-yHb2F9BiT0lqoQDt8loZ5gWP331GwctHz9tYQ8A2EIEUu+CcEdjBLQWli1USG3RdWQt3W+jqQLg/d4rrQR96LA==", "requires": { "@babel/runtime": "^7.14.5", - "html-escaper": "^2.0.2", "html-parse-stringify": "^3.0.1" } }, diff --git a/package.json b/package.json index c5ce73e3..54b2f648 100644 --- a/package.json +++ b/package.json @@ -26,7 +26,7 @@ "start:web": "cross-env NODE_ENV=development TS_NODE_TRANSPILE_ONLY=true webpack serve --config ./.erb/configs/webpack.config.renderer.web.ts", "test": "jest", "prepare": "husky install", - "i18next": "i18next -c src/renderer/i18n/i18next-parser.config.js", + "i18next": "i18next -c src/i18n/i18next-parser.config.js", "prod:buildserver": "pwsh -c \"./scripts/server-build.ps1\"", "prod:publishserver": "pwsh -c \"./scripts/server-publish.ps1\"" }, @@ -252,7 +252,7 @@ "file-loader": "^6.2.0", "html-webpack-plugin": "^5.5.0", "husky": "^7.0.4", - "i18next-parser": "^6.3.0", + "i18next-parser": "^6.6.0", "identity-obj-proxy": "^3.0.0", "jest": "^27.5.1", "lint-staged": "^12.3.7", @@ -321,7 +321,7 @@ "framer-motion": "^10.13.0", "fuse.js": "^6.6.2", "history": "^5.3.0", - "i18next": "^21.6.16", + "i18next": "^21.10.0", "idb-keyval": "^6.2.1", "immer": "^9.0.21", "is-electron": "^2.2.2", @@ -336,7 +336,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-error-boundary": "^3.1.4", - "react-i18next": "^11.16.7", + "react-i18next": "^11.18.6", "react-icons": "^4.10.1", "react-player": "^2.11.0", "react-router": "^6.16.0", diff --git a/src/i18n/i18n.js b/src/i18n/i18n.js deleted file mode 100644 index 1683c700..00000000 --- a/src/i18n/i18n.js +++ /dev/null @@ -1,32 +0,0 @@ -import i18n from 'i18next'; -import { initReactI18next } from 'react-i18next'; -const en = require('./locales/en.json'); - -const resources = { - en: { translation: en }, -}; - -export const Languages = [ - { - label: 'English', - value: 'en', - }, -]; - -i18n - .use(initReactI18next) // passes i18n down to react-i18next - .init({ - fallbackLng: 'en', - // language to use, more information here: https://www.i18next.com/overview/configuration-options#languages-namespaces-resources - // you can use the i18n.changeLanguage function to change the language manually: https://www.i18next.com/overview/api#changelanguage - // if you're using a language detector, do not define the lng option - interpolation: { - escapeValue: false, // react already safes from xss - }, - - lng: 'en', - - resources, - }); - -export default i18n; diff --git a/src/i18n/i18n.ts b/src/i18n/i18n.ts new file mode 100644 index 00000000..4eeb146b --- /dev/null +++ b/src/i18n/i18n.ts @@ -0,0 +1,72 @@ +import { PostProcessorModule } from 'i18next'; +import i18n from 'i18next'; +import { initReactI18next } from 'react-i18next'; +import en from './locales/en.json'; + +const resources = { + en: { translation: en }, +}; + +export const languages = [ + { + label: 'English', + value: 'en', + }, +]; + +const lowerCasePostProcessor: PostProcessorModule = { + type: 'postProcessor', + name: 'lowerCase', + process: (value: string) => { + return value.toLocaleLowerCase(); + }, +}; + +const upperCasePostProcessor: PostProcessorModule = { + type: 'postProcessor', + name: 'upperCase', + process: (value: string) => { + return value.toLocaleUpperCase(); + }, +}; + +const titleCasePostProcessor: PostProcessorModule = { + type: 'postProcessor', + name: 'titleCase', + process: (value: string) => { + return value.replace(/\w\S*/g, (txt) => { + return txt.charAt(0).toUpperCase() + txt.slice(1).toLowerCase(); + }); + }, +}; + +const sentenceCasePostProcessor: PostProcessorModule = { + type: 'postProcessor', + name: 'sentenceCase', + process: (value: string) => { + const sentences = value.split('. '); + + return sentences + .map((sentence) => { + return sentence.charAt(0).toUpperCase() + sentence.slice(1).toLocaleLowerCase(); + }) + .join('. '); + }, +}; +i18n.use(lowerCasePostProcessor) + .use(upperCasePostProcessor) + .use(titleCasePostProcessor) + .use(sentenceCasePostProcessor) + .use(initReactI18next) // passes i18n down to react-i18next + .init({ + fallbackLng: 'en', + // language to use, more information here: https://www.i18next.com/overview/configuration-options#languages-namespaces-resources + // you can use the i18n.changeLanguage function to change the language manually: https://www.i18next.com/overview/api#changelanguage + // if you're using a language detector, do not define the lng option + interpolation: { + escapeValue: false, // react already safes from xss + }, + resources, + }); + +export default i18n; diff --git a/src/i18n/i18next-parser.config.js b/src/i18n/i18next-parser.config.js index d3d12e0e..22071636 100644 --- a/src/i18n/i18next-parser.config.js +++ b/src/i18n/i18next-parser.config.js @@ -1,117 +1,44 @@ -// i18next-parser.config.js +// Reference: https://github.com/i18next/i18next-parser#options module.exports = { - contextSeparator: '_', - // Key separator used in your translation keys - - createOldCatalogs: true, - - // Exit with an exit code of 1 when translations are updated (for CI purpose) - customValueTemplate: null, - - // Save the \_old files - defaultNamespace: 'translation', - - // Default namespace used in your i18next config - defaultValue: '', - - // Exit with an exit code of 1 on warnings - failOnUpdate: false, - - // Display info about the parsing including some stats - failOnWarnings: false, - - // The locale to compare with default values to determine whether a default value has been changed. - // If this is set and a default value differs from a translation in the specified locale, all entries - // for that key across locales are reset to the default value, and existing translations are moved to - // the `_old` file. - i18nextOptions: null, - - // Default value to give to empty keys - // You may also specify a function accepting the locale, namespace, and key as arguments - indentation: 2, - - // Plural separator used in your translation keys - // If you want to use plain english keys, separators such as `_` might conflict. You might want to set `pluralSeparator` to a different string that does not occur in your keys. - input: [ - '../components/**/*.{js,jsx,ts,tsx}', - '../features/**/*.{js,jsx,ts,tsx}', - '../layouts/**/*.{js,jsx,ts,tsx}', - '!../../src/node_modules/**', - '!../../src/**/*.prod.js', - ], - - // Indentation of the catalog files - keepRemoved: false, - - // Keep keys from the catalog that are no longer in code - keySeparator: '.', - - // Key separator used in your translation keys - // If you want to use plain english keys, separators such as `.` and `:` will conflict. You might want to set `keySeparator: false` and `namespaceSeparator: false`. That way, `t('Status: Loading...')` will not think that there are a namespace and three separator dots for instance. - // see below for more details - lexers: { - default: ['JavascriptLexer'], - handlebars: ['HandlebarsLexer'], - - hbs: ['HandlebarsLexer'], - htm: ['HTMLLexer'], - - html: ['HTMLLexer'], - js: ['JavascriptLexer'], - jsx: ['JsxLexer'], - - mjs: ['JavascriptLexer'], - // if you're writing jsx inside .js files, change this to JsxLexer - ts: ['JavascriptLexer'], - - tsx: ['JsxLexer'], - }, - - lineEnding: 'auto', - - // Control the line ending. See options at https://github.com/ryanve/eol - locales: ['en'], - - // An array of the locales in your applications - namespaceSeparator: false, - - // Namespace separator used in your translation keys - // If you want to use plain english keys, separators such as `.` and `:` will conflict. You might want to set `keySeparator: false` and `namespaceSeparator: false`. That way, `t('Status: Loading...')` will not think that there are a namespace and three separator dots for instance. - output: 'src/renderer/i18n/locales/$LOCALE.json', - - // Supports $LOCALE and $NAMESPACE injection - // Supports JSON (.json) and YAML (.yml) file formats - // Where to write the locale files relative to process.cwd() - pluralSeparator: '_', - - // If you wish to customize the value output the value as an object, you can set your own format. - // ${defaultValue} is the default value you set in your translation function. - // Any other custom property will be automatically extracted. - // - // Example: - // { - // message: "${defaultValue}", - // description: "${maxLength}", // - // } - resetDefaultValueLocale: 'en', - - // Whether or not to sort the catalog. Can also be a [compareFunction](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#parameters) - skipDefaultValues: false, - - // An array of globs that describe where to look for source files - // relative to the location of the configuration file - sort: true, - - // Whether to ignore default values - // You may also specify a function accepting the locale and namespace as arguments - useKeysAsDefaultValue: true, - - // Whether to use the keys as the default value; ex. "Hello": "Hello", "World": "World" - // This option takes precedence over the `defaultValue` and `skipDefaultValues` options - // You may also specify a function accepting the locale and namespace as arguments - verbose: false, - // If you wish to customize options in internally used i18next instance, you can define an object with any - // configuration property supported by i18next (https://www.i18next.com/overview/configuration-options). - // { compatibilityJSON: 'v3' } can be used to generate v3 compatible plurals. + contextSeparator: '_', + createOldCatalogs: true, + customValueTemplate: null, + defaultNamespace: 'translation', + defaultValue: '', + failOnUpdate: false, + failOnWarnings: false, + i18nextOptions: null, + indentation: 4, + input: [ + '../renderer/components/**/*.{js,jsx,ts,tsx}', + '../renderer/features/**/*.{js,jsx,ts,tsx}', + '../renderer/layouts/**/*.{js,jsx,ts,tsx}', + '!../src/node_modules/**', + '!../src/**/*.prod.js', + ], + keepRemoved: false, + keySeparator: '.', + lexers: { + default: ['JavascriptLexer'], + handlebars: ['HandlebarsLexer'], + hbs: ['HandlebarsLexer'], + htm: ['HTMLLexer'], + html: ['HTMLLexer'], + js: ['JavascriptLexer'], + jsx: ['JsxLexer'], + mjs: ['JavascriptLexer'], + ts: ['JavascriptLexer'], + tsx: ['JsxLexer'], + }, + lineEnding: 'auto', + locales: ['en'], + namespaceSeparator: false, + output: 'src/renderer/i18n/locales/$LOCALE.json', + pluralSeparator: '_', + resetDefaultValueLocale: 'en', + skipDefaultValues: false, + sort: true, + useKeysAsDefaultValue: true, + verbose: false, }; diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index 147e95db..5a2e9420 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -1,9 +1,606 @@ { - "player": { - "next": "player.next", - "play": "player.play", - "prev": "player.prev", - "seekBack": "player.seekBack", - "seekForward": "player.seekForward" - } + "action": { + "addToFavorites": "add to $t(entity.favorite_other)", + "addToPlaylist": "add to $t(entity.playlist_one)", + "clearQueue": "clear queue", + "createPlaylist": "create $t(entity.playlist_one)", + "deletePlaylist": "delete $t(entity.playlist_one)", + "deselectAll": "deselect all", + "editPlaylist": "edit $t(entity.playlist_one)", + "goToPage": "go to page", + "moveToBottom": "move to bottom", + "moveToTop": "move to top", + "refresh": "$t(common.refresh)", + "removeFromFavorites": "remove from $t(entity.favorite_other)", + "removeFromPlaylist": "remove from $t(entity.playlist_one)", + "removeFromQueue": "remove from queue", + "setRating": "set rating", + "toggleSmartPlaylistEditor": "toggle $t(entity.smartPlaylist) editor", + "viewPlaylists": "view $t(entity.playlist_other)" + }, + "common": { + "action_one": "action", + "action_other": "actions", + "add": "add", + "areYouSure": "are you sure?", + "ascending": "ascending", + "backward": "backward", + "biography": "biography", + "bitrate": "bitrate", + "bpm": "bpm", + "cancel": "cancel", + "center": "center", + "channel_one": "channel", + "channel_other": "channels", + "clear": "clear", + "collapse": "collapse", + "comingSoon": "coming soon...", + "configure": "configure", + "confirm": "confirm", + "create": "create", + "currentSong": "current $t(entity.track_one)", + "decrease": "decrease", + "delete": "delete", + "descending": "descending", + "description": "description", + "disable": "disable", + "disc": "disc", + "dismiss": "dismiss", + "duration": "duration", + "edit": "edit", + "enable": "enable", + "expand": "expand", + "favorite": "favorite", + "filter_one": "filter", + "filter_other": "filters", + "filters": "filters", + "forceRestartRequired": "restart to apply changes... close the notification to restart", + "forward": "forward", + "gap": "gap", + "home": "home", + "increase": "increase", + "left": "left", + "limit": "limit", + "manage": "manage", + "maximize": "maximize", + "menu": "menu", + "minimize": "minimize", + "modified": "modified", + "name": "name", + "no": "no", + "none": "none", + "noResultsFromQuery": "the query returned no results", + "note": "note", + "ok": "ok", + "owner": "owner", + "path": "path", + "playerMustBePaused": "player must be paused", + "previousSong": "previous $t(entity.track_one)", + "quit": "quit", + "random": "random", + "rating": "rating", + "refresh": "refresh", + "reset": "reset", + "resetToDefault": "reset to default", + "restartRequired": "restart required", + "right": "right", + "save": "save", + "saveAndReplace": "save and replace", + "saveAs": "save as", + "search": "search", + "setting": "setting", + "setting_other": "settings", + "size": "size", + "sortOrder": "order", + "title": "title", + "trackNumber": "track", + "unknown": "unknown", + "version": "version", + "year": "year", + "yes": "yes" + }, + "entity": { + "album_one": "album", + "album_other": "albums", + "albumArtist_one": "album artist", + "albumArtist_other": "album artists", + "albumArtistCount_one": "{{count}} album artist", + "albumArtistCount_other": "{{count}} album artists", + "albumWithCount_one": "{{count}} album", + "albumWithCount_other": "{{count}} albums", + "artist_one": "artist", + "artist_other": "artists", + "artistWithCount_one": "{{count}} artist", + "artistWithCount_other": "{{count}} artists", + "favorite_one": "favorite", + "favorite_other": "favorites", + "folder_one": "folder", + "folder_other": "folders", + "folderWithCount_one": "{{count}} folder", + "folderWithCount_other": "{{count}} folders", + "genre_one": "genre", + "genre_other": "genres", + "genreWithCount_one": "{{count}} genre", + "genreWithCount_other": "{{count}} genres", + "playlist_one": "playlist", + "playlist_other": "playlists", + "playlistWithCount_one": "{{count}} playlist", + "playlistWithCount_other": "{{count}} playlists", + "smartPlaylist": "smart $t(entity.playlist_one)", + "track_one": "track", + "track_other": "tracks", + "trackWithCount_one": "{{count}} track", + "trackWithCount_other": "{{count}} tracks" + }, + "error": { + "apiRouteError": "unable to route request", + "audioDeviceFetchError": "an error occurred when trying to get audio devices", + "authenticationFailed": "authentication failed", + "credentialsRequired": "credentials required", + "endpointNotImplementedError": "endpoint {{endpoint} is not implemented for {{serverType}}", + "genericError": "an error occurred", + "invalidServer": "invalid server", + "localFontAccessDenied": "access denied to local fonts", + "loginRateError": "too many login attempts, please try again in a few seconds", + "mpvRequired": "MPV required", + "playbackError": "an error occurred when trying to play the media", + "remoteDisableError": "an error occurred when trying to $t(common.disable) the remote server", + "remoteEnableError": "an error occurred when trying to $t(common.enable) the remote server", + "remotePortError": "an error occurred when trying to set the remote server port", + "remotePortWarning": "restart the server to apply the new port", + "serverNotSelectedError": "no server selected", + "serverRequired": "server required", + "sessionExpiredError": "your session has expired", + "systemFontError": "an error occurred when trying to get system fonts" + }, + "filter": { + "albumArtist": "$t(entity.albumArtist_one)", + "artist": "$t(entity.artist_one)", + "biography": "biography", + "bitrate": "bitrate", + "bpm": "bpm", + "communityRating": "community rating", + "criticRating": "critic rating", + "dateAdded": "date added", + "disc": "disc", + "duration": "duration", + "favorited": "favorited", + "fromYear": "from year", + "isCompilation": "is compilation", + "isFavorited": "is favorited", + "isRated": "is rated", + "isRecentlyPlayed": "is recently played", + "lastPlayed": "last played", + "mostPlayed": "most played", + "name": "name", + "note": "note", + "path": "path", + "playCount": "play count", + "random": "random", + "rating": "rating", + "recentlyAdded": "recently added", + "recentlyPlayed": "recently played", + "releaseDate": "release date", + "releaseYear": "release year", + "search": "search", + "songCount": "song count", + "title": "title", + "toYear": "to year", + "trackNumber": "track" + }, + "form": { + "addServer": { + "error_savePassword": "an error occurred when trying to save the password", + "ignoreCors": "ignore cors ($t(common.restartRequired))", + "ignoreSsl": "ignore ssl ($t(common.restartRequired))", + "input_legacyAuthentication": "enable legacy authentication", + "input_name": "server name", + "input_password": "password", + "input_savePassword": "save password", + "input_url": "url", + "input_username": "username", + "success": "server added successfully", + "title": "add server" + }, + "addToPlaylist": { + "input_playlists": "$t(entity.playlist_other)", + "input_skipDuplicates": "skip duplicates", + "success": "added {{message}} $t(entity.song_other) to {{numOfPlaylists}} $t(entity.playlist_other)", + "title": "add to $t(entity.playlist_one)" + }, + "createPlaylist": { + "input_description": "$t(common.description)", + "input_name": "$t(common.name)", + "input_owner": "$t(common.owner)", + "input_public": "public", + "success": "$t(entity.playlist_one) created successfully", + "title": "create $t(entity.playlist_one)" + }, + "deletePlaylist": { + "input_confirm": "type the name of the $t(entity.playlist_one) to confirm", + "success": "$t(entity.playlist_one) deleted successfully", + "title": "delete $t(entity.playlist_one)" + }, + "editPlaylist": { + "title": "edit $t(entity.playlist_one)" + }, + "lyricSearch": { + "input_artist": "$t(entity.artist_one)", + "input_name": "$t(common.name)", + "title": "lyric search" + }, + "queryEditor": { + "input_optionMatchAll": "match all", + "input_optionMatchAny": "match any" + }, + "updateServer": { + "success": "server updated successfully", + "title": "update server" + } + }, + "page": { + "albumArtistList": { + "title": "$t(entity.albumArtist_other)" + }, + "albumDetail": { + "moreFromArtist": "more from this $t(entity.genre_one)", + "moreFromGeneric": "more from {{item}}" + }, + "albumList": { + "title": "$t(entity.album_other)" + }, + "appMenu": { + "collapseSidebar": "collapse sidebar", + "expandSidebar": "expand sidebar", + "goBack": "go back", + "goForward": "go forward", + "manageServers": "manage servers", + "openBrowserDevtools": "open browser devtools", + "quit": "$t(common.quit)", + "selectServer": "select server", + "settings": "$t(common.setting_other)", + "version": "version {{version}}" + }, + "contextMenu": { + "addFavorite": "$t(action.addToFavorites)", + "addLast": "$t(player.addLast)", + "addNext": "$t(player.addNext)", + "addToFavorites": "$t(action.addToFavorites)", + "addToPlaylist": "$t(action.addToPlaylist)", + "createPlaylist": "$t(action.createPlaylist)", + "deletePlaylist": "$t(action.deletePlaylist)", + "deselectAll": "$t(action.deselectAll)", + "moveToBottom": "$t(action.moveToBottom)", + "moveToTop": "$t(action.moveToTop)", + "numberSelected": "{{count}} selected", + "play": "$t(player.play)", + "removeFromFavorites": "$t(action.removeFromFavorites)", + "removeFromPlaylist": "$t(action.removeFromPlaylist)", + "removeFromQueue": "$t(action.removeFromQueue)", + "setRating": "$t(action.setRating)" + }, + "fullscreenPlayer": { + "config": { + "dynamicBackground": "dynamic background", + "followCurrentLyric": "follow current lyric", + "lyricAlignment": "lyric alignment", + "lyricGap": "lyric gap", + "lyricSize": "lyric size", + "opacity": "opacity", + "showLyricMatch": "show lyric match", + "showLyricProvider": "show lyric provider", + "synchronized": "synchronized", + "unsynchronized": "unsynchronized", + "useImageAspectRatio": "use image aspect ratio" + }, + "lyrics": "lyrics", + "related": "related", + "upNext": "up next" + }, + "genreList": { + "title": "$t(entity.genre_other)" + }, + "globalSearch": { + "commands": { + "goToPage": "go to page", + "searchFor": "search for {{query}}", + "serverCommands": "server commands" + }, + "title": "commands" + }, + "home": { + "explore": "explore from your library", + "mostPlayed": "most played", + "newlyAdded": "newly added releases", + "recentlyPlayed": "recently played", + "title": "$t(common.home)" + }, + "playlistList": { + "title": "$t(entity.playlist_other)" + }, + "setting": { + "generalTab": "general", + "hotkeysTab": "hotkeys", + "playbackTab": "playback", + "windowTab": "window" + }, + "sidebar": { + "albumArtists": "$t(entity.albumArtist_other)", + "albums": "$t(entity.album_other)", + "artists": "$t(entity.artist_other)", + "folders": "$t(entity.folder_other)", + "genres": "$t(entity.genre_other)", + "home": "$t(common.home)", + "nowPlaying": "now playing", + "playlists": "$t(entity.playlist_other)", + "search": "$t(common.search)", + "settings": "$t(entity.setting_other)", + "tracks": "$t(entity.track_other)" + }, + "trackList": { + "title": "$t(entity.track_other)" + } + }, + "player": { + "addLast": "add last", + "addNext": "add next", + "favorite": "favorite", + "mute": "mute", + "muted": "muted", + "next": "next", + "play": "play", + "playbackFetchCancel": "this is taking a while... close the notification to cancel", + "playbackFetchInProgress": "loading songs...", + "playbackFetchNoResults": "no songs found", + "playbackSpeed": "playback speed", + "playRandom": "play random", + "previous": "previous", + "queue_clear": "clear queue", + "queue_moveToBottom": "move selected to top", + "queue_moveToTop": "move selected to bottom", + "queue_remove": "remove selected", + "repeat": "repeat", + "repeat_all": "repeat all", + "repeat_off": "repeat disabled", + "repeat_one": "repeat one", + "shuffle": "shuffle", + "shuffle_off": "shuffle disabled", + "skip": "skip", + "skip_back": "skip backwards", + "skip_forward": "skip forwards", + "stop": "stop", + "toggleFullscreenPlayer": "toggle fullscreen player", + "unfavorite": "unfavorite" + }, + "setting": { + "accentColor": "accent color", + "accentColor_description": "sets the accent color for the application", + "applicationHotkeys": "application hotkeys", + "applicationHotkeys_description": "configure application hotkeys. toggle the checkbox to set as a global hotkey (desktop only)", + "audioDevice": "audio device", + "audioDevice_description": "select the audio device to use for playback (web player only)", + "audioExclusiveMode": "audio exclusive mode", + "audioExclusiveMode_description": "enable exclusive output mode. In this mode, the system is usually locked out, and only mpv will be able to output audio", + "audioPlayer": "audio player", + "audioPlayer_description": "select the audio player to use for playback", + "crossfadeDuration": "crossfade duration", + "crossfadeDuration_description": "sets the duration of the crossfade effect", + "crossfadeStyle": "crossfade style", + "crossfadeStyle_description": "select the crossfade style to use for the audio player", + "customFontPath": "custom font path", + "customFontPath_description": "sets the path to the custom font to use for the application", + "disableAutomaticUpdates": "disable automatic updates", + "disableLibraryUpdateOnStartup": "disable checking for new versions on startup", + "discordApplicationId": "{{discord}} application id", + "discordApplicationId_description": "the application id for {{discord}} rich presence (defaults to {{defaultId}}", + "discordIdleStatus": "show rich presence idle status", + "discordIdleStatus_description": "when enabled, update status while player is idle", + "discordRichPresence": "{{discord}} rich presence", + "discordRichPresence_description": "enable playback status in {{discord}} rich presence. Image keys are: {{icon}}, {{playing}}, and {{paused}} ", + "discordUpdateInterval": "{{discord}} rich presence update interval", + "discordUpdateInterval_description": "the time in seconds between each update (minimum 15 seconds)", + "enableRemote": "enable remote control server", + "enableRemote_description": "enables the remote control server to allow other devices to control the application", + "exitToTray": "exit to tray", + "exitToTray_description": "exit the application to the system tray", + "floatingQueueArea": "show floating queue hover area", + "floatingQueueArea_description": "display a hover icon on the right side of the screen to view the play queue", + "followLyric": "follow current lyric", + "followLyric_description": "scroll the lyric to the current playing position", + "font": "font", + "font_description": "sets the font to use for the application", + "fontType": "font type", + "fontType_description": "built-in font selects one of the fonts provided by Feishin. system font allows you to select any font provided by your operating system. custom allows you to provide your own font", + "fontType_optionBuiltIn": "built-in font", + "fontType_optionCustom": "custom font", + "fontType_optionSystem": "system font", + "gaplessAudio": "gapless audio", + "gaplessAudio_description": "sets the gapless audio setting for mpv", + "gaplessAudio_optionWeak": "weak (recommended)", + "globalMediaHotkeys": "global media hotkeys", + "globalMediaHotkeys_description": "enable or disable the usage of your system media hotkeys to control playback", + "hotkey_browserBack": "browser back", + "hotkey_browserForward": "browser forward", + "hotkey_favoriteCurrentSong": "favorite $t(common.currentSong)", + "hotkey_favoritePreviousSong": "favorite $t(common.previousSong)", + "hotkey_globalSearch": "global search", + "hotkey_localSearch": "in-page search", + "hotkey_playbackNext": "next track", + "hotkey_playbackPause": "pause", + "hotkey_playbackPlay": "play", + "hotkey_playbackPlayPause": "play / pause", + "hotkey_playbackPrevious": "previous track", + "hotkey_playbackStop": "stop", + "hotkey_rate0": "rating clear", + "hotkey_rate1": "rating 1 star", + "hotkey_rate2": "rating 2 stars", + "hotkey_rate3": "rating 3 stars", + "hotkey_rate4": "rating 4 stars", + "hotkey_rate5": "rating 5 stars", + "hotkey_skipBackward": "skip backward", + "hotkey_skipForward": "skip forward", + "hotkey_toggleCurrentSongFavorite": "toggle $t(common.currentSong) favorite", + "hotkey_toggleFullScreenPlayer": "toggle full screen player", + "hotkey_togglePreviousSongFavorite": "toggle $t(common.previousSong) favorite", + "hotkey_toggleQueue": "toggle queue", + "hotkey_toggleRepeat": "toggle repeat", + "hotkey_toggleShuffle": "toggle shuffle", + "hotkey_unfavoriteCurrentSong": "unfavorite $t(common.currentSong)", + "hotkey_unfavoritePreviousSong": "unfavorite $t(common.previousSong)", + "hotkey_volumeDown": "volume down", + "hotkey_volumeMute": "volume mute", + "hotkey_volumeUp": "volume up", + "hotkey_zoomIn": "zoom in", + "hotkey_zoomOut": "zoom out", + "language": "language", + "language_description": "sets the language for the application ($t(common.restartRequired))", + "lyricFetch": "fetch lyrics from the internet", + "lyricFetch_description": "fetch lyrics from various internet sources", + "lyricFetchProvider": "providers to fetch lyrics from", + "lyricFetchProvider_description": "select the providers to fetch lyrics from. the order of the providers is the order in which they will be queried", + "lyricOffset": "lyric offset (ms)", + "lyricOffset_description": "offset the lyric by the specified amount of milliseconds", + "minimizeToTray": "minimize to tray", + "minimizeToTray_description": "minimize the application to the system tray", + "minimumScrobblePercentage": "minimum scrobble duration (percentage)", + "minimumScrobblePercentage_description": "the minimum percentage of the song that must be played before it is scrobbled", + "minimumScrobbleSeconds": "minimum scrobble (seconds)", + "minimumScrobbleSeconds_description": "the minimum duration in seconds of the song that must be played before it is scrobbled", + "mpvExecutablePath": "mpv executable path", + "mpvExecutablePath_description": "sets the path to the mpv executable", + "mpvExecutablePath_help": "one per line", + "mpvExtraParameters": "mpv parameters", + "playbackStyle": "playback style", + "playbackStyle_description": "select the playback style to use for the audio player", + "playbackStyle_optionCrossFade": "crossfade", + "playbackStyle_optionNormal": "normal", + "playButtonBehavior": "play button behavior", + "playButtonBehavior_description": "sets the default behavior of the play button when adding songs to the queue", + "playButtonBehavior_optionAddLast": "$t(player.addLast)", + "playButtonBehavior_optionAddNext": "$t(player.addNext)", + "playButtonBehavior_optionPlay": "$t(player.play)", + "remotePassword": "remote control server password", + "remotePassword_description": "sets the password for the remote control server. These credentials are by default transferred insecurely, so you should use a unique password that you do not care about", + "remotePort": "remote control server port", + "remotePort_description": "sets the port for the remote control server", + "remoteUsername": "remote control server username", + "remoteUsername_description": "sets the username for the remote control server. if both username and password are empty, authentication will be disabled", + "replayGainClipping": "{{ReplayGain}} clipping", + "replayGainClipping_description": "Prevent clipping caused by {{ReplayGain}} by automatically lowering the gain", + "replayGainFallback": "{{ReplayGain}} fallback", + "replayGainFallback_description": "gain in db to apply if the file has no {{ReplayGain}} tags", + "replayGainMode": "{{ReplayGain}} mode", + "replayGainMode_description": "adjust volume gain according to {{ReplayGain}} values stored in the file metadata", + "replayGainMode_optionAlbum": "$t(entity.album_one)", + "replayGainMode_optionNone": "$t(common.none)", + "replayGainMode_optionTrack": "$t(entity.track_one)", + "replayGainPreamp": "{{ReplayGain}} preamp (dB)", + "replayGainPreamp_description": "adjust the preamp gain applied to the {{ReplayGain}} values", + "sampleRate": "sample rate", + "sampleRate_description": "select the output sample rate to be used if the sample frequency selected is different from that of the current media", + "savePlayQueue": "save play queue", + "savePlayQueue_description": "save the play queue when the application is closed and restore it when the application is opened", + "scrobble": "scrobble", + "scrobble_description": "scrobble plays to your media server", + "showSkipButton": "show skip buttons", + "showSkipButton_description": "show or hide the skip buttons on the player bar", + "showSkipButtons": "show skip buttons", + "showSkipButtons_description": "show or hide the skip buttons on the player bar", + "sidebarCollapsedNavigation": "sidebar (collapsed) navigation", + "sidebarCollapsedNavigation_description": "show or hide the navigation in the collapsed sidebar", + "sidebarConfiguration": "sidebar configuration", + "sidebarConfiguration_description": "select the items and order in which they appear in the sidebar", + "sidebarPlaylistList": "sidebar playlist list", + "sidebarPlaylistList_description": "show or hide the playlist list in the sidebar", + "sidePlayQueueStyle": "side play queue style", + "sidePlayQueueStyle_description": "sets the style of the side play queue", + "sidePlayQueueStyle_optionAttached": "attached", + "sidePlayQueueStyle_optionDetached": "detached", + "skipDuration": "skip duration", + "skipDuration_description": "sets the duration to skip when using the skip buttons on the player bar", + "skipPlaylistPage": "skip playlist page", + "skipPlaylistPage_description": "when navigating to a playlist, go to the playlist song list page instead of the default page", + "theme": "theme", + "theme_description": "sets the theme to use for the application", + "themeDark": "theme (dark)", + "themeDark_description": "sets the dark theme to use for the application", + "themeLight": "theme (light)", + "themeLight_description": "sets the light theme to use for the application", + "useSystemTheme": "use system theme", + "useSystemTheme_description": "follow the system-defined light or dark preference", + "volumeWheelStep": "volume wheel step", + "volumeWheelStep_description": "the amount of volume to change when scrolling the mouse wheel on the volume slider", + "windowBarStyle": "window bar style", + "windowBarStyle_description": "select the style of the window bar", + "zoom": "zoom percentage", + "zoom_description": "sets the zoom percentage for the application" + }, + "table": { + "column": { + "album": "album", + "albumArtist": "album artist", + "albumCount": "$t(entity.album_other)", + "artist": "$t(entity.artist_one)", + "biography": "biography", + "bitrate": "bitrate", + "bpm": "bpm", + "channels": "$t(common.channel_other)", + "comment": "comment", + "dateAdded": "date added", + "discNumber": "disc", + "favorite": "favorite", + "genre": "$t(entity.genre_one)", + "lastPlayed": "last played", + "path": "path", + "playCount": "plays", + "rating": "rating", + "releaseDate": "release date", + "releaseYear": "year", + "songCount": "$t(entity.track_other)", + "title": "title", + "trackNumber": "track" + }, + "config": { + "general": { + "autoFitColumns": "auto fit columns", + "displayType": "display type", + "gap": "$t(common.gap)", + "size": "$t(common.size)", + "tableColumns": "table columns" + }, + "label": { + "actions": "$t(common.action_other)", + "album": "$t(entity.album_one)", + "albumArtist": "$t(entity.albumArtist_one)", + "artist": "$t(entity.artist_one)", + "biography": "$t(common.biography)", + "bitrate": "$t(common.bitrate)", + "bpm": "$t(common.bpm)", + "channels": "$t(common.channel_other)", + "dateAdded": "date added", + "discNumber": "disc number", + "duration": "$t(common.duration)", + "favorite": "$t(common.favorite)", + "genre": "$t(entity.genre_one)", + "lastPlayed": "last played", + "note": "$t(common.note)", + "owner": "$t(common.owner)", + "path": "$t(common.path)", + "playCount": "play count", + "rating": "$t(common.rating)", + "releaseDate": "release date", + "rowIndex": "row index", + "size": "$t(common.size)", + "title": "$t(common.title)", + "titleCombined": "$t(common.title) (combined)", + "trackNumber": "track number", + "year": "$t(common.year)" + }, + "view": { + "card": "card", + "poster": "poster", + "table": "table" + } + } + } } diff --git a/src/renderer/api/controller.ts b/src/renderer/api/controller.ts index 90b360a4..196a848c 100644 --- a/src/renderer/api/controller.ts +++ b/src/renderer/api/controller.ts @@ -54,6 +54,7 @@ import { DeletePlaylistResponse, RandomSongListArgs } from './types'; import { ndController } from '/@/renderer/api/navidrome/navidrome-controller'; import { ssController } from '/@/renderer/api/subsonic/subsonic-controller'; import { jfController } from '/@/renderer/api/jellyfin/jellyfin-controller'; +import i18n from '/@/i18n/i18n'; export type ControllerEndpoint = Partial<{ addToPlaylist: (args: AddToPlaylistArgs) => Promise; @@ -212,7 +213,12 @@ const apiController = (endpoint: keyof ControllerEndpoint, type?: ServerType) => const serverType = type || useAuthStore.getState().currentServer?.type; if (!serverType) { - toast.error({ message: 'No server selected', title: 'Unable to route request' }); + toast.error({ + message: i18n.t('error.serverNotSelectedError', { + postProcess: 'sentenceCase', + }) as string, + title: i18n.t('error.apiRouteError', { postProcess: 'sentenceCase' }) as string, + }); throw new Error(`No server selected`); } @@ -221,10 +227,16 @@ const apiController = (endpoint: keyof ControllerEndpoint, type?: ServerType) => if (typeof controllerFn !== 'function') { toast.error({ message: `Endpoint ${endpoint} is not implemented for ${serverType}`, - title: 'Unable to route request', + title: i18n.t('error.apiRouteError', { postProcess: 'sentenceCase' }) as string, }); - throw new Error(`Endpoint ${endpoint} is not implemented for ${serverType}`); + throw new Error( + i18n.t('error.endpointNotImplementedError', { + endpoint, + postProcess: 'sentenceCase', + serverType, + }) as string, + ); } return endpoints[serverType][endpoint]; diff --git a/src/renderer/api/navidrome/navidrome-api.ts b/src/renderer/api/navidrome/navidrome-api.ts index 32852e93..25cb1939 100644 --- a/src/renderer/api/navidrome/navidrome-api.ts +++ b/src/renderer/api/navidrome/navidrome-api.ts @@ -9,6 +9,7 @@ import { authenticationFailure, resultWithHeaders } from '/@/renderer/api/utils' import { useAuthStore } from '/@/renderer/store'; import { ServerListItem } from '/@/renderer/types'; import { toast } from '/@/renderer/components'; +import i18n from '/@/i18n/i18n'; const localSettings = isElectron() ? window.electron.localSettings : null; @@ -276,9 +277,12 @@ axiosClient.interceptors.response.use( if (res.status === 429) { toast.error({ - message: - 'you have exceeded the number of allowed login requests. Please wait before logging, or consider tweaking AuthRequestLimit', - title: 'Your session has expired.', + message: i18n.t('error.loginRateError', { + postProcess: 'sentenceCase', + }) as string, + title: i18n.t('error.sessionExpiredError', { + postProcess: 'sentenceCase', + }) as string, }); const serverId = currentServer.id; @@ -292,7 +296,11 @@ axiosClient.interceptors.response.use( throw TIMEOUT_ERROR; } if (res.status !== 200) { - throw new Error('Failed to authenticate'); + throw new Error( + i18n.t('error.authenticatedFailed', { + postProcess: 'sentenceCase', + }) as string, + ); } const newCredential = res.data.token; diff --git a/src/renderer/api/subsonic/subsonic-api.ts b/src/renderer/api/subsonic/subsonic-api.ts index edd7ee3b..858172f9 100644 --- a/src/renderer/api/subsonic/subsonic-api.ts +++ b/src/renderer/api/subsonic/subsonic-api.ts @@ -6,6 +6,7 @@ import { z } from 'zod'; import { ssType } from '/@/renderer/api/subsonic/subsonic-types'; import { ServerListItem } from '/@/renderer/api/types'; import { toast } from '/@/renderer/components/toast/index'; +import i18n from '/@/i18n/i18n'; const c = initContract(); @@ -106,7 +107,7 @@ axiosClient.interceptors.response.use( if (data['subsonic-response'].error.code !== 0) { toast.error({ message: data['subsonic-response'].error.message, - title: 'Issue from Subsonic API', + title: i18n.t('error.genericError', { postProcess: 'sentenceCase' }) as string, }); } } diff --git a/src/renderer/app.tsx b/src/renderer/app.tsx index 39d1cd71..1b6b82b0 100644 --- a/src/renderer/app.tsx +++ b/src/renderer/app.tsx @@ -26,6 +26,7 @@ import { PlayerState, usePlayerStore, useQueueControls } from '/@/renderer/store import { FontType, PlaybackType, PlayerStatus } from '/@/renderer/types'; import '@ag-grid-community/styles/ag-grid.css'; import { useDiscordRpc } from '/@/renderer/features/discord-rpc/use-discord-rpc'; +import i18n from '/@/i18n/i18n'; ModuleRegistry.registerModules([ClientSideRowModelModule, InfiniteRowModelModule]); @@ -39,6 +40,7 @@ const remote = isElectron() ? window.electron.remote : null; export const App = () => { const theme = useTheme(); const accent = useSettingsStore((store) => store.general.accent); + const language = useSettingsStore((store) => store.general.language); const { builtIn, custom, system, type } = useSettingsStore((state) => state.font); const { type: playbackType } = usePlaybackSettings(); const { bindings } = useHotkeySettings(); @@ -178,6 +180,12 @@ export const App = () => { // eslint-disable-next-line react-hooks/exhaustive-deps }, []); + useEffect(() => { + if (language) { + i18n.changeLanguage(language); + } + }, [language]); + return ( { + const { t } = useTranslation(); const handlePlayQueueAdd = usePlayQueueAdd(); const [itemIndex, setItemIndex] = useState(0); const [direction, setDirection] = useState(0); @@ -224,7 +226,7 @@ export const FeatureCarousel = ({ data }: FeatureCarouselProps) => { }); }} > - Play + {t('player.play', { postProcess: 'titleCase' })} - Display type + + {t('table.config.general.displayType', { postProcess: 'titleCase' })} + - Card + {t('table.config.view.card', { postProcess: 'titleCase' })} - Poster + {t('table.config.view.poster', { postProcess: 'titleCase' })} - Table + {t('table.config.view.table', { postProcess: 'titleCase' })} - Item size + + {t('table.config.general.size', { postProcess: 'titleCase' })} + - Table Columns + + {t('table.config.general.tableColumns', { + postProcess: 'titleCase', + })} + - Auto Fit Columns + + {t('table.config.general.autoFitColumns', { + postProcess: 'titleCase', + })} + ; @@ -25,6 +26,7 @@ interface GenreListHeaderProps { } export const GenreListHeader = ({ itemCount, gridRef, tableRef }: GenreListHeaderProps) => { + const { t } = useTranslation(); const cq = useContainerQuery(); const server = useCurrentServer(); const { pageKey } = useListContext(); @@ -66,7 +68,9 @@ export const GenreListHeader = ({ itemCount, gridRef, tableRef }: GenreListHeade w="100%" > - Genres + + {t('page.genreList.title', { postProcess: 'titleCase' })} + diff --git a/src/renderer/features/home/routes/home-route.tsx b/src/renderer/features/home/routes/home-route.tsx index e49f7554..25b8bb10 100644 --- a/src/renderer/features/home/routes/home-route.tsx +++ b/src/renderer/features/home/routes/home-route.tsx @@ -11,9 +11,11 @@ import { MemoizedSwiperGridCarousel } from '/@/renderer/components/grid-carousel import { Platform } from '/@/renderer/types'; import { useQueryClient } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; +import { useTranslation } from 'react-i18next'; import { RiRefreshLine } from 'react-icons/ri'; const HomeRoute = () => { + const { t } = useTranslation(); const queryClient = useQueryClient(); const scrollAreaRef = useRef(null); const server = useCurrentServer(); @@ -105,7 +107,7 @@ const HomeRoute = () => { data: random?.data?.items, sortBy: AlbumListSort.RANDOM, sortOrder: SortOrder.ASC, - title: 'Explore from your library', + title: t('page.home.explore', { postProcess: 'sentenceCase' }), uniqueId: 'random', }, { @@ -115,7 +117,7 @@ const HomeRoute = () => { }, sortBy: AlbumListSort.RECENTLY_PLAYED, sortOrder: SortOrder.DESC, - title: 'Recently played', + title: t('page.home.recentlyPlayed', { postProcess: 'sentenceCase' }), uniqueId: 'recentlyPlayed', }, { @@ -125,7 +127,7 @@ const HomeRoute = () => { }, sortBy: AlbumListSort.RECENTLY_ADDED, sortOrder: SortOrder.DESC, - title: 'Newly added releases', + title: t('page.home.newlyAdded', { postProcess: 'sentenceCase' }), uniqueId: 'recentlyAdded', }, { @@ -135,7 +137,7 @@ const HomeRoute = () => { }, sortBy: AlbumListSort.PLAY_COUNT, sortOrder: SortOrder.DESC, - title: 'Most played', + title: t('page.home.mostPlayed', { postProcess: 'sentenceCase' }), uniqueId: 'mostPlayed', }, ]; @@ -148,7 +150,9 @@ const HomeRoute = () => { backgroundColor: 'var(--titlebar-bg)', children: ( - Home + + {t('page.home.title', { postProcess: 'titleCase' })} + ), offset: 200, diff --git a/src/renderer/features/lyrics/components/lyrics-search-form.tsx b/src/renderer/features/lyrics/components/lyrics-search-form.tsx index b04fd5ab..7555ded5 100644 --- a/src/renderer/features/lyrics/components/lyrics-search-form.tsx +++ b/src/renderer/features/lyrics/components/lyrics-search-form.tsx @@ -4,6 +4,7 @@ import { useForm } from '@mantine/form'; import { useDebouncedValue } from '@mantine/hooks'; import { openModal } from '@mantine/modals'; import orderBy from 'lodash/orderBy'; +import { useTranslation } from 'react-i18next'; import styled from 'styled-components'; import { InternetProviderLyricSearchResponse, @@ -12,6 +13,7 @@ import { } from '../../../api/types'; import { useLyricSearch } from '../queries/lyric-search-query'; import { ScrollArea, Spinner, Text, TextInput } from '/@/renderer/components'; +import i18n from '/@/i18n/i18n'; const SearchItem = styled.button` all: unset; @@ -84,6 +86,7 @@ interface LyricSearchFormProps { } export const LyricsSearchForm = ({ artist, name, onSearchOverride }: LyricSearchFormProps) => { + const { t } = useTranslation(); const form = useForm({ initialValues: { artist: artist || '', @@ -117,11 +120,17 @@ export const LyricsSearchForm = ({ artist, name, onSearchOverride }: LyricSearch @@ -170,6 +179,6 @@ export const openLyricSearchModal = ({ artist, name, onSearchOverride }: LyricSe /> ), size: 'lg', - title: 'Lyrics Search', + title: i18n.t('form.lyricSearch.title', { postProcess: 'titleCase' }) as string, }); }; diff --git a/src/renderer/features/lyrics/lyrics-actions.tsx b/src/renderer/features/lyrics/lyrics-actions.tsx index f6455ce1..3ce52b13 100644 --- a/src/renderer/features/lyrics/lyrics-actions.tsx +++ b/src/renderer/features/lyrics/lyrics-actions.tsx @@ -1,5 +1,6 @@ import { Box, Group } from '@mantine/core'; import isElectron from 'is-electron'; +import { useTranslation } from 'react-i18next'; import { RiAddFill, RiSubtractFill } from 'react-icons/ri'; import { LyricsOverride } from '/@/renderer/api/types'; import { Button, NumberInput, Tooltip } from '/@/renderer/components'; @@ -22,6 +23,7 @@ export const LyricsActions = ({ onResetLyric, onSearchOverride, }: LyricsActionsProps) => { + const { t } = useTranslation(); const currentSong = useCurrentSong(); const { setSettings } = useSettingsStoreActions(); const { delayMs, sources } = useLyricsSettings(); @@ -54,7 +56,7 @@ export const LyricsActions = ({ }) } > - Search + {t('common.search', { postProcess: 'titleCase' })} ) : null} - Reset + {t('common.reset', { postProcess: 'sentenceCase' })} ) : null} @@ -104,7 +106,7 @@ export const LyricsActions = ({ variant="subtle" onClick={onRemoveLyric} > - Clear + {t('common.clear', { postProcess: 'sentenceCase' })} ) : null} diff --git a/src/renderer/features/now-playing/components/play-queue-list-controls.tsx b/src/renderer/features/now-playing/components/play-queue-list-controls.tsx index 29cc7700..72879812 100644 --- a/src/renderer/features/now-playing/components/play-queue-list-controls.tsx +++ b/src/renderer/features/now-playing/components/play-queue-list-controls.tsx @@ -3,6 +3,7 @@ import type { AgGridReact as AgGridReactType } from '@ag-grid-community/react/li import { Group } from '@mantine/core'; import { Button, Popover } from '/@/renderer/components'; import isElectron from 'is-electron'; +import { useTranslation } from 'react-i18next'; import { RiArrowDownLine, RiArrowUpLine, @@ -27,6 +28,7 @@ interface PlayQueueListOptionsProps { } export const PlayQueueListControls = ({ type, tableRef }: PlayQueueListOptionsProps) => { + const { t } = useTranslation(); const { clearQueue, moveToBottomOfQueue, moveToTopOfQueue, shuffleQueue, removeFromQueue } = useQueueControls(); @@ -115,7 +117,7 @@ export const PlayQueueListControls = ({ type, tableRef }: PlayQueueListOptionsPr @@ -462,7 +468,7 @@ export const PlaylistQueryBuilder = forwardRef( icon={} onClick={handleSave} > - Save and replace + {t('common.saveAndReplace', { postProcess: 'titleCase' })} diff --git a/src/renderer/features/playlists/components/save-as-playlist-form.tsx b/src/renderer/features/playlists/components/save-as-playlist-form.tsx index a0f87d08..5196b245 100644 --- a/src/renderer/features/playlists/components/save-as-playlist-form.tsx +++ b/src/renderer/features/playlists/components/save-as-playlist-form.tsx @@ -4,6 +4,7 @@ import { CreatePlaylistBody, CreatePlaylistResponse, ServerType } from '/@/rende import { Button, Switch, TextInput, toast } from '/@/renderer/components'; import { useCreatePlaylist } from '/@/renderer/features/playlists/mutations/create-playlist-mutation'; import { useCurrentServer } from '/@/renderer/store'; +import { useTranslation } from 'react-i18next'; interface SaveAsPlaylistFormProps { body: Partial; @@ -18,6 +19,7 @@ export const SaveAsPlaylistForm = ({ onSuccess, onCancel, }: SaveAsPlaylistFormProps) => { + const { t } = useTranslation(); const mutation = useCreatePlaylist({}); const server = useCurrentServer(); @@ -40,10 +42,15 @@ export const SaveAsPlaylistForm = ({ { body: values, serverId }, { onError: (err) => { - toast.error({ message: err.message, title: 'Error creating playlist' }); + toast.error({ + message: err.message, + title: t('error.genericError', { postProcess: 'sentenceCase' }), + }); }, onSuccess: (data) => { - toast.success({ message: `Playlist has been created` }); + toast.success({ + message: t('form.createPlaylist.success', { postProcess: 'sentenceCase' }), + }); onSuccess(data); onCancel(); }, @@ -60,16 +67,25 @@ export const SaveAsPlaylistForm = ({ {isPublicDisplayed && ( )} @@ -78,7 +94,7 @@ export const SaveAsPlaylistForm = ({ variant="subtle" onClick={onCancel} > - Cancel + {t('common.cancel', { postProcess: 'titleCase' })} diff --git a/src/renderer/features/playlists/components/update-playlist-form.tsx b/src/renderer/features/playlists/components/update-playlist-form.tsx index 4dea0a70..1192fdad 100644 --- a/src/renderer/features/playlists/components/update-playlist-form.tsx +++ b/src/renderer/features/playlists/components/update-playlist-form.tsx @@ -18,6 +18,8 @@ import { Button, Select, Switch, TextInput, toast } from '/@/renderer/components import { useUpdatePlaylist } from '/@/renderer/features/playlists/mutations/update-playlist-mutation'; import { queryClient } from '/@/renderer/lib/react-query'; import { useCurrentServer } from '/@/renderer/store'; +import { useTranslation } from 'react-i18next'; +import i18n from '/@/i18n/i18n'; interface UpdatePlaylistFormProps { body: Partial; @@ -27,6 +29,7 @@ interface UpdatePlaylistFormProps { } export const UpdatePlaylistForm = ({ users, query, body, onCancel }: UpdatePlaylistFormProps) => { + const { t } = useTranslation(); const mutation = useUpdatePlaylist({}); const server = useCurrentServer(); @@ -60,10 +63,12 @@ export const UpdatePlaylistForm = ({ users, query, body, onCancel }: UpdatePlayl }, { onError: (err) => { - toast.error({ message: err.message, title: 'Error updating playlist' }); + toast.error({ + message: err.message, + title: t('error.genericError', { postProcess: 'sentenceCase' }), + }); }, onSuccess: () => { - toast.success({ message: `Playlist has been saved` }); onCancel(); }, }, @@ -80,23 +85,35 @@ export const UpdatePlaylistForm = ({ users, query, body, onCancel }: UpdatePlayl {isOwnerDisplayed && ( ), - description: 'Sets the application language', + description: t('setting.language', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: false, - title: 'Language', + title: t('setting.language', { postProcess: 'sentenceCase' }), }, { control: ( @@ -155,10 +187,12 @@ export const ApplicationSettings = () => { }} /> ), - description: - 'What font to use. Built-in font selects one of the fonts provided by Feishin. System font allows you to select any font provided by your OS. Custom allows you to provide your own font', + description: t('setting.fontType', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: FONT_TYPES.length === 1, - title: 'Use system font', + title: t('setting.fontType', { postProcess: 'sentenceCase' }), }, { control: ( @@ -177,9 +211,9 @@ export const ApplicationSettings = () => { }} /> ), - description: 'Sets the application content font', + description: t('setting.font', { context: 'description', postProcess: 'sentenceCase' }), isHidden: localFonts && fontSettings.type !== FontType.BUILT_IN, - title: 'Font (Content)', + title: t('setting.font', { postProcess: 'sentenceCase' }), }, { control: ( @@ -199,9 +233,9 @@ export const ApplicationSettings = () => { }} /> ), - description: 'Sets the application content font', + description: t('setting.font', { context: 'description', postProcess: 'sentenceCase' }), isHidden: !localFonts || fontSettings.type !== FontType.SYSTEM, - title: 'Font (Content)', + title: t('setting.font', { postProcess: 'sentenceCase' }), }, { control: ( @@ -219,9 +253,12 @@ export const ApplicationSettings = () => { } /> ), - description: 'Path to custom font', + description: t('setting.customFontPath', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: fontSettings.type !== FontType.CUSTOM, - title: 'Path to custom font', + title: t('setting.customFontPath', { postProcess: 'sentenceCase' }), }, { control: ( @@ -244,9 +281,14 @@ export const ApplicationSettings = () => { }} /> ), - description: 'Sets the application zoom factor in percent', + description: t('setting.zoom', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Zoom factor', + title: t('setting.zoom', { + postProcess: 'sentenceCase', + }), }, ]; diff --git a/src/renderer/features/settings/components/general/control-settings.tsx b/src/renderer/features/settings/components/general/control-settings.tsx index 0d856094..8e9407d0 100644 --- a/src/renderer/features/settings/components/general/control-settings.tsx +++ b/src/renderer/features/settings/components/general/control-settings.tsx @@ -1,5 +1,6 @@ -import isElectron from 'is-electron'; import { Group } from '@mantine/core'; +import { t } from 'i18next'; +import isElectron from 'is-electron'; import { Select, Tooltip, NumberInput, Switch, Slider } from '/@/renderer/components'; import { SettingsSection } from '/@/renderer/features/settings/components/settings-section'; import { @@ -8,15 +9,29 @@ import { useSettingsStoreActions, } from '/@/renderer/store/settings.store'; import { Play } from '/@/renderer/types'; +import { useTranslation } from 'react-i18next'; const localSettings = isElectron() ? window.electron.localSettings : null; const SIDE_QUEUE_OPTIONS = [ - { label: 'Fixed', value: 'sideQueue' }, - { label: 'Floating', value: 'sideDrawerQueue' }, + { + label: t('setting.sidePlayQueueStyle', { + context: 'optionAttached', + postProcess: 'sentenceCase', + }), + value: 'sideQueue', + }, + { + label: t('setting.sidePlayQueueStyle', { + context: 'optionDetached', + postProcess: 'sentenceCase', + }), + value: 'sideDrawerQueue', + }, ]; export const ControlSettings = () => { + const { t } = useTranslation(); const settings = useGeneralSettings(); const { setSettings } = useSettingsStoreActions(); @@ -39,14 +54,17 @@ export const ControlSettings = () => { } /> ), - description: 'Show or hide the skip buttons on the playerbar', + description: t('setting.showSkipButtons', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: false, - title: 'Show skip buttons', + title: t('setting.showSkipButtons', { postProcess: 'sentenceCase' }), }, { control: ( - + { } /> - + { ), - description: - 'The number (in seconds) to skip forward or backward when using the skip buttons', + description: t('setting.skipDuration', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: false, - title: 'Skip duration', + title: t('setting.skipDuration', { postProcess: 'sentenceCase' }), }, { control: ( { } /> ), - description: 'Adjust the playback style (web player only)', + description: t('setting.playbackStyle', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: settings.type !== PlaybackType.WEB, note: status === PlayerStatus.PLAYING ? 'Player must be paused' : undefined, - title: 'Playback style', + title: t('setting.playbackStyle', { + context: 'description', + postProcess: 'sentenceCase', + }), }, { control: ( @@ -116,10 +149,15 @@ export const AudioSettings = () => { } /> ), - description: 'Adjust the crossfade duration (web player only)', + description: t('setting.crossfadeDuration', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: settings.type !== PlaybackType.WEB, note: status === PlayerStatus.PLAYING ? 'Player must be paused' : undefined, - title: 'Crossfade Duration', + title: t('setting.crossfadeDuration', { + postProcess: 'sentenceCase', + }), }, { control: ( @@ -153,10 +191,13 @@ export const AudioSettings = () => { }} /> ), - description: 'Change the crossfade algorithm (web player only)', + description: t('setting.crossfadeStyle', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: settings.type !== PlaybackType.WEB, note: status === PlayerStatus.PLAYING ? 'Player must be paused' : undefined, - title: 'Crossfade Style', + title: t('setting.crossfadeStyle', { postProcess: 'sentenceCase' }), }, ]; diff --git a/src/renderer/features/settings/components/playback/lyric-settings.tsx b/src/renderer/features/settings/components/playback/lyric-settings.tsx index e8574b36..19b37392 100644 --- a/src/renderer/features/settings/components/playback/lyric-settings.tsx +++ b/src/renderer/features/settings/components/playback/lyric-settings.tsx @@ -7,6 +7,7 @@ import { MultiSelect, MultiSelectProps, NumberInput, Switch } from '/@/renderer/ import isElectron from 'is-electron'; import styled from 'styled-components'; import { LyricSource } from '/@/renderer/api/types'; +import { useTranslation } from 'react-i18next'; const localSettings = isElectron() ? window.electron.localSettings : null; @@ -17,6 +18,7 @@ const WorkingButtonSelect = styled(MultiSelect)` `; export const LyricSettings = () => { + const { t } = useTranslation(); const settings = useLyricsSettings(); const { setSettings } = useSettingsStoreActions(); @@ -36,8 +38,11 @@ export const LyricSettings = () => { }} /> ), - description: 'Enable or disable following of current lyric', - title: 'Follow current lyric', + description: t('setting.followLyric', { + context: 'description', + postProcess: 'sentenceCase', + }), + title: t('setting.followLyric', { postProcess: 'sentenceCase' }), }, { control: ( @@ -54,9 +59,12 @@ export const LyricSettings = () => { }} /> ), - description: 'Enable or disable fetching lyrics for the current song', + description: t('setting.lyricFetch', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Fetch lyrics from the internet', + title: t('setting.lyricFetch', { postProcess: 'sentenceCase' }), }, { control: ( @@ -77,10 +85,12 @@ export const LyricSettings = () => { }} /> ), - description: - 'Lyric fetchers should be added in order of preference. This is the order in which they will be queried.', + description: t('setting.lyricFetchProvider', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Providers to fetch lyrics', + title: t('setting.lyricFetchProvider', { postProcess: 'sentenceCase' }), }, { control: ( @@ -99,10 +109,12 @@ export const LyricSettings = () => { }} /> ), - description: - 'Lyric offset (in milliseconds). Positive values mean that lyrics are shown later, and negative mean that lyrics are shown earlier', + description: t('setting.lyricOffset', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Lyric offset', + title: t('setting.lyricOffset', { postProcess: 'sentenceCase' }), }, ]; diff --git a/src/renderer/features/settings/components/playback/mpv-settings.tsx b/src/renderer/features/settings/components/playback/mpv-settings.tsx index 702ee7e8..8ace7997 100644 --- a/src/renderer/features/settings/components/playback/mpv-settings.tsx +++ b/src/renderer/features/settings/components/playback/mpv-settings.tsx @@ -12,6 +12,7 @@ import { useSettingsStoreActions, } from '/@/renderer/store/settings.store'; import { PlaybackType } from '/@/renderer/types'; +import { useTranslation } from 'react-i18next'; const localSettings = isElectron() ? window.electron.localSettings : null; const mpvPlayer = isElectron() ? window.electron.mpvPlayer : null; @@ -60,6 +61,7 @@ export const getMpvProperties = (settings: SettingsState['playback']['mpvPropert }; export const MpvSettings = () => { + const { t } = useTranslation(); const settings = usePlaybackSettings(); const { setSettings } = useSettingsStoreActions(); @@ -116,10 +118,13 @@ export const MpvSettings = () => { onChange={handleSetMpvPath} /> ), - description: 'The location of your mpv executable', + description: t('setting.mpvExecutablePath', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: settings.type !== PlaybackType.LOCAL, note: 'Restart required', - title: 'MPV executable path', + title: t('setting.mpvExecutablePath', { postProcess: 'sentenceCase' }), }, { control: ( @@ -128,9 +133,10 @@ export const MpvSettings = () => { autosize defaultValue={settings.mpvExtraParameters.join('\n')} minRows={4} - placeholder={ - '(Add one per line):\n--gapless-audio=weak\n--prefetch-playlist=yes' - } + placeholder={`(${t('setting.mpvExtraParameters', { + context: 'help', + postProcess: 'sentenceCase', + })}):\n--gapless-audio=weak\n--prefetch-playlist=yes`} width={225} onBlur={(e) => { handleSetExtraParameters(e.currentTarget.value.split('\n')); @@ -145,7 +151,10 @@ export const MpvSettings = () => { $secondary size="sm" > - Options to pass to the player + {t('setting.mpvExtraParameters', { + context: 'description', + postProcess: 'sentenceCase', + })} { ), isHidden: settings.type !== PlaybackType.LOCAL, - note: 'Restart required', - title: 'MPV parameters', + note: t('common.restartRequired', { + postProcess: 'sentenceCase', + }), + title: t('setting.mpvExtraParameters', { + postProcess: 'sentenceCase', + }), }, ]; @@ -169,18 +182,26 @@ export const MpvSettings = () => { control: ( handleSetMpvProperty('replayGainMode', e)} /> ), - description: - 'Adjust volume gain according to replaygain values stored in the file metadata (--replaygain)', - note: 'Restart required', - title: 'ReplayGain mode', + description: t('setting.replayGainMode', { + ReplayGain: 'ReplayGain', + context: 'description', + postProcess: 'sentenceCase', + }), + note: t('common.restartRequired', { postProcess: 'sentenceCase' }), + title: t('setting.replayGainMode', { + ReplayGain: 'ReplayGain', + postProcess: 'sentenceCase', + }), }, { control: ( @@ -244,9 +293,15 @@ export const MpvSettings = () => { onChange={(e) => handleSetMpvProperty('replayGainPreampDB', e)} /> ), - description: - 'Pre-amplification gain in dB to apply to the selected replaygain gain (--replaygain-preamp)', - title: 'ReplayGain preamp (dB)', + description: t('setting.replayGainMode', { + ReplayGain: 'ReplayGain', + context: 'description', + postProcess: 'sentenceCase', + }), + title: t('setting.replayGainPreamp', { + ReplayGain: 'ReplayGain', + postProcess: 'sentenceCase', + }), }, { control: ( @@ -257,9 +312,14 @@ export const MpvSettings = () => { } /> ), - description: - 'Prevent clipping caused by replaygain by automatically lowering the gain (--replaygain-clip)', - title: 'ReplayGain clipping', + description: t('setting.replayGainClipping', { + ReplayGain: 'ReplayGain', + postProcess: 'sentenceCase', + }), + title: t('setting.replayGainClipping', { + ReplayGain: 'ReplayGain', + postProcess: 'sentenceCase', + }), }, { control: ( @@ -269,9 +329,14 @@ export const MpvSettings = () => { onBlur={(e) => handleSetMpvProperty('replayGainFallbackDB', e)} /> ), - description: - 'Gain in dB to apply if the file has no replay gain tags. This option is always applied if the replaygain logic is somehow inactive. If this is applied, no other replaygain options are applied', - title: 'ReplayGain fallback (dB)', + description: t('setting.replayGainFallback', { + ReplayGain: 'ReplayGain', + postProcess: 'sentenceCase', + }), + title: t('setting.replayGainFallback', { + ReplayGain: 'ReplayGain', + postProcess: 'sentenceCase', + }), }, ]; diff --git a/src/renderer/features/settings/components/playback/playback-tab.tsx b/src/renderer/features/settings/components/playback/playback-tab.tsx index 6cb77b8b..a9a240c1 100644 --- a/src/renderer/features/settings/components/playback/playback-tab.tsx +++ b/src/renderer/features/settings/components/playback/playback-tab.tsx @@ -20,12 +20,8 @@ export const PlaybackTab = () => { }>{hasFancyAudio && } - {isElectron() && ( - <> - - - - )} + + ); diff --git a/src/renderer/features/settings/components/playback/scrobble-settings.tsx b/src/renderer/features/settings/components/playback/scrobble-settings.tsx index cfef1ffd..dd57e5b5 100644 --- a/src/renderer/features/settings/components/playback/scrobble-settings.tsx +++ b/src/renderer/features/settings/components/playback/scrobble-settings.tsx @@ -1,8 +1,10 @@ -import { NumberInput, Slider, Switch, Text } from '/@/renderer/components'; +import { NumberInput, Slider, Switch } from '/@/renderer/components'; import { usePlaybackSettings, useSettingsStoreActions } from '/@/renderer/store/settings.store'; import { SettingOption, SettingsSection } from '../settings-section'; +import { useTranslation } from 'react-i18next'; export const ScrobbleSettings = () => { + const { t } = useTranslation(); const settings = usePlaybackSettings(); const { setSettings } = useSettingsStoreActions(); @@ -25,8 +27,11 @@ export const ScrobbleSettings = () => { }} /> ), - description: 'Enable or disable scrobbling to your media server', - title: 'Scrobble', + description: t('setting.scrobble', { + context: 'description', + postProcess: 'sentenceCase', + }), + title: t('setting.scrobble', { postProcess: 'sentenceCase' }), }, { control: ( @@ -50,9 +55,11 @@ export const ScrobbleSettings = () => { }} /> ), - description: - 'The percentage of the song that must be played before submitting a scrobble', - title: 'Minimum scrobble percentage*', + description: t('setting.minimumScrobblePercentage', { + context: 'description', + postProcess: 'sentenceCase', + }), + title: t('setting.minimumScrobblePercentage', { postProcess: 'sentenceCase' }), }, { control: ( @@ -76,21 +83,13 @@ export const ScrobbleSettings = () => { }} /> ), - description: - 'The duration in seconds of a song that must be played before submitting a scrobble', - title: 'Minimum scrobble duration (seconds)*', + description: t('setting.minimumScrobblePercentage', { + context: 'description', + postProcess: 'sentenceCase', + }), + title: t('setting.minimumScrobbleSeconds', { postProcess: 'sentenceCase' }), }, ]; - return ( - <> - - - *The scrobble will be submitted if one or more of the above conditions is met - - - ); + return ; }; diff --git a/src/renderer/features/settings/components/settings-content.tsx b/src/renderer/features/settings/components/settings-content.tsx index 7d4864e0..fdeea873 100644 --- a/src/renderer/features/settings/components/settings-content.tsx +++ b/src/renderer/features/settings/components/settings-content.tsx @@ -2,6 +2,7 @@ import { lazy } from 'react'; import { Tabs } from '/@/renderer/components'; import { useSettingsStore, useSettingsStoreActions } from '/@/renderer/store/settings.store'; import isElectron from 'is-electron'; +import { useTranslation } from 'react-i18next'; import styled from 'styled-components'; const GeneralTab = lazy(() => @@ -36,6 +37,7 @@ const TabContainer = styled.div` `; export const SettingsContent = () => { + const { t } = useTranslation(); const currentTab = useSettingsStore((state) => state.tab); const { setSettings } = useSettingsStoreActions(); @@ -49,10 +51,20 @@ export const SettingsContent = () => { onTabChange={(e) => e && setSettings({ tab: e })} > - General - Playback - Hotkeys - {isElectron() && Window} + + {t('page.setting.generalTab', { postProcess: 'sentenceCase' })} + + + {t('page.setting.playbackTab', { postProcess: 'sentenceCase' })} + + + {t('page.setting.hotkeysTab', { postProcess: 'sentenceCase' })} + + {isElectron() && ( + + {t('page.setting.windowTab', { postProcess: 'sentenceCase' })} + + )} diff --git a/src/renderer/features/settings/components/settings-header.tsx b/src/renderer/features/settings/components/settings-header.tsx index 4dba5a39..01fef382 100644 --- a/src/renderer/features/settings/components/settings-header.tsx +++ b/src/renderer/features/settings/components/settings-header.tsx @@ -1,11 +1,13 @@ import { Flex, Group } from '@mantine/core'; import { closeAllModals, openModal } from '@mantine/modals'; +import { useTranslation } from 'react-i18next'; import { RiSettings2Fill } from 'react-icons/ri'; import { Button, ConfirmModal, PageHeader } from '/@/renderer/components'; import { LibraryHeaderBar } from '/@/renderer/features/shared'; import { useSettingsStoreActions } from '../../../store/settings.store'; export const SettingsHeader = () => { + const { t } = useTranslation(); const { reset } = useSettingsStoreActions(); const handleResetToDefault = () => { @@ -15,8 +17,12 @@ export const SettingsHeader = () => { const openResetConfirmModal = () => { openModal({ - children: Are you sure?, - title: 'Reset settings to default', + children: ( + + {t('common.areYouSure', { postProcess: 'sentenceCase' })} + + ), + title: t('common.resetToDefault', { postProcess: 'sentenceCase' }), }); }; @@ -31,14 +37,16 @@ export const SettingsHeader = () => { > - Settings + + {t('common.setting', { count: 2, postProcess: 'titleCase' })} + diff --git a/src/renderer/features/settings/components/settings-section.tsx b/src/renderer/features/settings/components/settings-section.tsx index 47a1442b..cee5b526 100644 --- a/src/renderer/features/settings/components/settings-section.tsx +++ b/src/renderer/features/settings/components/settings-section.tsx @@ -20,7 +20,7 @@ export const SettingsSection = ({ options }: SettingsSectionProps) => { .filter((o) => !o.isHidden) .map((option) => ( ))} diff --git a/src/renderer/features/settings/components/window/discord-settings.tsx b/src/renderer/features/settings/components/window/discord-settings.tsx index 2481613c..f30fd459 100644 --- a/src/renderer/features/settings/components/window/discord-settings.tsx +++ b/src/renderer/features/settings/components/window/discord-settings.tsx @@ -5,8 +5,10 @@ import { SettingsSection, } from '/@/renderer/features/settings/components/settings-section'; import { useDiscordSetttings, useSettingsStoreActions } from '/@/renderer/store'; +import { useTranslation } from 'react-i18next'; export const DiscordSettings = () => { + const { t } = useTranslation(); const settings = useDiscordSetttings(); const { setSettings } = useSettingsStoreActions(); @@ -25,10 +27,19 @@ export const DiscordSettings = () => { }} /> ), - description: - 'Enable playback status in Discord rich presence. Image keys include: "icon", "playing", and "paused"', + description: t('setting.discordRichPresence', { + context: 'description', + discord: 'Discord', + icon: 'icon', + paused: 'paused', + playing: 'playing', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Discord rich presence', + title: t('setting.discordRichPresence', { + discord: 'Discord', + postProcess: 'sentenceCase', + }), }, { control: ( @@ -44,9 +55,17 @@ export const DiscordSettings = () => { }} /> ), - description: 'The Discord application ID (defaults to 1165957668758900787)', + description: t('setting.discordApplicationId', { + context: 'description', + defaultId: '1165957668758900787', + discord: 'Discord', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Discord application ID', + title: t('setting.discordApplicationId', { + discord: 'Discord', + postProcess: 'sentenceCase', + }), }, { control: ( @@ -67,9 +86,15 @@ export const DiscordSettings = () => { }} /> ), - description: 'The time in seconds between each update (minimum 15 seconds)', + description: t('setting.discordUpdateInterval', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Rich presence update interval (seconds)', + title: t('setting.discordUpdateInterval', { + discord: 'Discord', + postProcess: 'sentenceCase', + }), }, { control: ( @@ -85,9 +110,14 @@ export const DiscordSettings = () => { }} /> ), - description: 'When enabled, the rich presence will update while player is idle', + description: t('setting.discordIdleStatus', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Show rich presence when idle', + title: t('setting.discordIdleStatus', { + postProcess: 'sentenceCase', + }), }, ]; diff --git a/src/renderer/features/settings/components/window/update-settings.tsx b/src/renderer/features/settings/components/window/update-settings.tsx index a5b34333..ddb94d31 100644 --- a/src/renderer/features/settings/components/window/update-settings.tsx +++ b/src/renderer/features/settings/components/window/update-settings.tsx @@ -1,4 +1,5 @@ import isElectron from 'is-electron'; +import { useTranslation } from 'react-i18next'; import { useWindowSettings, useSettingsStoreActions } from '../../../../store/settings.store'; import { SettingsSection, @@ -9,6 +10,7 @@ import { Switch } from '/@/renderer/components'; const localSettings = isElectron() ? window.electron.localSettings : null; export const UpdateSettings = () => { + const { t } = useTranslation(); const settings = useWindowSettings(); const { setSettings } = useSettingsStoreActions(); @@ -31,9 +33,12 @@ export const UpdateSettings = () => { }} /> ), - description: 'Enabling this option will disable checking for new versions on startup', + description: t('setting.disableAutomaticUpdates', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Disable automatic updates', + title: t('setting.disableAutomaticUpdates', { postProcess: 'sentenceCase' }), }, ]; diff --git a/src/renderer/features/settings/components/window/window-settings.tsx b/src/renderer/features/settings/components/window/window-settings.tsx index 0dcfa88f..899b328b 100644 --- a/src/renderer/features/settings/components/window/window-settings.tsx +++ b/src/renderer/features/settings/components/window/window-settings.tsx @@ -1,5 +1,6 @@ import isElectron from 'is-electron'; import { Platform } from '/@/renderer/types'; +import { useTranslation } from 'react-i18next'; import { useWindowSettings, useSettingsStoreActions } from '../../../../store/settings.store'; import { SettingsSection, @@ -17,6 +18,7 @@ const WINDOW_BAR_OPTIONS = [ const localSettings = isElectron() ? window.electron.localSettings : null; export const WindowSettings = () => { + const { t } = useTranslation(); const settings = useWindowSettings(); const { setSettings } = useSettingsStoreActions(); @@ -43,12 +45,15 @@ export const WindowSettings = () => { toast.info({ autoClose: false, id: 'restart-toast', - message: - 'Restart to apply changes... close the notification to restart Feishin', + message: t('common.forceRestartRequired', { + postProcess: 'sentenceCase', + }), onClose: () => { window.electron.ipc!.send('app-restart'); }, - title: 'Restart required', + title: t('common.restartRequired', { + postProcess: 'sentenceCase', + }), }); } else { toast.update({ @@ -69,9 +74,12 @@ export const WindowSettings = () => { }} /> ), - description: 'Adjust the style of the application window bar', + description: t('setting.windowBarStyle', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Window bar style', + title: t('setting.windowBarStyle', { postProcess: 'sentenceCase' }), }, { control: ( @@ -91,9 +99,12 @@ export const WindowSettings = () => { }} /> ), - description: 'Minimize the application to the system tray', + description: t('setting.minimizeToTray', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Minimize to tray', + title: t('setting.minimizeToTray', { postProcess: 'sentenceCase' }), }, { control: ( @@ -113,9 +124,12 @@ export const WindowSettings = () => { }} /> ), - description: 'Exit the application to the system tray', + description: t('setting.exitToTray', { + context: 'description', + postProcess: 'sentenceCase', + }), isHidden: !isElectron(), - title: 'Exit to tray', + title: t('setting.exitToTray', { postProcess: 'sentenceCase' }), }, ]; diff --git a/src/renderer/features/shared/components/library-header.tsx b/src/renderer/features/shared/components/library-header.tsx index f1d96091..1a461455 100644 --- a/src/renderer/features/shared/components/library-header.tsx +++ b/src/renderer/features/shared/components/library-header.tsx @@ -1,5 +1,6 @@ -import { Group } from '@mantine/core'; import { forwardRef, ReactNode, Ref, useState } from 'react'; +import { Group } from '@mantine/core'; +import { useTranslation } from 'react-i18next'; import { Link } from 'react-router-dom'; import styles from './library-header.module.scss'; import { LibraryItem } from '/@/renderer/api/types'; @@ -20,12 +21,30 @@ export const LibraryHeader = forwardRef( { imageUrl, imagePlaceholderUrl, background, title, item, children }: LibraryHeaderProps, ref: Ref, ) => { + const { t } = useTranslation(); const [isImageError, setIsImageError] = useState(false); const onImageError = () => { setIsImageError(true); }; + const itemTypeString = () => { + switch (item.type) { + case LibraryItem.ALBUM: + return t('entity.album', { count: 1 }); + case LibraryItem.ARTIST: + return t('entity.artist', { count: 1 }); + case LibraryItem.ALBUM_ARTIST: + return t('entity.albumArtist', { count: 1 }); + case LibraryItem.PLAYLIST: + return t('entity.playlist', { count: 1 }); + case LibraryItem.SONG: + return t('entity.track', { count: 1 }); + default: + return t('common.unknown'); + } + }; + return (
- {item.type} + {itemTypeString()}

{title}

diff --git a/src/renderer/features/shared/components/order-toggle-button.tsx b/src/renderer/features/shared/components/order-toggle-button.tsx index 78cc562b..44fafd6c 100644 --- a/src/renderer/features/shared/components/order-toggle-button.tsx +++ b/src/renderer/features/shared/components/order-toggle-button.tsx @@ -1,4 +1,5 @@ import { ButtonProps } from '@mantine/core'; +import { useTranslation } from 'react-i18next'; import { RiSortAsc, RiSortDesc } from 'react-icons/ri'; import { SortOrder } from '/@/renderer/api/types'; import { Button, Tooltip } from '/@/renderer/components'; @@ -10,8 +11,15 @@ interface OrderToggleButtonProps { } export const OrderToggleButton = ({ sortOrder, onToggle, buttonProps }: OrderToggleButtonProps) => { + const { t } = useTranslation(); return ( - +