diff --git a/packages/bruno-app/src/components/Welcome/index.js b/packages/bruno-app/src/components/Welcome/index.js index 385a714869..54f7b5378d 100644 --- a/packages/bruno-app/src/components/Welcome/index.js +++ b/packages/bruno-app/src/components/Welcome/index.js @@ -9,9 +9,11 @@ import CreateCollection from 'components/Sidebar/CreateCollection'; import ImportCollection from 'components/Sidebar/ImportCollection'; import ImportCollectionLocation from 'components/Sidebar/ImportCollectionLocation'; import StyledWrapper from './StyledWrapper'; +import { useDictionary } from 'providers/Dictionary/index'; const Welcome = () => { const dispatch = useDispatch(); + const { dictionary } = useDictionary(); const [importedCollection, setImportedCollection] = useState(null); const [importedTranslationLog, setImportedTranslationLog] = useState({}); const [createCollectionModalOpen, setCreateCollectionModalOpen] = useState(false); @@ -20,7 +22,7 @@ const Welcome = () => { const handleOpenCollection = () => { dispatch(openCollection()).catch( - (err) => console.log(err) && toast.error('An error occurred while opening the collection') + (err) => console.log(err) && toast.error(dictionary.errorWhileOpeningCollection) ); }; @@ -38,12 +40,12 @@ const Welcome = () => { .then(() => { setImportCollectionLocationModalOpen(false); setImportedCollection(null); - toast.success('Collection imported successfully'); + toast.success(dictionary.collectionImportedSuccessfully); }) .catch((err) => { setImportCollectionLocationModalOpen(false); console.error(err); - toast.error('An error occurred while importing the collection. Check the logs for more information.'); + toast.error(dictionary.errorWhileImportingCollection); }); }; @@ -66,46 +68,45 @@ const Welcome = () => {
bruno
-
Opensource IDE for exploring and testing APIs
+
{dictionary.aboutBruno}
-
Collections
+
{dictionary.collections}
setCreateCollectionModalOpen(true)}> - Create Collection + {dictionary.createCollection}
- Open Collection + {dictionary.openCollection}
setImportCollectionModalOpen(true)}> - Import Collection + {dictionary.importCollection}
-
Links
- Documentation + {dictionary.documentation}
- Report Issues + {dictionary.reportIssues}
- GitHub + {dictionary.gitHub}
diff --git a/packages/bruno-app/src/dictionaries/en.js b/packages/bruno-app/src/dictionaries/en.js new file mode 100644 index 0000000000..c1da5b9ac5 --- /dev/null +++ b/packages/bruno-app/src/dictionaries/en.js @@ -0,0 +1,14 @@ +export default { + aboutBruno: 'Opensource IDE for exploring and testing APIs', + collections: 'Collections', + createCollection: 'Create Collection', + openCollection: 'Open Collection', + importCollection: 'Import Collection', + documentation: 'Documentation', + reportIssues: 'Report Issues', + gitHub: 'GitHub', + collectionImportedSuccessfully: 'Collection imported successfully', + errorWhileOpeningCollection: 'An error occurred while opening the collection', + errorWhileImportingCollection: + 'An error occurred while importing the collection. Check the logs for more information.' +}; diff --git a/packages/bruno-app/src/dictionaries/index.js b/packages/bruno-app/src/dictionaries/index.js new file mode 100644 index 0000000000..fb5f797dcb --- /dev/null +++ b/packages/bruno-app/src/dictionaries/index.js @@ -0,0 +1,5 @@ +import en from './en.js'; + +export const dictionaries = { + en +}; diff --git a/packages/bruno-app/src/pages/_app.js b/packages/bruno-app/src/pages/_app.js index cf8b3683ea..d2bf8a28d8 100644 --- a/packages/bruno-app/src/pages/_app.js +++ b/packages/bruno-app/src/pages/_app.js @@ -14,6 +14,7 @@ import 'codemirror/lib/codemirror.css'; import 'graphiql/graphiql.min.css'; import 'react-tooltip/dist/react-tooltip.css'; import '@usebruno/graphql-docs/dist/esm/index.css'; +import { DictionaryProvider } from 'providers/Dictionary/index'; function SafeHydrate({ children }) { return
{typeof window === 'undefined' ? null : children}
; @@ -59,13 +60,15 @@ function MyApp({ Component, pageProps }) { - - - - - - - + + + + + + + + + diff --git a/packages/bruno-app/src/providers/Dictionary/index.js b/packages/bruno-app/src/providers/Dictionary/index.js new file mode 100644 index 0000000000..75a399f276 --- /dev/null +++ b/packages/bruno-app/src/providers/Dictionary/index.js @@ -0,0 +1,28 @@ +import React from 'react'; +import { useState, useContext } from 'react'; +import { dictionaries } from 'src/dictionaries/index'; + +export const DictionaryContext = React.createContext(); + +const DictionaryProvider = (props) => { + const [language, setLanguage] = useState('en'); + const dictionary = dictionaries[language] ?? dictionaries.en; + + return ( + + <>{props.children} + + ); +}; + +const useDictionary = () => { + const context = useContext(DictionaryContext); + + if (context === undefined) { + throw new Error(`useDictionary must be used within a DictionaryProvider`); + } + + return context; +}; + +export { useDictionary, DictionaryProvider };