aboutsummaryrefslogtreecommitdiffstats
path: root/apps/mobile/app/dashboard/(tabs)/_layout.tsx
diff options
context:
space:
mode:
authorMohamed Bassem <me@mbassem.com>2025-11-23 12:22:34 +0000
committerGitHub <noreply@github.com>2025-11-23 12:22:34 +0000
commit8a5a109cdf14b6503b6bd07aa667788924a12fe6 (patch)
tree2d43fc8f3f9ba7f262e6a0135868194dc3b149a2 /apps/mobile/app/dashboard/(tabs)/_layout.tsx
parent7f555f574a0915c6302fb5ad7982a4529fe8a335 (diff)
downloadkarakeep-8a5a109cdf14b6503b6bd07aa667788924a12fe6.tar.zst
feat(mobile): Add highlights page to mobile app (#2156)
* feat: Add highlights page to mobile app This commit adds a new highlights page to the mobile app where users can view all their highlights with the following features: - HighlightCard component: Displays individual highlights with colored borders, text, optional notes, timestamps, and a link to the source bookmark - HighlightList component: Renders a scrollable list of highlights with pull-to-refresh and infinite scroll pagination - UpdatingHighlightList component: Handles data fetching using tRPC infinite queries with automatic cache invalidation - New /dashboard/highlights route with large header title - Added navigation link in Settings tab under "App Settings" All components follow the existing mobile app patterns and integrate with the existing highlights API. * make it a tab --------- Co-authored-by: Claude <noreply@anthropic.com>
Diffstat (limited to 'apps/mobile/app/dashboard/(tabs)/_layout.tsx')
-rw-r--r--apps/mobile/app/dashboard/(tabs)/_layout.tsx15
1 files changed, 14 insertions, 1 deletions
diff --git a/apps/mobile/app/dashboard/(tabs)/_layout.tsx b/apps/mobile/app/dashboard/(tabs)/_layout.tsx
index 316eddcf..5cc6aa92 100644
--- a/apps/mobile/app/dashboard/(tabs)/_layout.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/_layout.tsx
@@ -2,7 +2,13 @@ import React, { useLayoutEffect } from "react";
import { Tabs, useNavigation } from "expo-router";
import { StyledTabs } from "@/components/navigation/tabs";
import { useColorScheme } from "@/lib/useColorScheme";
-import { ClipboardList, Home, Settings, Tag } from "lucide-react-native";
+import {
+ ClipboardList,
+ Highlighter,
+ Home,
+ Settings,
+ Tag,
+} from "lucide-react-native";
export default function TabLayout() {
const { colors } = useColorScheme();
@@ -45,6 +51,13 @@ export default function TabLayout() {
}}
/>
<Tabs.Screen
+ name="highlights"
+ options={{
+ title: "Highlights",
+ tabBarIcon: ({ color }) => <Highlighter color={color} />,
+ }}
+ />
+ <Tabs.Screen
name="settings"
options={{
title: "Settings",