Merge pull request #3805 from prince0xdev/feat/mobile-navigation-improvement

Improve mobile navigation: clickable “online” badge & page title

src/app/(main)/websites/[websiteId]/WebsiteHeader.tsx

@@ -13,12 +13,19 @@ export function WebsiteHeader({ showActions }: { showActions?: boolean }) {
   const { renderUrl, pathname } = useNavigation();
   const isSettings = pathname.endsWith('/settings');
 
+  const { formatMessage, labels } = useMessages();
+
   if (isSettings) {
     return null;
   }
 
   return (
-    <PageHeader title={website.name} icon={<Favicon domain={website.domain} />} marginBottom="3">
+    <PageHeader
+      title={website.name}
+      icon={<Favicon domain={website.domain} />}
+      marginBottom="3"
+      titleHref={renderUrl(`/websites/${website.id}`, false)}
+    >
       <Row alignItems="center" gap="6" wrap="wrap">
         <ActiveUsers websiteId={website.id} />
 
@@ -29,7 +36,7 @@ export function WebsiteHeader({ showActions }: { showActions?: boolean }) {
               <Icon>
                 <Edit />
               </Icon>
-              <Text>Edit</Text>
+              <Text>{formatMessage(labels.edit)}</Text>
             </LinkButton>
           </Row>
         )}

src/components/common/PageHeader.tsx

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
 import { Heading, Icon, Row, Text, Column, Grid } from '@umami/react-zen';
+import { LinkButton } from './LinkButton';
 
 export function PageHeader({
   title,
@@ -7,6 +8,7 @@ export function PageHeader({
   label,
   icon,
   showBorder = true,
+  titleHref,
   children,
 }: {
   title: string;
@@ -14,6 +16,7 @@ export function PageHeader({
   label?: ReactNode;
   icon?: ReactNode;
   showBorder?: boolean;
+  titleHref?: string;
   allowEdit?: boolean;
   className?: string;
   children?: ReactNode;
@@ -33,7 +36,13 @@ export function PageHeader({
               {icon}
             </Icon>
           )}
-          {title && <Heading size={{ xs: '2', md: '3', lg: '4' }}>{title}</Heading>}
+          {title && titleHref ? (
+            <LinkButton href={titleHref} variant="quiet">
+              <Heading size={{ xs: '2', md: '3', lg: '4' }}>{title}</Heading>
+            </LinkButton>
+          ) : (
+            title && <Heading size={{ xs: '2', md: '3', lg: '4' }}>{title}</Heading>
+          )}
         </Row>
         {description && (
           <Text color="muted" truncate style={{ maxWidth: 600 }} title={description}>

src/components/metrics/ActiveUsers.tsx

@@ -1,6 +1,7 @@
 import { useMemo } from 'react';
 import { Text, StatusLight } from '@umami/react-zen';
 import { useMessages, useActyiveUsersQuery } from '@/components/hooks';
+import { LinkButton } from '@/components/common/LinkButton';
 
 export function ActiveUsers({
   websiteId,
@@ -27,10 +28,12 @@ export function ActiveUsers({
   }
 
   return (
-    <StatusLight variant="success">
-      <Text size="2" weight="medium">
-        {count} {formatMessage(labels.online)}
-      </Text>
-    </StatusLight>
+    <LinkButton href={`/websites/${websiteId}/realtime`} variant="quiet">
+      <StatusLight variant="success">
+        <Text size="2" weight="medium">
+          {count} {formatMessage(labels.online)}
+        </Text>
+      </StatusLight>
+    </LinkButton>
   );
 }

src/lang/ar-SA.json

@@ -289,6 +289,7 @@
   "label.websites": "المواقع",
   "label.window": "النافذة",
   "label.yesterday": "الأمس",
+  "label.behavior": "السلوك",
   "message.action-confirmation": "اكتب {confirmation} في المربع أدناه للتأكيد.",
   "message.active-users": "{x} حاليا {x, plural, one {زائر واحد} other {زوار}}",
   "message.bad-request": "Bad request",

src/lang/be-BY.json

@@ -20,6 +20,7 @@
   "label.average": "Сярэдняе",
   "label.back": "Назад",
   "label.before": "Да",
+  "label.behavior": "Паводзіны",
   "label.boards": "Дошкі",
   "label.bounce-rate": "Паказчык адмоваў",
   "label.breakdown": "Разбіўка",

src/lang/bg-BG.json

@@ -20,6 +20,7 @@
   "label.average": "Средно",
   "label.back": "Назад",
   "label.before": "Преди",
+  "label.behavior": "Поведение",
   "label.boards": "Дъски",
   "label.bounce-rate": "Kоефициент на отказ",
   "label.breakdown": "Разбивка",

src/lang/bn-BD.json

@@ -20,6 +20,7 @@
   "label.average": "গড়",
   "label.back": "পেছনে",
   "label.before": "পূর্বে",
+  "label.behavior": "আচরণ",
   "label.boards": "বোর্ডসমূহ",
   "label.bounce-rate": "উপরে উঠার হার",
   "label.breakdown": "ভাঙ্গন",

src/lang/bs-BA.json

@@ -20,6 +20,7 @@
   "label.average": "Prosjek",
   "label.back": "Nazad",
   "label.before": "Prije",
+  "label.behavior": "Ponašanje",
   "label.boards": "Ploče",
   "label.bounce-rate": "Stopa napuštanja",
   "label.breakdown": "Pregled po kategorijama",

src/lang/ca-ES.json

@@ -20,6 +20,7 @@
   "label.average": "Mitjana",
   "label.back": "Enrere",
   "label.before": "Abans",
+  "label.behavior": "Comportament",
   "label.boards": "Taulers",
   "label.bounce-rate": "Percentatge de rebot",
   "label.breakdown": "Desglossament",

src/lang/cs-CZ.json

@@ -20,6 +20,7 @@
   "label.average": "Průměr",
   "label.back": "Zpět",
   "label.before": "Před",
+  "label.behavior": "Chování",
   "label.boards": "Nástěnky",
   "label.bounce-rate": "Okamžité opuštění",
   "label.breakdown": "Rozpis",

src/lang/da-DK.json

@@ -20,6 +20,7 @@
   "label.average": "Gennemsnit",
   "label.back": "Tilbage",
   "label.before": "Før",
+  "label.behavior": "Adfærd",
   "label.boards": "Tavler",
   "label.bounce-rate": "Afvisningsprocent",
   "label.breakdown": "Opdeling",

src/lang/de-CH.json

@@ -20,6 +20,7 @@
   "label.average": "Durchschnitt",
   "label.back": "Zrugg",
   "label.before": "Vor",
+  "label.behavior": "Verhalte",
   "label.boards": "Boards",
   "label.bounce-rate": "Absprungsrate",
   "label.breakdown": "Uufschlüsselig",

src/lang/de-DE.json

@@ -20,6 +20,7 @@
   "label.average": "Durchschnitt",
   "label.back": "Zurück",
   "label.before": "Vor",
+  "label.behavior": "Verhalten",
   "label.boards": "Boards",
   "label.bounce-rate": "Absprungrate",
   "label.breakdown": "Aufschlüsselung",

src/lang/el-GR.json

@@ -23,6 +23,7 @@
   "label.boards": "Boards",
   "label.bounce-rate": "Ποσοστό αναπήδησης",
   "label.breakdown": "Breakdown",
+  "label.behavior": "Συμπεριφορά",
   "label.browser": "Browser",
   "label.browsers": "Προγράμματα περιήγησης",
   "label.campaigns": "Campaigns",

src/lang/en-GB.json

@@ -20,6 +20,7 @@
   "label.average": "Average",
   "label.back": "Back",
   "label.before": "Before",
+  "label.behavior": "Behavior",
   "label.boards": "Boards",
   "label.bounce-rate": "Bounce rate",
   "label.breakdown": "Breakdown",

src/lang/en-US.json

@@ -289,6 +289,7 @@
   "label.websites": "Websites",
   "label.window": "Window",
   "label.yesterday": "Yesterday",
+  "label.behavior": "Behavior",
   "message.action-confirmation": "Type {confirmation} in the box below to confirm.",
   "message.active-users": "{x} current {x, plural, one {visitor} other {visitors}}",
   "message.bad-request": "Bad request",

src/lang/es-ES.json

@@ -290,6 +290,7 @@
   "label.websites": "Sitios web",
   "label.window": "Ventana",
   "label.yesterday": "Ayer",
+  "label.behavior": "Comportamiento",
   "message.action-confirmation": "Escriba {confirmation} en el cuadro a continuación para confirmar.",
   "message.active-users": "{x} {x, plural, one {activo} other {activos}}",
   "message.bad-request": "Bad request",

src/lang/fa-IR.json

@@ -20,6 +20,7 @@
   "label.average": "میانگین",
   "label.back": "بازگشت",
   "label.before": "قبل از",
+  "label.behavior": "رفتار",
   "label.boards": "بردها",
   "label.bounce-rate": "نرخ ریزش",
   "label.breakdown": "تفکیک",

src/lang/fi-FI.json

@@ -289,6 +289,7 @@
   "label.websites": "Verkkosivut",
   "label.window": "Window",
   "label.yesterday": "Yesterday",
+  "label.behavior": "Behavior",
   "message.action-confirmation": "Type {confirmation} in the box below to confirm.",
   "message.active-users": "{x} {x, plural, one {vierailija} other {vierailijaa}}",
   "message.bad-request": "Bad request",

src/lang/fo-FO.json

@@ -20,6 +20,7 @@
   "label.average": "Miðal",
   "label.back": "Aftur",
   "label.before": "Áðrenn",
+  "label.behavior": "Atferð",
   "label.boards": "Borð",
   "label.bounce-rate": "Bounce prosenttal",
   "label.breakdown": "Sundurgreining",

src/lang/fr-FR.json

@@ -289,6 +289,9 @@
   "label.websites": "Sites",
   "label.window": "Fenêtre",
   "label.yesterday": "Hier",
+  "label.behavior": "Comportement",
+  "label.traffic": "Trafic",
+  "label.segments": "Segments",
   "message.action-confirmation": "Taper {confirmation} ci-dessous pour confirmer.",
   "message.active-users": "{x} {x, plural, one {visiteur} other {visiteurs}} actuellement",
   "message.bad-request": "Bad request",
@@ -315,13 +318,13 @@
   "message.no-teams": "Vous n'avez pas créé d'équipe.",
   "message.no-users": "Aucun utilisateur.",
   "message.no-websites-configured": "Vous n'avez pas configuré de site.",
-  "message.not-found": "Not found",
-  "message.nothing-selected": "Nothing selected.",
+  "message.not-found": "Non trouvé!",
+  "message.nothing-selected": "Rien n'est sélectionné.",
   "message.page-not-found": "Page non trouvée.",
   "message.reset-website": "Pour réinitialiser ce site, taper {confirmation} ci-dessous pour confirmer.",
   "message.reset-website-warning": "Toutes les statistiques pour ce site seront supprimées, mais votre code de suivi restera intact.",
   "message.saved": "Enregistré.",
-  "message.sever-error": "Server error",
+  "message.sever-error": "Erreur serveur",
   "message.share-url": "Les statistiques de votre site sont accessibles publiquement sur cette URL :",
   "message.team-already-member": "Vous êtes déjà membre de cette équipe.",
   "message.team-not-found": "Équipe non trouvée.",
@@ -331,7 +334,7 @@
   "message.transfer-user-website-to-team": "Choisir l'équipe à laquelle transférer ce site.",
   "message.transfer-website": "Transférer la propriété du site sur votre compte ou à une autre équipe.",
   "message.triggered-event": "Évènement déclenché",
-  "message.unauthorized": "Unauthorized",
+  "message.unauthorized": "Non authorisé!",
   "message.user-deleted": "Utilisateur supprimé.",
   "message.viewed-page": "Page vue",
   "message.visitor-log": "Visiteur de {country} utilisant {browser} sur {os} {device}"

src/lang/ga-ES.json

@@ -289,6 +289,7 @@
   "label.websites": "Sitios web",
   "label.window": "Ventá",
   "label.yesterday": "Onte",
+  "label.behavior": "Comportamento",
   "message.action-confirmation": "Escribe {confirmation} na caixa de embaixo para confirmar.",
   "message.active-users": "{x} actual {x, plural, one {visitante} other {visitantes}}",
   "message.bad-request": "Bad request",

src/lang/he-IL.json

@@ -278,6 +278,7 @@
   "label.value": "Value",
   "label.view": "View",
   "label.view-details": "פרטים נוספים",
+  "label.behavior": "התנהגות",
   "label.view-only": "View only",
   "label.views": "צפיות",
   "label.views-per-visit": "Views per visit",

src/lang/hi-IN.json

@@ -20,6 +20,7 @@
   "label.average": "औसत",
   "label.back": "पीछे",
   "label.before": "पहले",
+  "label.behavior": "व्यवहार",
   "label.boards": "बोर्ड्स",
   "label.bounce-rate": "उछाल दर",
   "label.breakdown": "विभाजन",

src/lang/hr-HR.json

@@ -20,6 +20,7 @@
   "label.average": "Prosjek",
   "label.back": "Natrag ",
   "label.before": "Prije",
+  "label.behavior": "Ponašanje",
   "label.boards": "Ploče",
   "label.bounce-rate": "Stopa napuštanja",
   "label.breakdown": "Raspad",

src/lang/hu-HU.json

@@ -20,6 +20,7 @@
   "label.average": "Átlag",
   "label.back": "Vissza",
   "label.before": "Előtt",
+  "label.behavior": "Viselkedés",
   "label.boards": "Táblák",
   "label.bounce-rate": "Visszafordulási arány",
   "label.breakdown": "Bontás",

src/lang/id-ID.json

@@ -20,6 +20,7 @@
   "label.average": "Rata-rata",
   "label.back": "Kembali",
   "label.before": "Sebelum",
+  "label.behavior": "Perilaku",
   "label.boards": "Papan",
   "label.bounce-rate": "Rasio pentalan",
   "label.breakdown": "Rincian",

src/lang/it-IT.json

@@ -20,6 +20,7 @@
   "label.average": "Media",
   "label.back": "Indietro",
   "label.before": "Prima",
+  "label.behavior": "Comportamento",
   "label.boards": "Bacheche",
   "label.bounce-rate": "Frequenza di rimbalzo",
   "label.breakdown": "Dettaglio",

src/lang/ja-JP.json

@@ -20,6 +20,7 @@
   "label.average": "平均",
   "label.back": "戻る",
   "label.before": "直前",
+  "label.behavior": "行動",
   "label.boards": "ボード",
   "label.bounce-rate": "直帰率",
   "label.breakdown": "故障",

src/lang/km-KH.json

@@ -20,6 +20,7 @@
   "label.average": "ជាមធ្យម",
   "label.back": "ថយក្រោយ",
   "label.before": "មុន",
+  "label.behavior": "អាកប្បកិរិយា",
   "label.boards": "ក្តារ",
   "label.bounce-rate": "ចំនួនវិលត្រឡប់",
   "label.breakdown": "បំបែកលម្អិត",

src/lang/ko-KR.json

@@ -20,6 +20,7 @@
   "label.average": "평균",
   "label.back": "뒤로",
   "label.before": "이전",
+  "label.behavior": "행동",
   "label.boards": "보드",
   "label.bounce-rate": "이탈률",
   "label.breakdown": "세부 사항",

src/lang/lt-LT.json

@@ -20,6 +20,7 @@
   "label.average": "Vidurkis",
   "label.back": "Atgal",
   "label.before": "Prieš",
+  "label.behavior": "Elgsena",
   "label.boards": "Lentos",
   "label.bounce-rate": "Atmetimo rodiklis",
   "label.breakdown": "Išskaidymas",

src/lang/mn-MN.json

@@ -20,6 +20,7 @@
   "label.average": "Дундаж",
   "label.back": "Буцах",
   "label.before": "Өмнө",
+  "label.behavior": "Зан төлөв",
   "label.boards": "Самбарууд",
   "label.bounce-rate": "Нэг хуудас үзээд гарсан",
   "label.breakdown": "Задаргаа",

src/lang/ms-MY.json

@@ -20,6 +20,7 @@
   "label.average": "Average",
   "label.back": "Kembali",
   "label.before": "Before",
+  "label.behavior": "Behavior",
   "label.boards": "Boards",
   "label.bounce-rate": "Kadar lantunan",
   "label.breakdown": "Breakdown",

src/lang/my-MM.json

@@ -20,6 +20,7 @@
   "label.average": "ပျမ်းမျှ",
   "label.back": "နောက်သို့",
   "label.before": "မတိုင်မီ",
+  "label.behavior": "အပြုအမူ",
   "label.boards": "Boards",
   "label.bounce-rate": "Bounce နှုန်း",
   "label.breakdown": "ခွဲခြမ်းစိတ်ဖြာမှု",

src/lang/nb-NO.json

@@ -20,6 +20,7 @@
   "label.average": "Gjennomsnnitt",
   "label.back": "Tilbake",
   "label.before": "Før",
+  "label.behavior": "Atferd",
   "label.boards": "Tavler",
   "label.bounce-rate": "Avvisningsfrekvens",
   "label.breakdown": "Nedbrytning",

src/lang/nl-NL.json

@@ -20,6 +20,7 @@
   "label.average": "Gemiddelde",
   "label.back": "Terug",
   "label.before": "Voor",
+  "label.behavior": "Gedrag",
   "label.boards": "Borden",
   "label.bounce-rate": "Bouncepercentage",
   "label.breakdown": "Opsplitsen",

src/lang/pl-PL.json

@@ -20,6 +20,7 @@
   "label.average": "Średnia",
   "label.back": "Powrót",
   "label.before": "Przed",
+  "label.behavior": "Zachowanie",
   "label.boards": "Tablice",
   "label.bounce-rate": "Współczynnik odrzuceń",
   "label.breakdown": "Rozbicie",

src/lang/pt-BR.json

@@ -20,6 +20,7 @@
   "label.average": "Média",
   "label.back": "Voltar",
   "label.before": "Antes",
+  "label.behavior": "Comportamento",
   "label.boards": "Quadros",
   "label.bounce-rate": "Taxa de rejeição",
   "label.breakdown": "Detalhamento",

src/lang/pt-PT.json

@@ -20,6 +20,7 @@
   "label.average": "Média",
   "label.back": "Voltar",
   "label.before": "Antes",
+  "label.behavior": "Comportamento",
   "label.boards": "Quadros",
   "label.bounce-rate": "Taxa de rejeição",
   "label.breakdown": "Detalhamento",

src/lang/ro-RO.json

@@ -20,6 +20,7 @@
   "label.average": "Mediu",
   "label.back": "Înapoi",
   "label.before": "Înainte",
+  "label.behavior": "Comportament",
   "label.boards": "Panouri",
   "label.bounce-rate": "Rata de respingere",
   "label.breakdown": "Detaliat",

src/lang/ru-RU.json

@@ -20,6 +20,7 @@
   "label.average": "Средний",
   "label.back": "Назад",
   "label.before": "До",
+  "label.behavior": "Поведение",
   "label.boards": "Доски",
   "label.bounce-rate": "Отказы",
   "label.breakdown": "Авария",

src/lang/si-LK.json

@@ -20,6 +20,7 @@
   "label.average": "Average",
   "label.back": "ආපසු",
   "label.before": "Before",
+  "label.behavior": "අචරණය",
   "label.boards": "Boards",
   "label.bounce-rate": "Bounce rate",
   "label.breakdown": "Breakdown",

src/lang/sk-SK.json

@@ -20,6 +20,7 @@
   "label.average": "Priemer",
   "label.back": "Späť",
   "label.before": "Pred",
+  "label.behavior": "Správanie",
   "label.boards": "Tabule",
   "label.bounce-rate": "Okamžité opustenie",
   "label.breakdown": "Rozpis",

src/lang/sl-SI.json

@@ -20,6 +20,7 @@
   "label.average": "Povprečno",
   "label.back": "Nazaj",
   "label.before": "Pred",
+  "label.behavior": "Obnašanje",
   "label.boards": "Table",
   "label.bounce-rate": "Odbojna stopnja",
   "label.breakdown": "Razčlenitev",

src/lang/sv-SE.json

@@ -20,6 +20,7 @@
   "label.average": "Genomsnitt",
   "label.back": "Tillbaka",
   "label.before": "Före",
+  "label.behavior": "Beteende",
   "label.boards": "Anslagstavlor",
   "label.bounce-rate": "Avvisningsfrekvens",
   "label.breakdown": "Analys",

src/lang/ta-IN.json

@@ -21,6 +21,7 @@
   "label.back": "பின்னால்",
   "label.before": "Before",
   "label.boards": "Boards",
+  "label.behavior": "நடத்தை",
   "label.bounce-rate": "துள்ளல் விகிதம்",
   "label.breakdown": "Breakdown",
   "label.browser": "Browser",

src/lang/th-TH.json

@@ -20,6 +20,7 @@
   "label.average": "Average",
   "label.back": "ย้อนกลับ",
   "label.before": "Before",
+  "label.behavior": "พฤติกรรม",
   "label.boards": "Boards",
   "label.bounce-rate": "อัตราตีกลับ",
   "label.breakdown": "Breakdown",

src/lang/tr-TR.json

@@ -20,6 +20,7 @@
   "label.average": "Ortalama",
   "label.back": "Geri",
   "label.before": "Önce",
+  "label.behavior": "Davranış",
   "label.boards": "Panolar",
   "label.bounce-rate": "Tek sayfa ziyaret oranı",
   "label.breakdown": "Dağılım",

src/lang/uk-UA.json

@@ -20,6 +20,7 @@
   "label.average": "Середній",
   "label.back": "Назад",
   "label.before": "До",
+  "label.behavior": "Поведінка",
   "label.boards": "Дошки",
   "label.bounce-rate": "Показник відмов",
   "label.breakdown": "Розподіл",

src/lang/ur-PK.json

@@ -20,6 +20,7 @@
   "label.average": "Average",
   "label.back": "پیچھے",
   "label.before": "Before",
+  "label.behavior": "رویے",
   "label.boards": "Boards",
   "label.bounce-rate": "اچھال کی شرح",
   "label.breakdown": "Breakdown",

src/lang/uz-UZ.json

@@ -15,6 +15,7 @@
   "label.average": "Oʻrtacha",
   "label.back": "Orqaga",
   "label.before": "Oldin",
+  "label.behavior": "Xulq-atvor",
   "label.bounce-rate": "Chiqib ketish darajasi",
   "label.breakdown": "Tahlil",
   "label.browser": "Brauzer",

src/lang/vi-VN.json

@@ -15,6 +15,7 @@
   "label.average": "Trung bình",
   "label.back": "Quay lại",
   "label.before": "Trước đó",
+  "label.behavior": "Hành vi",
   "label.bounce-rate": "Tỷ lệ thoát trang",
   "label.breakdown": "Phân tích chi tiết",
   "label.browser": "Trình duyệt",

src/lang/zh-CN.json

@@ -20,6 +20,7 @@
   "label.average": "平均",
   "label.back": "返回",
   "label.before": "之前",
+  "label.behavior": "行为",
   "label.boards": "看板",
   "label.bounce-rate": "跳出率",
   "label.breakdown": "故障",

src/lang/zh-TW.json

@@ -20,6 +20,7 @@
   "label.average": "平均",
   "label.back": "返回",
   "label.before": "之前",
+  "label.behavior": "行為",
   "label.boards": "看板",
   "label.bounce-rate": "跳出率",
   "label.breakdown": "細項分析",