From 195b9160040115a90c2b9d53c08c359ac1257915 Mon Sep 17 00:00:00 2001 From: Laura Date: Sat, 15 Nov 2025 16:11:26 +0100 Subject: [PATCH] "new" tag --- static/css/dropdown.css | 13 +++++++++++++ static/js/chat.js | 8 +++++++- static/js/dropdown.js | 14 +++++++++++++- 3 files changed, 33 insertions(+), 2 deletions(-) diff --git a/static/css/dropdown.css b/static/css/dropdown.css index c130014..52e046a 100644 --- a/static/css/dropdown.css +++ b/static/css/dropdown.css @@ -103,6 +103,15 @@ font-weight: 500; } +.dropdown .opt .new { + font-size: 11px; + padding-left: 4px; + position: relative; + top: -2px; + color: var(--c-red); + font-weight: 500; +} + .dropdown .label { white-space: nowrap; text-overflow: ellipsis; @@ -120,6 +129,10 @@ height: 18px; } +.dropdown .selected .new { + display: none; +} + .dropdown .selected:not(.all-tags) .tags:has(.tag:nth-child(3)) { display: flex; height: 2px; diff --git a/static/js/chat.js b/static/js/chat.js index 9c2530f..bb2dc08 100644 --- a/static/js/chat.js +++ b/static/js/chat.js @@ -1677,6 +1677,8 @@ } // render models + const newTime = Math.round(Date.now() / 1000) - 2 * 7 * 24 * 60 * 60; + fillSelect($model, data.models, (el, model) => { const separator = "─".repeat(24); @@ -1684,7 +1686,7 @@ model.name, separator, `Tags:\t\t${model.tags?.join(", ") || "-"}`, - `Created:\t${formatTimestamp(model.created)}`, + `Created:\t\t${formatTimestamp(model.created)}`, `Pricing/1M:\t${formatMoney(model.pricing.input)} In | ${formatMoney(model.pricing.output)} Out`, model.pricing.image ? `Images/1K:\t${formatMoney(model.pricing.image * 1000)} Out` : null, separator, @@ -1696,6 +1698,10 @@ el.value = model.id; el.textContent = model.name; + if ((model.created || 0) >= newTime) { + el.dataset.new = "yes"; + } + el.dataset.tags = (model.tags || []).join(","); models[model.id] = model; diff --git a/static/js/dropdown.js b/static/js/dropdown.js index 7e7bb48..8483374 100644 --- a/static/js/dropdown.js +++ b/static/js/dropdown.js @@ -17,7 +17,8 @@ this.#search = "searchable" in el.dataset; this.#_select.querySelectorAll("option").forEach(option => { - const tags = option.dataset.tags?.trim(); + const tags = option.dataset.tags?.trim(), + isNew = !!option.dataset.new; this.#options.push({ value: option.value, @@ -25,6 +26,7 @@ title: option.title || "", tags: tags ? tags.split(",") : [], + new: isNew, search: searchable(option.textContent), }); @@ -102,6 +104,16 @@ _opt.appendChild(_label); + // new tag + if (option.new) { + const _new = make("sup", "new"); + + _new.textContent = "new"; + _new.title = "Less than 2 weeks old"; + + _label.appendChild(_new); + } + // option tags (optional) const tags = option.tags;