display folders and files into

backend/internal/handler/files.go

@@ -242,3 +242,13 @@ func (h *FileHandler) CreateFolder(c *gin.Context) {
 
 	api.Success(c, folder)
 }
+
+func (h *FileHandler) ListFilesByParent(c *gin.Context) {
+	parentID := c.Param("id")
+	files, err := h.files.ListFilesByParentID(parentID)
+	if err != nil {
+		api.Error(c, http.StatusInternalServerError, "DB_ERROR", "Failed to list files in folder")
+		return
+	}
+	api.Success(c, files)
+}

backend/internal/handler/router.go

@@ -12,6 +12,7 @@ func SetupRoutes(r *gin.Engine, h *Handler) {
 	api.POST("/files/move", h.File.MoveFiles)
 	api.POST("/files/folders", h.File.CreateFolder)
 	api.GET("/files/folders", h.File.ListFolders)
+	api.GET("/files/folders/:id/files", h.File.ListFilesByParent)
 	api.GET("/files/download/:id", h.File.Download)
 	api.DELETE("/files/:id", h.File.Delete)
 	api.GET("/files/:id", h.File.Get)

mobile/app/folder.tsx

@@ -3,7 +3,7 @@ import { View, FlatList, StyleSheet, TouchableOpacity, Text, Dimensions, Alert }
 import { useRoute, useNavigation, RouteProp } from '@react-navigation/native';
 import { NativeStackNavigationProp } from '@react-navigation/native-stack';
 import { MaterialIcons } from '@expo/vector-icons';
-import { useFiles, useFileImage, useDeleteFile } from '../hooks/useFiles';
+import { useFilesByParent, useFileImage, useDeleteFile } from '../hooks/useFiles';
 import { FileItem, isFolder } from '../types';
 import { FileThumbnail } from '../components/FileThumbnail';
 
@@ -61,7 +61,7 @@ export function FolderScreen() {
   const route = useRoute<FolderRouteProp>();
   const navigation = useNavigation<NavigationProp>();
   const { folderId, folderName } = route.params;
-  const { data, isLoading, error } = useFiles();
+  const { data, isLoading, error } = useFilesByParent(folderId);
   const deleteFile = useDeleteFile();
   const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set());
 
@@ -72,9 +72,8 @@ export function FolderScreen() {
   }, [navigation, folderName]);
 
   const files = useMemo(() => {
-    const all = data?.data ?? [];
+    return data?.data ?? [];
-    return all.filter((f) => f.parentFileId === folderId);
+  }, [data]);
-  }, [data, folderId]);
 
   const fileIdToIndex = useMemo(() => {
     const map = new Map<string, number>();

mobile/hooks/useFiles.ts

@@ -70,3 +70,12 @@ export function useFolders() {
     queryFn: () => apiClient.get<{ data: FileItem[] }>(ENDPOINTS.FOLDERS),
   });
 }
+
+export function useFilesByParent(parentId: string) {
+  return useQuery({
+    queryKey: ['files', 'parent', parentId],
+    queryFn: () =>
+      apiClient.get<{ data: FileItem[] }>(`${ENDPOINTS.FOLDERS}/${parentId}/files`),
+    enabled: !!parentId,
+  });
+}