diff --git a/bun.lock b/bun.lock index ce7565c..3c27ac0 100644 --- a/bun.lock +++ b/bun.lock @@ -9,7 +9,6 @@ "@tanstack/react-router": "^1.120.3", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", - "konsta": "^5.0.7", "lucide-react": "^0.575.0", "radix-ui": "^1.4.3", "react": "^19.1.0", @@ -1183,8 +1182,6 @@ "kleur": ["kleur@4.1.5", "", {}, "sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ=="], - "konsta": ["konsta@5.0.7", "", { "dependencies": { "tailwind-merge": "^3.3.1" } }, "sha512-4bc+5UmPkMTqbF9UndwF46oEePV/vADGdutVfRGo18n8lql2kv+K32Gi8xkFMuo6R8fCw016wVGUpRskkpnzmA=="], - "leven": ["leven@3.1.0", "", {}, "sha512-qsda+H8jTaUaN/x5vzW2rzc+8Rw4TAQ/4KjB46IwK5VH+IlVeeeje/EoZRpiXvIqjFgK84QffqPztGI3VBLG1A=="], "lightningcss": ["lightningcss@1.31.1", "", { "dependencies": { "detect-libc": "^2.0.3" }, "optionalDependencies": { "lightningcss-android-arm64": "1.31.1", "lightningcss-darwin-arm64": "1.31.1", "lightningcss-darwin-x64": "1.31.1", "lightningcss-freebsd-x64": "1.31.1", "lightningcss-linux-arm-gnueabihf": "1.31.1", "lightningcss-linux-arm64-gnu": "1.31.1", "lightningcss-linux-arm64-musl": "1.31.1", "lightningcss-linux-x64-gnu": "1.31.1", "lightningcss-linux-x64-musl": "1.31.1", "lightningcss-win32-arm64-msvc": "1.31.1", "lightningcss-win32-x64-msvc": "1.31.1" } }, "sha512-l51N2r93WmGUye3WuFoN5k10zyvrVs0qfKBhyC5ogUQ6Ew6JUSswh78mbSO+IU3nTWsyOArqPCcShdQSadghBQ=="], diff --git a/package.json b/package.json index c098ec8..bbc045c 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,6 @@ "@tanstack/react-router": "^1.120.3", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", - "konsta": "^5.0.7", "lucide-react": "^0.575.0", "radix-ui": "^1.4.3", "react": "^19.1.0", diff --git a/src/app.css b/src/app.css index 93040a9..f9fc467 100644 --- a/src/app.css +++ b/src/app.css @@ -1,7 +1,6 @@ @import "tailwindcss"; @import "tw-animate-css"; @import "shadcn/tailwind.css"; -@import "konsta/react/theme.css"; @custom-variant dark (&:is(.dark *)); @@ -101,3 +100,11 @@ -webkit-font-smoothing: antialiased; } } + +.safe-area-top { + padding-top: env(safe-area-inset-top); +} + +.safe-area-bottom { + padding-bottom: env(safe-area-inset-bottom); +} diff --git a/src/features/feed/components/feed-empty.tsx b/src/features/feed/components/feed-empty.tsx index e557d8f..345b37d 100644 --- a/src/features/feed/components/feed-empty.tsx +++ b/src/features/feed/components/feed-empty.tsx @@ -1,12 +1,10 @@ -import { Block } from "konsta/react" - export function FeedEmpty() { return ( - +

Dein Feed ist leer

-

+

Folge Themen oder Abgeordneten, um Abstimmungen hier zu sehen.

- +
) } diff --git a/src/features/feed/components/feed-list.tsx b/src/features/feed/components/feed-list.tsx index eb5f931..5e02ec8 100644 --- a/src/features/feed/components/feed-list.tsx +++ b/src/features/feed/components/feed-list.tsx @@ -1,4 +1,3 @@ -import { BlockTitle, List } from "konsta/react" import { useMemo } from "react" import type { FeedItem } from "../lib/assemble-feed" import { FeedEmpty } from "./feed-empty" @@ -21,22 +20,26 @@ export function FeedList({ items }: { items: FeedItem[] }) {
{upcoming.length > 0 && (
- Anstehende Abstimmungen - +

+ Anstehende Abstimmungen +

+
{upcoming.map((item) => ( ))} - +
)} {past.length > 0 && (
- Vergangene Abstimmungen - +

+ Vergangene Abstimmungen +

+
{past.map((item) => ( ))} - +
)}
diff --git a/src/features/settings/components/notification-guide.tsx b/src/features/settings/components/notification-guide.tsx index 463e926..5bfe0ca 100644 --- a/src/features/settings/components/notification-guide.tsx +++ b/src/features/settings/components/notification-guide.tsx @@ -1,4 +1,4 @@ -import { Block, Button, Navbar, NavbarBackLink } from "konsta/react" +import { Button } from "@/shared/components/ui/button" interface NotificationGuideProps { onBack: () => void @@ -6,87 +6,104 @@ interface NotificationGuideProps { export function NotificationGuide({ onBack }: NotificationGuideProps) { return ( - <> - } /> +
+ - -

- Push-Benachrichtigungen funktionieren auf dem iPhone nur, wenn die App zum Homescreen hinzugefügt wurde. -

+

iPhone-Einrichtung

-
    -
  1. - - 1 - -
    -

    Teilen-Menü öffnen

    -

    - Tippe auf das Teilen-Symbol{" "} - {" "} - in der Safari-Leiste unten. -

    -
    -
    2. +

    + Push-Benachrichtigungen funktionieren auf dem iPhone nur, wenn die App zum Homescreen hinzugefügt wurde. +

    -
  2. - - 2 - -
    -

    Zum Home-Bildschirm

    -

    - Scrolle im Menü nach unten und wähle Zum Home-Bildschirm. -

    -
    -
    3. +
      +
    1. + + 1 + +
      +

      Teilen-Menü öffnen

      +

      + Tippe auf das Teilen-Symbol{" "} + {" "} + in der Safari-Leiste unten. +

      +
      +
      2. -
    2. - - 3 - -
      -

      App hinzufügen

      -

      - Bestätige mit Hinzufügen. Die App erscheint als Icon auf deinem - Homescreen. -

      -
      -
      3. +
    3. + + 2 + +
      +

      Zum Home-Bildschirm

      +

      + Scrolle im Menü nach unten und wähle Zum Home-Bildschirm. +

      +
      +
      4. -
    4. - - 4 - -
      -

      App öffnen & Benachrichtigungen aktivieren

      -

      - Öffne die App vom Homescreen aus und aktiviere die Benachrichtigungen in den Einstellungen. -

      -
      -
      5. -
    +
  3. + + 3 + +
    +

    App hinzufügen

    +

    + Bestätige mit Hinzufügen. Die App erscheint als Icon auf deinem + Homescreen. +

    +
    +
    4. -
    - -
    - - +
  4. + + 4 + +
    +

    App öffnen & Benachrichtigungen aktivieren

    +

    + Öffne die App vom Homescreen aus und aktiviere die Benachrichtigungen in den Einstellungen. +

    +
    +
    5. +
+ +
+ +
+
) } diff --git a/src/features/settings/components/settings-page.tsx b/src/features/settings/components/settings-page.tsx index 8a401bc..2d06d3b 100644 --- a/src/features/settings/components/settings-page.tsx +++ b/src/features/settings/components/settings-page.tsx @@ -1,3 +1,6 @@ +import { Button } from "@/shared/components/ui/button" +import { Card, CardContent } from "@/shared/components/ui/card" +import { Switch } from "@/shared/components/ui/switch" import { useDb } from "@/shared/db/provider" import { useDeviceId } from "@/shared/hooks/use-device-id" import { useFollows } from "@/shared/hooks/use-follows" @@ -5,7 +8,6 @@ import { usePush } from "@/shared/hooks/use-push" import { usePwaUpdate } from "@/shared/hooks/use-pwa-update" import { fetchTopics } from "@/shared/lib/aw-api" import { BACKEND_URL, VAPID_PUBLIC_KEY } from "@/shared/lib/constants" -import { BlockTitle, Button, List, ListItem, Navbar, Preloader, Toggle } from "konsta/react" import { useCallback, useEffect, useState } from "react" import { type GeoResult, clearGeoCache, detectFromCoords, loadCachedResult } from "../../location/lib/geo" import { NotificationGuide } from "./notification-guide" @@ -100,241 +102,280 @@ export function SettingsPage() { } return ( -
- - +
{/* --- Notifications --- */} {VAPID_PUBLIC_KEY && ( - <> - Benachrichtigungen - - {push.permission === "denied" ? ( - +
+

+ Benachrichtigungen +

+ + + {push.permission === "denied" ? ( +
+ Benachrichtigungen sind blockiert. Bitte in den Systemeinstellungen aktivieren. - } - /> - ) : ( - + ) : ( +
+ + Push-Benachrichtigungen + + { + aria-labelledby="push-label" + onCheckedChange={() => { if (push.subscribed) push.unsubscribe() else push.subscribe() }} /> - } - /> - )} - {!standalone && setShowGuide(true)} />} - - +
+ )} + {!standalone && ( + + )} + + +
)} {/* --- Location --- */} - Standort - {hasLocation && result.bundesland ? ( - - - {result.landtag_label && } - - {result.cachedAt && } - - ) : null} +
+

Standort

+ {hasLocation && result.bundesland ? ( + + +
+ Bundesland + {result.bundesland} +
+ {result.landtag_label && ( +
+ Landtag + {result.landtag_label} +
+ )} +
+ Abgeordnete geladen + {result.mandates.length} +
+ {result.cachedAt && ( +
+ Zwischengespeichert + {formatCacheAge(result.cachedAt)} +
+ )} + + + ) : null} - {loading && ( -
- - - {hasLocation ? "Aktualisiere…" : "Erkenne…"} - -
- )} - - {errorMsg && ( -
- {errorMsg} -
- )} - -
- {!hasLocation && !loading && ( - + {loading && ( +
+
+ {hasLocation ? "Aktualisiere…" : "Erkenne…"} +
)} - {hasLocation && ( - <> - - - + + {errorMsg && ( +
+ {errorMsg} +
)} -
+ +
+ {!hasLocation && !loading && ( + + )} + {hasLocation && ( + <> + + + + )} +
+
{/* --- App Update --- */} - App-Update - - {needRefresh ? ( - - Jetzt aktualisieren - - } - /> - ) : ( - - {checking ? "Prüfe…" : "Prüfen"} - - } - /> - )} - +
+

App-Update

+ + + {needRefresh ? ( +
+ Neue Version verfügbar + +
+ ) : ( +
+ App ist aktuell + +
+ )} + + +
{/* --- About --- */} - Info - - - abgeordnetenwatch.de - - } - /> - {deviceId}} - /> - +
+

Info

+ + +
+ Datenquelle + + abgeordnetenwatch.de + +
+
+ Geräte-ID + {deviceId} +
+ + +
{/* --- Developer --- */} - Entwickler - - - {devHealth && ( - {devHealth} - )} - +
+

Entwickler

+ + +
+ Backend Health +
+ {devHealth && ( + + {devHealth} + + )} + +
- } - /> - - {devPush && ( - {devPush} - )} - +
+ Test-Push +
+ {devPush && ( + + {devPush} + + )} + +
- } - /> - - {devTopics && {devTopics}} - +
+ Alle Themen folgen +
+ {devTopics && {devTopics}} + +
- } - /> - - {devPoliticians && {devPoliticians}} - +
+ Alle Abgeordnete folgen +
+ {devPoliticians && {devPoliticians}} + +
- } - /> - + + +
) }