fitst commit

screens/announcements/ui/PaginationLite.tsx

@@ -0,0 +1,84 @@
+import { Ionicons } from '@expo/vector-icons';
+import React from 'react';
+import { Pressable, StyleSheet, Text, View } from 'react-native';
+
+export default function PaginationLite({ currentPage, totalPages, onChange }: any) {
+  const canGoPrev = currentPage > 1;
+  const canGoNext = currentPage < totalPages;
+
+  return (
+    <View style={paginationStyles.container}>
+      <Pressable
+        disabled={!canGoPrev}
+        onPress={() => onChange(currentPage - 1)}
+        style={[paginationStyles.btn, !canGoPrev && paginationStyles.btnDisabled]}
+      >
+        <Ionicons name="chevron-back" size={20} color={canGoPrev ? '#6366F1' : '#D1D5DB'} />
+      </Pressable>
+
+      <View style={paginationStyles.indicator}>
+        <Text style={paginationStyles.currentPage}>{currentPage}</Text>
+        <Text style={paginationStyles.separator}>/</Text>
+        <Text style={paginationStyles.totalPages}>{totalPages}</Text>
+      </View>
+
+      <Pressable
+        disabled={!canGoNext}
+        onPress={() => onChange(currentPage + 1)}
+        style={[paginationStyles.btn, !canGoNext && paginationStyles.btnDisabled]}
+      >
+        <Ionicons name="chevron-forward" size={20} color={canGoNext ? '#6366F1' : '#D1D5DB'} />
+      </Pressable>
+    </View>
+  );
+}
+
+const paginationStyles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center',
+    gap: 16,
+    paddingVertical: 20,
+    backgroundColor: '#fff',
+    borderTopWidth: 1,
+    borderTopColor: '#F0F2F8',
+  },
+  btn: {
+    width: 44,
+    height: 44,
+    borderRadius: 12,
+    backgroundColor: '#F9FAFB',
+    borderWidth: 1,
+    borderColor: '#E5E7EB',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  btnDisabled: {
+    backgroundColor: '#F3F4F6',
+    borderColor: '#E5E7EB',
+  },
+  indicator: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 8,
+    paddingHorizontal: 20,
+    paddingVertical: 10,
+    backgroundColor: '#EEF2FF',
+    borderRadius: 12,
+  },
+  currentPage: {
+    fontSize: 18,
+    fontWeight: '700',
+    color: '#6366F1',
+  },
+  separator: {
+    fontSize: 16,
+    color: '#9CA3AF',
+  },
+  totalPages: {
+    fontSize: 16,
+    fontWeight: '600',
+    color: '#6B7280',
+  },
+});