Tweak license flow

src-web/components/LicenseBadge.tsx

@@ -1,14 +1,18 @@
 import type { LicenseCheckStatus } from '@yaakapp-internal/license';
 import { useLicense } from '@yaakapp-internal/license';
 import { useOpenSettings } from '../hooks/useOpenSettings';
+import type { ButtonProps } from './core/Button';
 import { Button } from './core/Button';
 import { SettingsTab } from './Settings/Settings';
 
-const labels: Record<LicenseCheckStatus['type'], string | null> = {
+const details: Record<
+  LicenseCheckStatus['type'],
+  { label: string; color: ButtonProps['color'] } | null
+> = {
   commercial_use: null,
-  personal_use: 'Personal Use',
-  trial_ended: 'Personal Use',
-  trialing: 'Active Trial',
+  invalid_license: { label: 'Invalid License', color: 'danger' },
+  personal_use: { label: 'Personal Use', color: 'success' },
+  trialing: { label: 'Personal Use', color: 'success' },
 };
 
 export function LicenseBadge() {
@@ -19,8 +23,8 @@ export function LicenseBadge() {
     return null;
   }
 
-  const label = labels[check.data.type];
-  if (label == null) {
+  const detail = details[check.data.type];
+  if (detail == null) {
     return null;
   }
 
@@ -30,13 +34,9 @@ export function LicenseBadge() {
       variant="border"
       className="!rounded-full mx-1"
       onClick={() => openSettings.mutate()}
-      color={
-        check.data.type == 'trial_ended' || check.data.type === 'personal_use'
-          ? 'primary'
-          : 'success'
-      }
+      color={detail.color}
     >
-      {label}
+      {detail.label}
     </Button>
   );
 }