fitst commit

2026-01-28 18:26:50 +05:00
parent 166a55b1e9
commit 124798419b
196 changed files with 26627 additions and 421 deletions
--- a/screens/announcements/ui/EmptyState.tsx
+++ b/screens/announcements/ui/EmptyState.tsx
@@ -0,0 +1,136 @@
+import { useTheme } from '@/components/ThemeContext';
+import { Ionicons } from '@expo/vector-icons';
+import { LinearGradient } from 'expo-linear-gradient';
+import React from 'react';
+import { ActivityIndicator, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+
+type Props = {
+  title?: string;
+  description?: string;
+  onRefresh?: () => void;
+  isRefreshing?: boolean;
+};
+
+export default function EmptyState({
+  title = 'Maʼlumot topilmadi',
+  description = 'Hozircha hech qanday eʼlon mavjud emas',
+  onRefresh,
+  isRefreshing = false,
+}: Props) {
+  const { isDark } = useTheme();
+
+  const theme = {
+    gradientColors: isDark
+      ? (['#1e293b', '#334155'] as [string, string])
+      : (['#EEF2FF', '#E0E7FF'] as [string, string]),
+    iconColor: '#6366F1',
+    title: isDark ? '#f8fafc' : '#1F2937',
+    description: isDark ? '#94a3b8' : '#6B7280',
+    buttonBg: '#6366F1',
+    buttonText: '#ffffff',
+    dotColor: '#6366F1',
+  };
+
+  return (
+    <View style={emptyStyles.container}>
+      <LinearGradient colors={theme.gradientColors} style={emptyStyles.iconContainer}>
+        <Ionicons name="megaphone-outline" size={64} color={theme.iconColor} />
+      </LinearGradient>
+
+      <Text style={[emptyStyles.title, { color: theme.title }]}>{title}</Text>
+      <Text style={[emptyStyles.description, { color: theme.description }]}>{description}</Text>
+
+      {onRefresh && (
+        <TouchableOpacity
+          style={[emptyStyles.refreshBtn, { backgroundColor: theme.buttonBg }]}
+          onPress={onRefresh}
+          disabled={isRefreshing}
+          activeOpacity={0.8}
+        >
+          {isRefreshing ? (
+            <ActivityIndicator color={theme.buttonText} size="small" />
+          ) : (
+            <>
+              <Ionicons name="refresh" size={20} color={theme.buttonText} />
+              <Text style={[emptyStyles.refreshText, { color: theme.buttonText }]}>Yangilash</Text>
+            </>
+          )}
+        </TouchableOpacity>
+      )}
+
+      <View style={emptyStyles.decoration}>
+        <View style={[emptyStyles.dot, { backgroundColor: theme.dotColor }]} />
+        <View
+          style={[emptyStyles.dot, emptyStyles.dotMedium, { backgroundColor: theme.dotColor }]}
+        />
+        <View
+          style={[emptyStyles.dot, emptyStyles.dotSmall, { backgroundColor: theme.dotColor }]}
+        />
+      </View>
+    </View>
+  );
+}
+
+const emptyStyles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingHorizontal: 32,
+  },
+  iconContainer: {
+    width: 120,
+    height: 120,
+    borderRadius: 60,
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginBottom: 24,
+  },
+  title: {
+    fontSize: 20,
+    fontWeight: '700',
+    textAlign: 'center',
+    marginBottom: 8,
+  },
+  description: {
+    fontSize: 15,
+    textAlign: 'center',
+    lineHeight: 22,
+    marginBottom: 24,
+  },
+  refreshBtn: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 8,
+    paddingVertical: 12,
+    paddingHorizontal: 24,
+    borderRadius: 12,
+    shadowColor: '#6366F1',
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.3,
+    shadowRadius: 8,
+    elevation: 5,
+    minWidth: 140,
+    justifyContent: 'center',
+  },
+  refreshText: {
+    fontSize: 16,
+    fontWeight: '600',
+  },
+  decoration: {
+    flexDirection: 'row',
+    gap: 8,
+    marginTop: 32,
+  },
+  dot: {
+    width: 8,
+    height: 8,
+    borderRadius: 4,
+  },
+  dotMedium: {
+    opacity: 0.6,
+  },
+  dotSmall: {
+    opacity: 0.3,
+  },
+});