upload

2026-06-05 03:02:56 +00:00 · 2025-10-16 13:32:05 +02:00
commit 12cba639b9
663 changed files with 168914 additions and 0 deletions
@@ -0,0 +1,36 @@
+import { Box, Button, Heading, HStack, Image, Link as ChakraLink, Spinner, Stack, Text } from '@chakra-ui/react';
+import { useQuery } from '@tanstack/react-query';
+import { Link } from 'react-router-dom';
+import { getArticles } from '../services/articles';
+
+const ArticlesListPage: React.FC = () => {
+  const { data, isLoading, isError } = useQuery({
+    queryKey: ['articles', { page: 1, page_size: 20 }],
+    queryFn: () => getArticles({ page: 1, page_size: 20, published: true }),
+  });
+
+  if (isLoading) return <Spinner />;
+  if (isError) return <Text color="red.500">Chyba při načítání článků</Text>;
+
+  return (
+    <Stack spacing={6}>
+      <HStack justify="space-between">
+        <Heading size="lg">Články</Heading>
+        <Button as={Link} colorScheme="brand" to="/articles/create">Nový článek</Button>
+      </HStack>
+      <Stack spacing={4}>
+        {data?.data.map((a) => (
+          <HStack key={a.id} align="start" spacing={4} borderWidth="1px" borderRadius="md" p={4} bg="white">
+            <Image src={a.image_url || '/logo192.png'} alt={a.title} boxSize="100px" objectFit="cover" borderRadius="md" />
+            <Box>
+              <ChakraLink as={Link} to={`/articles/${a.id}`} fontWeight="bold" fontSize="lg">{a.title}</ChakraLink>
+              <Text noOfLines={3} mt={2}>{a.content}</Text>
+            </Box>
+          </HStack>
+        ))}
+      </Stack>
+    </Stack>
+  );
+};
+
+export default ArticlesListPage;