MindSift CI & Docker Release / Build, Test in Container & Push (push) Successful in 1m44s
Admin settings: switch, time, retention, list with download and a "Jetzt sichern" button. Account settings: own server backups with download and restore (replace or add, for chosen sections, replace needs a second tap). The MindSift import gets the same section picker. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
38 lines
1.3 KiB
TypeScript
38 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import { Check } from 'lucide-react';
|
|
import { DATA_SECTIONS, DataSection } from '../../lib/types';
|
|
|
|
interface SectionPickerProps {
|
|
value: DataSection[];
|
|
onChange: (sections: DataSection[]) => void;
|
|
label?: string;
|
|
}
|
|
|
|
// Which parts of the own data a restore or import covers; at least one stays selected
|
|
export const SectionPicker: React.FC<SectionPickerProps> = ({ value, onChange, label = 'Bereiche' }) => (
|
|
<div className="flex flex-wrap items-center gap-1.5" role="group" aria-label={label}>
|
|
<span className="text-[11px] text-muted mr-1">{label}:</span>
|
|
{DATA_SECTIONS.map((sec) => {
|
|
const on = value.includes(sec.id);
|
|
return (
|
|
<button
|
|
key={sec.id}
|
|
type="button"
|
|
role="checkbox"
|
|
aria-checked={on}
|
|
onClick={() => {
|
|
const next = on ? value.filter((v) => v !== sec.id) : [...value, sec.id];
|
|
if (next.length > 0) onChange(next);
|
|
}}
|
|
className={`h-11 sm:h-7 px-2.5 rounded-btn border text-[11px] inline-flex items-center gap-1 transition-colors ${
|
|
on ? 'border-accent bg-accent/10 text-main' : 'border-border text-muted hover:text-main'
|
|
}`}
|
|
>
|
|
{on && <Check className="w-3 h-3 text-accent" />}
|
|
{sec.label}
|
|
</button>
|
|
);
|
|
})}
|
|
</div>
|
|
);
|