feat: inherit model-picker reorder/accordion persistence and shift-delete from otto-ui (#1833)

* feat(model-picker): drag-to-reorder providers and persist accordion state

Ports two model/provider picker QoL features from otto-ui:
- Persist collapsed state of picker sections (favorites, recent, each
  provider) via a new persisted zustand store so collapse survives
  remounts and reloads, shared across every picker surface.
- Desktop drag-to-reorder of provider sections (whole header as the
  mouse activator, 8px threshold so a plain click still toggles
  collapse), with the order persisted in useUIStore.providerOrder and
  applied across ModelControls, ModelMultiSelect and ModelSelector.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

* feat(sessions): shift-click quick action hard-deletes thread without prompt

Ports the shift-quick-delete feature from otto-ui. The sidebar quick
action (normally archive) becomes a no-prompt hard delete while Shift is
held: the icon switches to a trash bin, the affordance turns destructive,
and the click bypasses the confirmation dialog via a new skipConfirm
source flag. A shared useShiftKeyHeld hook (single window listener set,
useSyncExternalStore) keeps only the small action button re-rendering on
Shift state changes, and resets on window blur so the affordance can't
get stuck after alt-tab.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>

---------

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
This commit is contained in:
Serhii Dziupin
2026-06-26 19:36:47 +03:00
committed by GitHub
co-authored by Serhii Dziupin
parent e7b952cbcb
commit 3e3cd82a47
19 changed files with 377 additions and 45 deletions
@@ -46,6 +46,7 @@ export const ModelSelector: React.FC<ModelSelectorProps> = ({
const toggleFavoriteModel = useUIStore((state) => state.toggleFavoriteModel);
const isFavoriteModel = useUIStore((state) => state.isFavoriteModel);
const addRecentModel = useUIStore((state) => state.addRecentModel);
const providerOrder = useUIStore((state) => state.providerOrder);
const { favoriteModelsList, recentModelsList } = useModelLists();
const { isMobile: deviceIsMobile } = useDeviceInfo();
const isActuallyMobile = isMobile || deviceIsMobile;
@@ -94,6 +95,7 @@ export const ModelSelector: React.FC<ModelSelectorProps> = ({
const picker = (
<ModelPickerList
providers={providers}
providerOrder={providerOrder}
favoriteModels={favoriteModelsList}
recentModels={recentModelsList}
modelsMetadata={modelsMetadata}