fix: a11y labels and clearer crew-chat bell aggregation

This commit is contained in:
SkateSpots 2026-10-29 12:52:30 +07:00
parent 6b5a2a7daa
commit 65d90da26f
29 changed files with 35 additions and 7 deletions

View file

@ -52,7 +52,7 @@ export function FirstRunChecklist({ onFindNearby }: { onFindNearby?: () => void
type="button" type="button"
onClick={() => setDismissed(true)} onClick={() => setDismissed(true)}
aria-label={t('mapUi.dismiss')} aria-label={t('mapUi.dismiss')}
className="flex h-6 w-6 flex-shrink-0 items-center justify-center rounded-full text-white/40 transition-colors hover:bg-white/10 hover:text-white" className="flex h-6 w-6 flex-shrink-0 items-center justify-center rounded-full text-white/40 transition-colors hover:bg-white/10 hover:text-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#ccff00] focus-visible:ring-offset-2 focus-visible:ring-offset-black"
> >
<X className="h-3.5 w-3.5" /> <X className="h-3.5 w-3.5" />
</button> </button>
@ -82,7 +82,7 @@ export function FirstRunChecklist({ onFindNearby }: { onFindNearby?: () => void
<Link <Link
to="/crews" to="/crews"
onClick={() => setDismissed(true)} onClick={() => setDismissed(true)}
className="self-center text-xs font-medium text-gray-500 underline underline-offset-2 hover:text-gray-300" className="self-center rounded text-xs font-medium text-gray-500 underline underline-offset-2 hover:text-gray-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#ccff00] focus-visible:ring-offset-2 focus-visible:ring-offset-black"
> >
{t('mapUi.firstRunJoinCrew')} {t('mapUi.firstRunJoinCrew')}
</Link> </Link>

View file

@ -433,7 +433,7 @@ export function NotificationBell({
<MessageCircle className="h-4 w-4 text-[#ff0040]" /> <MessageCircle className="h-4 w-4 text-[#ff0040]" />
</div> </div>
<div className="min-w-0 flex-1"> <div className="min-w-0 flex-1">
<p className="text-sm font-black text-white">{t('socialUi.dms.title')}</p> <p className="text-sm font-black text-white">{t('socialUi.bell.messagesAndCrews')}</p>
<p className="text-xs text-gray-400">{t('socialUi.bell.dmsUnread', { count: unreadDms })}</p> <p className="text-xs text-gray-400">{t('socialUi.bell.dmsUnread', { count: unreadDms })}</p>
</div> </div>
<ArrowRight className="h-4 w-4 shrink-0 text-[#ff0040]" /> <ArrowRight className="h-4 w-4 shrink-0 text-[#ff0040]" />

View file

@ -40,6 +40,7 @@ const batch2 = {
tabNews: "Notícies", tabNews: "Notícies",
tabCrews: "Crews", tabCrews: "Crews",
dmsUnread: "{{count}} missatge(s) xifrat(s) nou(s)", dmsUnread: "{{count}} missatge(s) xifrat(s) nou(s)",
messagesAndCrews: "Missatges i xats de crew",
checkingUpdates: "Buscant actualitzacions…", checkingUpdates: "Buscant actualitzacions…",
checkingTrades: "Buscant ofertes i intercanvis…", checkingTrades: "Buscant ofertes i intercanvis…",
loadingDrops: "Carregant les últimes novetats…", loadingDrops: "Carregant les últimes novetats…",

View file

@ -93,7 +93,8 @@ const drift = {
"cordnGroupHint": "Volitelné: vlož odkaz na skupinu ze Staircase nebo Cordn web. Tvoje crew tak získá skutečný end-to-end MLS chat hostovaný na našem koordinátoru." "cordnGroupHint": "Volitelné: vlož odkaz na skupinu ze Staircase nebo Cordn web. Tvoje crew tak získá skutečný end-to-end MLS chat hostovaný na našem koordinátoru."
}, },
"bell": { "bell": {
"dmsUnread": "{{count}} nových šifrovaných zpráv" "dmsUnread": "{{count}} nových šifrovaných zpráv",
"messagesAndCrews": "Zprávy a crew chaty"
} }
}, },
"settingsUi": { "settingsUi": {

View file

@ -96,6 +96,7 @@ const drift = {
}, },
bell: { bell: {
dmsUnread: "{{count}} neue verschlüsselte Nachricht(en)", dmsUnread: "{{count}} neue verschlüsselte Nachricht(en)",
messagesAndCrews: "Nachrichten & Crew-Chats",
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -98,6 +98,7 @@ const drift = {
}, },
bell: { bell: {
dmsUnread: "{{count}} νέα κρυπτογραφημένα μηνύματα", dmsUnread: "{{count}} νέα κρυπτογραφημένα μηνύματα",
messagesAndCrews: "Μηνύματα & συνομιλίες crew",
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -3734,6 +3734,7 @@ socialUi: {
tabSocial: 'Social', tabSocial: 'Social',
tabNews: 'News', tabNews: 'News',
tabCrews: 'Crews', tabCrews: 'Crews',
messagesAndCrews: 'Messages & crew chats',
dmsUnread: '{{count}} new encrypted message(s)', dmsUnread: '{{count}} new encrypted message(s)',
checkingUpdates: 'Checking for updates…', checkingUpdates: 'Checking for updates…',
checkingTrades: 'Checking offers and trades…', checkingTrades: 'Checking offers and trades…',

View file

@ -3734,6 +3734,7 @@ socialUi: {
tabSocial: 'Social', tabSocial: 'Social',
tabNews: 'Noticias', tabNews: 'Noticias',
tabCrews: 'Peñas', tabCrews: 'Peñas',
messagesAndCrews: 'Mensajes y chats de crew',
dmsUnread: '{{count}} mensaje(s) cifrado(s) nuevo(s)', dmsUnread: '{{count}} mensaje(s) cifrado(s) nuevo(s)',
checkingUpdates: 'Buscando novedades…', checkingUpdates: 'Buscando novedades…',
checkingTrades: 'Revisando ofertas y tratos…', checkingTrades: 'Revisando ofertas y tratos…',

View file

@ -40,6 +40,7 @@ const batch2 = {
tabNews: "Berriak", tabNews: "Berriak",
tabCrews: "Koadrilak", tabCrews: "Koadrilak",
dmsUnread: "{{count}} mezu zifratu berri", dmsUnread: "{{count}} mezu zifratu berri",
messagesAndCrews: "Mezuak eta crew txatak",
checkingUpdates: "Eguneratzeak egiaztatzen…", checkingUpdates: "Eguneratzeak egiaztatzen…",
checkingTrades: "Eskaintzak eta trukeak egiaztatzen…", checkingTrades: "Eskaintzak eta trukeak egiaztatzen…",
loadingDrops: "Azken bidalketak kargatzen…", loadingDrops: "Azken bidalketak kargatzen…",

View file

@ -96,6 +96,7 @@ const drift = {
}, },
bell: { bell: {
dmsUnread: "{{count}} nouveau(x) message(s) chiffré(s)", dmsUnread: "{{count}} nouveau(x) message(s) chiffré(s)",
messagesAndCrews: "Messages et discussions de crew",
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -40,6 +40,7 @@ const batch2 = {
tabNews: "Novidades", tabNews: "Novidades",
tabCrews: "Crews", tabCrews: "Crews",
dmsUnread: "{{count}} mensaxe(s) cifrado(s) novo(s)", dmsUnread: "{{count}} mensaxe(s) cifrado(s) novo(s)",
messagesAndCrews: "Mensaxes e chats de crew",
checkingUpdates: "Buscando actualizacións…", checkingUpdates: "Buscando actualizacións…",
checkingTrades: "Comprobando ofertas e intercambios…", checkingTrades: "Comprobando ofertas e intercambios…",
loadingDrops: "Cargando as últimas novidades…", loadingDrops: "Cargando as últimas novidades…",

View file

@ -40,6 +40,7 @@ const batch2 = {
"tabNews": "समाचार", "tabNews": "समाचार",
"tabCrews": "क्रू", "tabCrews": "क्रू",
"dmsUnread": "{{count}} नए एन्क्रिप्टेड संदेश", "dmsUnread": "{{count}} नए एन्क्रिप्टेड संदेश",
"messagesAndCrews": "संदेश और क्रू चैट",
"checkingUpdates": "अपडेट जाँच रहे हैं…", "checkingUpdates": "अपडेट जाँच रहे हैं…",
"checkingTrades": "ऑफ़र और ट्रेड जाँच रहे हैं…", "checkingTrades": "ऑफ़र और ट्रेड जाँच रहे हैं…",
"loadingDrops": "नए ड्रॉप लोड हो रहे हैं…", "loadingDrops": "नए ड्रॉप लोड हो रहे हैं…",

View file

@ -90,6 +90,7 @@ const driftStrings = {
}, },
bell: { bell: {
dmsUnread: '{{count}} pesan terenkripsi baru', dmsUnread: '{{count}} pesan terenkripsi baru',
messagesAndCrews: 'Pesan & obrolan kru',
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -96,6 +96,7 @@ const drift = {
}, },
bell: { bell: {
dmsUnread: "{{count}} nuovo/i messaggio/i cifrato/i", dmsUnread: "{{count}} nuovo/i messaggio/i cifrato/i",
messagesAndCrews: "Messaggi e chat delle crew",
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -106,6 +106,7 @@ const drift: Dict = {
}, },
bell: { bell: {
dmsUnread: '{{count}}件の新しい暗号化メッセージ', dmsUnread: '{{count}}件の新しい暗号化メッセージ',
messagesAndCrews: 'メッセージとクルーチャット',
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -106,6 +106,7 @@ const drift: Dict = {
}, },
bell: { bell: {
dmsUnread: '새 암호화 메시지 {{count}}개', dmsUnread: '새 암호화 메시지 {{count}}개',
messagesAndCrews: '메시지 및 크루 채팅',
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -93,7 +93,8 @@ const drift = {
"cordnGroupHint": "Optioneel: plak de grouplink van Staircase of Cordn web. Je crew krijgt dan echte end-to-end MLS-chat, gehost op onze coördinator." "cordnGroupHint": "Optioneel: plak de grouplink van Staircase of Cordn web. Je crew krijgt dan echte end-to-end MLS-chat, gehost op onze coördinator."
}, },
"bell": { "bell": {
"dmsUnread": "{{count}} nieuw(e) versleutelde bericht(en)" "dmsUnread": "{{count}} nieuw(e) versleutelde bericht(en)",
"messagesAndCrews": "Berichten & crewchats"
} }
}, },
"settingsUi": { "settingsUi": {

View file

@ -93,7 +93,8 @@ const drift = {
"cordnGroupHint": "Opcjonalnie: wklej link do grupy ze Staircase lub Cordn web. Twoje crew dostanie wtedy prawdziwy czat MLS end-to-end, hostowany na naszym koordynatorze." "cordnGroupHint": "Opcjonalnie: wklej link do grupy ze Staircase lub Cordn web. Twoje crew dostanie wtedy prawdziwy czat MLS end-to-end, hostowany na naszym koordynatorze."
}, },
"bell": { "bell": {
"dmsUnread": "{{count}} nowych zaszyfrowanych wiadomości" "dmsUnread": "{{count}} nowych zaszyfrowanych wiadomości",
"messagesAndCrews": "Wiadomości i czaty crew"
} }
}, },
"settingsUi": { "settingsUi": {

View file

@ -96,6 +96,7 @@ const drift = {
}, },
bell: { bell: {
dmsUnread: "{{count}} nova(s) mensagem(ns) criptografada(s)", dmsUnread: "{{count}} nova(s) mensagem(ns) criptografada(s)",
messagesAndCrews: "Mensagens e chats de crew",
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -93,7 +93,8 @@ const drift = {
"cordnGroupHint": "Opțional: lipește linkul grupului din Staircase sau Cordn web. Crew-ul tău primește atunci chat MLS real end-to-end, găzduit pe coordonatorul nostru." "cordnGroupHint": "Opțional: lipește linkul grupului din Staircase sau Cordn web. Crew-ul tău primește atunci chat MLS real end-to-end, găzduit pe coordonatorul nostru."
}, },
"bell": { "bell": {
"dmsUnread": "{{count}} mesaje criptate noi" "dmsUnread": "{{count}} mesaje criptate noi",
"messagesAndCrews": "Mesaje și chat-uri de crew"
} }
}, },
"settingsUi": { "settingsUi": {

View file

@ -98,6 +98,7 @@ const drift = {
}, },
bell: { bell: {
dmsUnread: "{{count}} новых зашифрованных сообщений", dmsUnread: "{{count}} новых зашифрованных сообщений",
messagesAndCrews: "Сообщения и чаты crew",
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -98,6 +98,7 @@ const drift = {
}, },
bell: { bell: {
dmsUnread: "{{count}} nya krypterade meddelanden", dmsUnread: "{{count}} nya krypterade meddelanden",
messagesAndCrews: "Meddelanden & crewchattar",
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -90,6 +90,7 @@ const driftStrings = {
}, },
bell: { bell: {
dmsUnread: 'ข้อความเข้ารหัสใหม่ {{count}} ข้อความ', dmsUnread: 'ข้อความเข้ารหัสใหม่ {{count}} ข้อความ',
messagesAndCrews: 'ข้อความและแชตของ crew',
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -90,6 +90,7 @@ const driftStrings = {
}, },
bell: { bell: {
dmsUnread: '{{count}} yeni şifreli mesaj', dmsUnread: '{{count}} yeni şifreli mesaj',
messagesAndCrews: 'Mesajlar ve Crew sohbetleri',
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -98,6 +98,7 @@ const drift = {
}, },
bell: { bell: {
dmsUnread: "{{count}} нових зашифрованих повідомлень", dmsUnread: "{{count}} нових зашифрованих повідомлень",
messagesAndCrews: "Повідомлення та чати crew",
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -90,6 +90,7 @@ const driftStrings = {
}, },
bell: { bell: {
dmsUnread: '{{count}} tin nhắn mã hóa mới', dmsUnread: '{{count}} tin nhắn mã hóa mới',
messagesAndCrews: 'Tin nhắn & trò chuyện crew',
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -106,6 +106,7 @@ const drift: Dict = {
}, },
bell: { bell: {
dmsUnread: '{{count}} 条新的加密消息', dmsUnread: '{{count}} 条新的加密消息',
messagesAndCrews: '消息和 Crew 聊天',
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -106,6 +106,7 @@ const drift: Dict = {
}, },
bell: { bell: {
dmsUnread: '{{count}} 則新的加密訊息', dmsUnread: '{{count}} 則新的加密訊息',
messagesAndCrews: '訊息和 Crew 聊天',
}, },
}, },
settingsUi: { settingsUi: {

View file

@ -1659,6 +1659,8 @@ export default function MapPage() {
<Button <Button
size="sm" size="sm"
variant="outline" variant="outline"
aria-label={t('mapUi.localChat')}
title={t('mapUi.localChat')}
className="md:hidden gap-1.5 border-2 border-purple-500/50 hover:bg-purple-500/10 text-purple-400 font-bold h-8 px-2 flex-shrink-0" className="md:hidden gap-1.5 border-2 border-purple-500/50 hover:bg-purple-500/10 text-purple-400 font-bold h-8 px-2 flex-shrink-0"
> >
<MessageCircle className="h-4 w-4" /> <MessageCircle className="h-4 w-4" />