fix: restrict delete button to admins

src/components/RangePickerModal.js

@@ -0,0 +1,66 @@
+import { DateRange } from 'react-date-range';
+import { de } from 'date-fns/locale';
+import { buildSelectionRange } from '../utils/dateUtils';
+import 'react-date-range/dist/styles.css';
+import 'react-date-range/dist/theme/default.css';
+
+const RangePickerModal = ({ entry, minDate, onSelectRange, onResetRange, onClose }) => {
+  if (!entry || entry.desiredWeekday) {
+    return null;
+  }
+
+  return (
+    <div className="fixed inset-0 z-40 flex items-center justify-center bg-black bg-opacity-40 px-4" onClick={onClose}>
+      <div
+        className="bg-white rounded-2xl shadow-2xl w-full max-w-lg"
+        onClick={(event) => event.stopPropagation()}
+      >
+        <div className="px-5 pt-5 pb-3 border-b">
+          <p className="text-xs uppercase tracking-wide text-gray-500">Zeitraum auswählen für</p>
+          <p className="text-lg font-semibold text-gray-900">{entry.label || `Store ${entry.id}`}</p>
+        </div>
+        <div className="px-2 py-4">
+          <DateRange
+            onChange={(ranges) => {
+              const { startDate, endDate } = ranges.selection;
+              onSelectRange(startDate, endDate);
+            }}
+            moveRangeOnFirstSelection={false}
+            ranges={[
+              buildSelectionRange(
+                entry.desiredDateRange?.start,
+                entry.desiredDateRange?.end,
+                minDate
+              )
+            ]}
+            rangeColors={['#2563EB']}
+            months={1}
+            direction="horizontal"
+            showDateDisplay={false}
+            locale={de}
+            minDate={minDate}
+          />
+        </div>
+        <div className="flex items-center justify-between px-5 py-3 border-t bg-gray-50 rounded-b-2xl">
+          <button type="button" className="text-sm text-gray-600 hover:text-gray-900" onClick={onResetRange}>
+            Zurücksetzen
+          </button>
+          <div className="flex items-center gap-3">
+            <button type="button" className="text-sm text-gray-600 hover:text-gray-900" onClick={onClose}>
+              Abbrechen
+            </button>
+            <button
+              type="button"
+              className="text-sm font-semibold text-white bg-blue-600 hover:bg-blue-700 px-4 py-2 rounded-md"
+              onClick={onClose}
+            >
+              Fertig
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default RangePickerModal;