u

src/routes/artikel/marken.jsx

@@ -1,69 +1,22 @@
 import { PureComponent, createRef } from 'react';
 import Box from '@mui/material/Box';
-import Button from '@mui/material/Button';
 import CircularProgress from '@mui/material/CircularProgress';
 import BackendError from '../../components/BackendError';
-import SingleLineTextEdit from 'dashgui/SingleLineTextEdit';
 import FillSpace from 'dashgui/FillSpace';
 import { PanelTile, PanelTileGrid } from 'dashgui/panels';
 import { backendErrorFrom } from '../../utils/backendError';
 import { notifyError } from '../../utils/notify';
 import { setLastArticleSku } from '../../automats';
 import brandAutomat from '../../automats/brandAutomat';
-import { enqueueSnackbar } from 'notistack';
 import {
-  BrandImageSearchDialog,
   ArtikelMarke,
+  ArtikelMarkeNew,
 } from '../../components/brand';
 import {
   PURPLE_PANEL,
 } from '../../colors';
 
 
-class ArtikelMarkeNew extends PureComponent {
-  constructor(props) {
-    super(props);
-    this.state = { newName: '' };
-  }
-
-  async submit() {
-    const name = this.state.newName.trim();
-    if (!name) return;
-    await this.props.onCreate?.(name);
-    this.setState({ newName: '' });
-  }
-
-  render() {
-    const { rowRef } = this.props;
-    const { newName } = this.state;
-    return (
-      <Box ref={rowRef} sx={{ display: 'flex', alignItems: 'center', gap: 1, mt: 2, pb: 2 }}>
-        <SingleLineTextEdit
-          size="small"
-          label="Neue Marke"
-          value={newName}
-          onChange={(next) => this.setState({ newName: next })}
-          onKeyDown={(event) => {
-            if (event.key === 'Enter') {
-              event.preventDefault();
-              void this.submit();
-            }
-          }}
-          sx={{ flex: 1 }}
-        />
-        <Button
-          variant="contained"
-          size="small"
-          disabled={!newName.trim()}
-          onClick={() => void this.submit()}
-        >
-          Hinzufügen
-        </Button>
-      </Box>
-    );
-  }
-}
-
 class ArtikelMarkenPage extends PureComponent {
   constructor(props) {
     super(props);
@@ -71,23 +24,14 @@ class ArtikelMarkenPage extends PureComponent {
       status: brandAutomat.state.status,
       error: brandAutomat.state.error ? backendErrorFrom({ message: brandAutomat.state.error }) : null,
       brands: brandAutomat.state.brands,
-      searchBrand: null,
     };
-    this._cancelled = false;
     this.createRowRef = createRef();
-    this.handleCreate = this.handleCreate.bind(this);
     this.handleRetry = this.handleRetry.bind(this);
-    this.handleRename = this.handleRename.bind(this);
-    this.handleDelete = this.handleDelete.bind(this);
-    this.handleSearchLogo = this.handleSearchLogo.bind(this);
   }
 
   componentDidMount() {
     setLastArticleSku(null);
-    this._cancelled = false;
 
-    // Mirror the automat's brands slice directly — the automat owns
-    // fetching (auth/SSE), the component never triggers loads.
     this.unsub = brandAutomat.subscribe(this, (state) => ({
       brands: state.brands,
       status: state.status,
@@ -96,7 +40,6 @@ class ArtikelMarkenPage extends PureComponent {
   }
 
   componentWillUnmount() {
-    this._cancelled = true;
     this.unsub?.();
   }
 
@@ -105,52 +48,6 @@ class ArtikelMarkenPage extends PureComponent {
     void brandAutomat.actions.load().catch((err) => notifyError(err));
   }
 
-  handleSearchLogo(brand) {
-    this.setState({ searchBrand: brand });
-  }
-
-  async handleCreate(name) {
-    const trimmed = String(name ?? '').trim();
-    if (!trimmed) return;
-
-    try {
-      const row = await brandAutomat.actions.create({ name: trimmed });
-      if (this._cancelled) return;
-      enqueueSnackbar(`Marke „${row.name || trimmed}" angelegt.`, { variant: 'success' });
-    } catch (err) {
-      if (this._cancelled) return;
-      notifyError(err);
-      throw err;
-    }
-  }
-
-  async handleRename(brand, draft) {
-    const nextName = String(draft ?? '').trim();
-    if (!nextName || nextName === brand.name) return;
-
-    try {
-      await brandAutomat.actions.rename(brand.id, { name: nextName });
-      if (this._cancelled) return;
-      enqueueSnackbar('Marke gespeichert.', { variant: 'success' });
-    } catch (err) {
-      if (this._cancelled) return;
-      notifyError(err);
-    }
-  }
-
-  async handleDelete(brand) {
-    if (!window.confirm(`Marke „${brand.name}" wirklich löschen?`)) return;
-
-    try {
-      await brandAutomat.actions.remove(brand.id);
-      if (this._cancelled) return;
-      enqueueSnackbar('Marke gelöscht.', { variant: 'success' });
-    } catch (err) {
-      if (this._cancelled) return;
-      notifyError(err);
-    }
-  }
-
   render() {
     const { status, error, brands } = this.state;
 
@@ -176,24 +73,11 @@ class ArtikelMarkenPage extends PureComponent {
             minPageSize={8}
             minHeight={0}
             items={brands}
-            renderItem={(brand) => (
-              <ArtikelMarke
-                brand={brand}
-                onRename={this.handleRename}
-                onSearchLogo={this.handleSearchLogo}
-                onDelete={this.handleDelete}
-              />
-            )}
+            renderItem={ArtikelMarke}
           />
 
-          <ArtikelMarkeNew rowRef={this.createRowRef} onCreate={this.handleCreate} />
+          <ArtikelMarkeNew rowRef={this.createRowRef} />
         </PanelTile>
-
-        <BrandImageSearchDialog
-          open={Boolean(this.state.searchBrand)}
-          brand={this.state.searchBrand}
-          onClose={() => this.setState({ searchBrand: null })}
-        />
       </PanelTileGrid>
     );
   }