diff --git a/app/components/chat.tsx b/app/components/chat.tsx index 55b4bd8e..e6ff6c33 100644 --- a/app/components/chat.tsx +++ b/app/components/chat.tsx @@ -551,6 +551,7 @@ export function ChatActions(props: { items={models.map((m) => ({ title: m.name, value: m.name, + family: m.family, }))} onClose={() => setShowModelSelector(false)} onSelection={(s) => { diff --git a/app/components/ui-lib.module.scss b/app/components/ui-lib.module.scss index a775ac4a..e944c4a6 100644 --- a/app/components/ui-lib.module.scss +++ b/app/components/ui-lib.module.scss @@ -103,6 +103,10 @@ padding: 10px 20px; animation: slide-in ease 0.6s; + &.list-item-separator { + border-bottom: var(--border-in-dark); + } + .list-header { display: flex; align-items: center; diff --git a/app/components/ui-lib.tsx b/app/components/ui-lib.tsx index 3be0a854..02b364e9 100644 --- a/app/components/ui-lib.tsx +++ b/app/components/ui-lib.tsx @@ -488,6 +488,7 @@ export function Selector(props: { title: string; subTitle?: string; value: T; + family?: string; }>; defaultSelectedValue?: T; onSelection?: (selection: T[]) => void; @@ -500,9 +501,15 @@ export function Selector(props: { {props.items.map((item, i) => { const selected = props.defaultSelectedValue === item.value; + const lastOfFamily = + i < props.items.length - 1 && + item.family !== props.items[i + 1].family; return (