From d51bd439419dfd00efbf0bc2090e279d0c1c51ee Mon Sep 17 00:00:00 2001
From: Tagaishi <tagaishi@hotmail.ch>
Date: Sun, 13 Aug 2023 22:56:41 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=8C=90=20Add=20new=20tile?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../en/layout/element-selector/selector.json     | 14 ++++++++++++++
 .../Overview/AvailableElementsOverview.tsx       | 16 ++++++++--------
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/public/locales/en/layout/element-selector/selector.json b/public/locales/en/layout/element-selector/selector.json
index 7f7b0c778..3d2b934b0 100644
--- a/public/locales/en/layout/element-selector/selector.json
+++ b/public/locales/en/layout/element-selector/selector.json
@@ -7,5 +7,19 @@
     "goBack": "Go back to the previous step",
     "actionIcon": {
         "tooltip": "Add a tile"
+    },
+    "apps": "Apps",
+    "app": {
+        "defaultName": "Your App"
+    },
+    "widgets": "Widgets",
+    "categories": "Categories",
+    "category": {
+        "newName": "Name of new category",
+        "defaultName": "New Category",
+        "created": {
+            "title": "Category created",
+            "message": "The category \"{{name}}\" has been created"
+        }
     }
 }
diff --git a/src/components/Dashboard/Modals/SelectElement/Components/Overview/AvailableElementsOverview.tsx b/src/components/Dashboard/Modals/SelectElement/Components/Overview/AvailableElementsOverview.tsx
index eb99dbcaa..3f386ff14 100644
--- a/src/components/Dashboard/Modals/SelectElement/Components/Overview/AvailableElementsOverview.tsx
+++ b/src/components/Dashboard/Modals/SelectElement/Components/Overview/AvailableElementsOverview.tsx
@@ -33,12 +33,12 @@ export const AvailableElementTypes = ({
   const onClickCreateCategory = async () => {
     openContextModalGeneric<CategoryEditModalInnerProps>({
       modal: 'categoryEditModal',
-      title: 'Name of new category',
+      title: t('category.newName'),
       withCloseButton: false,
       innerProps: {
         category: {
           id: uuidv4(),
-          name: 'New category',
+          name: t('category.defaultName'),
           position: 0, // doesn't matter, is being overwritten
         },
         onSuccess: async (category) => {
@@ -65,8 +65,8 @@ export const AvailableElementTypes = ({
           })).then(() => {
             closeModal(modalId);
             showNotification({
-              title: 'Category created',
-              message: `The category ${category.name} has been created`,
+              title: t('category.created.title'),
+              message: t('category.created.message', { name: category.name}),
               color: 'teal',
             });
           });
@@ -81,7 +81,7 @@ export const AvailableElementTypes = ({
       <Space h="lg" />
       <Group spacing="md" grow>
         <ElementItem
-          name="Apps"
+          name={t('apps')}
           icon={<IconBox size={40} strokeWidth={1.3} />}
           onClick={() => {
             openContextModalGeneric<{ app: AppType; allowAppNamePropagation: boolean }>({
@@ -89,7 +89,7 @@ export const AvailableElementTypes = ({
               innerProps: {
                 app: {
                   id: uuidv4(),
-                  name: 'Your app',
+                  name: t('app.defaultName'),
                   url: 'https://homarr.dev',
                   appearance: {
                     iconUrl: '/imgs/logo/logo.png',
@@ -126,12 +126,12 @@ export const AvailableElementTypes = ({
           }}
         />
         <ElementItem
-          name="Widgets"
+          name={t('widgets')}
           icon={<IconStack size={40} strokeWidth={1.3} />}
           onClick={onOpenWidgets}
         />
         <ElementItem
-          name="Category"
+          name={t('categories')}
           icon={<IconBoxAlignTop size={40} strokeWidth={1.3} />}
           onClick={onClickCreateCategory}
         />