u

src/pages/artikel/kategorien.jsx

@@ -14,14 +14,13 @@ import { notifyError } from '../../utils/notify';
 import {
   ArticleTile,
   BackTile,
-  CategoryEditTile,
   CategoryTile,
 } from '../../components/tiles';
 import { TILE_SIZE } from 'dashgui/tiles';
 import withCategoryRoute from './withCategoryRoute';
 import { artikelDetailPath, articleSku } from './articleRoute';
 import { selectCompanyId } from '../../store/companySlice';
-import { selectHasPosterminals, selectPosterminals, loadPosterminals } from '../../store/posterminalSlice';
+import { selectPosterminals, loadPosterminals } from '../../store/posterminalSlice';
 import {
   buildCategoryPath,
   defaultCategoryPath,
@@ -281,7 +280,6 @@ class ArtikelKategorienPage extends Component {
       childCategories,
       articles,
       renameMode,
-      hasTerminals,
       terminals,
     } = this.props;
 
@@ -346,20 +344,19 @@ class ArtikelKategorienPage extends Component {
 
           {childCategories.map((item, index) => {
             const label = categoryDisplayName(item.name, item.id, rootCategoryId);
-            if (renameMode) {
-              const draftName =
-                this.state.drafts[item.id] !== undefined
-                  ? this.state.drafts[item.id]
-                  : label;
-              return (
-                <CategoryEditTile
-                  key={item.id}
-                  data-id={String(item.id)}
-                  className="sortable-item"
-                  label={draftName}
-                  terminals={terminals}
-                  categoryPosterminalIds={item.posterminalIds || []}
-                  onTerminalToggle={(terminalId, enabled) => {
+            const draftName =
+              this.state.drafts[item.id] !== undefined
+                ? this.state.drafts[item.id]
+                : label;
+            const editProps = renameMode
+              ? {
+                  edit: true,
+                  'data-id': String(item.id),
+                  className: 'sortable-item',
+                  label: draftName,
+                  terminals,
+                  categoryPosterminalIds: item.posterminalIds || [],
+                  onTerminalToggle: (terminalId, enabled) => {
                     const thunk = enabled
                       ? this.props.enableTerminalCategory
                       : this.props.disableTerminalCategory;
@@ -373,12 +370,9 @@ class ArtikelKategorienPage extends Component {
                         });
                       })
                       .catch(notifyError);
-                  }}
-                  onOpen={() => this.navigateToCategoryById(item.id)}
-                  hasTerminals={hasTerminals}
-                  categoryFullHash={item.fullHash}
-                  thumbHash={item.thumbHash}
-                  onPhotoUpload={() => {
+                  },
+                  onOpen: () => this.navigateToCategoryById(item.id),
+                  onPhotoUpload: () => {
                     const input = document.createElement('input');
                     input.type = 'file';
                     input.accept = 'image/*';
@@ -398,12 +392,12 @@ class ArtikelKategorienPage extends Component {
                       }
                     };
                     input.click();
-                  }}
-                  onPhotoDelete={() => {
+                  },
+                  onPhotoDelete: () => {
                     void this.props.deleteCategoryImage(item.id)
                       .catch(notifyError);
-                  }}
-                  nameInput={
+                  },
+                  nameInput: (
                     <TextField
                       value={draftName}
                       onChange={(e) => this.handleDraftChange(item.id, e.target.value)}
@@ -429,24 +423,26 @@ class ArtikelKategorienPage extends Component {
                         },
                       }}
                     />
-                  }
-                  editBand={{
+                  ),
+                  editBand: {
                     onMoveLeft: () => this.handleMoveCategory(item, -1),
                     onMoveRight: () => this.handleMoveCategory(item, 1),
                     onDelete: () => this.handleDeleteCategory(item),
                     canLeft: index > 0,
                     canRight: index < childCategories.length - 1,
-                  }}
-                />
-              );
-            }
+                  },
+                }
+              : {
+                  label,
+                  onClick: () => this.navigateToCategoryById(item.id),
+                };
+
             return (
               <CategoryTile
                 key={item.id}
-                label={label}
-                onClick={() => this.navigateToCategoryById(item.id)}
                 thumbHash={item.thumbHash}
                 fullHash={item.fullHash}
+                {...editProps}
               />
             );
           })}
@@ -493,7 +489,6 @@ const mapStateToProps = (state) => ({
   articles: selectCategoryArticles(state),
   canGoBack: selectCanNavigateBack(state),
   renameMode: selectRenameMode(state),
-  hasTerminals: selectHasPosterminals(state),
   terminals: selectPosterminals(state),
 });