@nyris/nyris-webapp 0.3.26 → 0.3.27

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nyris/nyris-webapp",
-  "version": "0.3.26",
+  "version": "0.3.27",
   "homepage": "./",
   "dependencies": {
     "@algolia/autocomplete-js": "^1.7.1",
@@ -12,8 +12,8 @@
     "@material-ui/data-grid": "^4.0.0-alpha.37",
     "@material-ui/icons": "^4.4.1",
     "@material-ui/lab": "^4.0.0-alpha.60",
-    "@nyris/nyris-api": "^0.3.26",
-    "@nyris/nyris-react-components": "^0.3.26",
+    "@nyris/nyris-api": "^0.3.27",
+    "@nyris/nyris-react-components": "^0.3.27",
     "@reduxjs/toolkit": "^1.6.1",
     "@splidejs/react-splide": "^0.7.12",
     "@types/blueimp-load-image": "^2.23.4",

package/src/components/DetailItem.tsx

@@ -349,17 +349,13 @@ function DetailItem(props: Props) {
             >
               <Grid
                 container
-                justifyContent="space-between"
+                justifyContent={
+                  settings.shareOption ? 'space-between' : 'space-around'
+                }
                 alignItems="center"
               >
                 <Grid item>
-                  <Box
-                    display={'flex'}
-                    justifyContent={
-                      settings.shareOption ? 'space-between' : 'space-around'
-                    }
-                    alignItems={'center'}
-                  >
+                  <Box display={'flex'} alignItems={'center'}>
                     <Button
                       className="btn-item"
                       onClick={() => {

package/src/components/input/inputSearch.tsx

@@ -281,7 +281,11 @@ const SearchBox = (props: any) => {
                 history.push('/');
               }}
             >
-              <Tooltip title="clear text search" placement="top" arrow={true}>
+              <Tooltip
+                title={t('Clear text search')}
+                placement="top"
+                arrow={true}
+              >
                 <ClearOutlinedIcon style={{ fontSize: 16, color: '#2B2C46' }} />
               </Tooltip>
             </Button>
@@ -321,7 +325,7 @@ const SearchBox = (props: any) => {
                 })}
               />
               <Tooltip
-                title="Search with an image"
+                title={t('Search with an image')}
                 placement="top"
                 arrow={true}
               >

package/src/page/result/index.tsx

@@ -39,6 +39,7 @@ import {
 import { useAppDispatch, useAppSelector } from 'Store/Store';
 import { showHits } from '../../constants';
 import { DEFAULT_REGION } from '../../constants';
+import { useTranslation } from 'react-i18next';
 
 interface Props {
   allSearchResults: any;
@@ -56,7 +57,7 @@ function ResultComponent(props: Props) {
   const [imageSelection, setImageSelection] = useState<any>(null);
   const executeScroll = () => refBoxResult.current.scrollIntoView('-100px');
   const [filterString, setFilterString] = useState<string>();
-
+  const { t } = useTranslation();
   useEffect(() => {
     if (selectedRegion) {
       setImageSelection(selectedRegion);
@@ -312,7 +313,10 @@ function ResultComponent(props: Props) {
                           </Box>
                           <Box className="box-title_col-left">
                             <Typography style={{ fontSize: 11, color: '#fff' }}>
-                              Adjust the selection frame for better results.
+                              {t(
+                                'Adjust the selection frame for better results',
+                              )}
+                              .
                             </Typography>
                           </Box>
                         </Box>
@@ -447,7 +451,7 @@ function ResultComponent(props: Props) {
                     className="box-change-hit-items"
                   >
                     <span style={{ paddingRight: '10px' }}>
-                      Items per page:
+                      {t('Items per page')}:
                     </span>
                     <HitsPerPage items={showHits} defaultRefinement={20} />
                   </Box>

package/src/translations.ts

@@ -7,6 +7,11 @@ export const translations = {
       'Manufacturer Number': 'Manufacturer Number',
       'Close group': 'Close group',
       'Show group': 'Show group',
+      'Adjust the selection frame for better results':
+        'Adjust the selection frame for better results',
+      'Items per page': 'Items per page',
+      'Search with an image': 'Search with an image',
+      'Clear text search': 'Clear text search',
     },
   },
   de: {
@@ -17,6 +22,11 @@ export const translations = {
       'Manufacturer Number': 'Herst. Teile-Nr.',
       'Close group': 'Schließe Gruppe',
       'Show group': 'Zeige Gruppe',
+      'Adjust the selection frame for better results':
+        'Anpassen des Rahmens für bessere Ergebnisse',
+      'Items per page': 'Artikel pro Seite',
+      'Search with an image': 'Bildsuche',
+      'Clear text search': 'Suchtext löschen',
     },
   },
 };