import { View } from "react-native";
import { useLocalSearchParams } from "expo-router";

import { AdminTodosTable } from "@/components/features/todos/AdminTodosTable";
import { useAppSelector } from "@/store/hooks";
import { selectIsMobile } from "@/store/screen/screenSizeSlice";

export const TodosPage = () => {
  const isMobile = useAppSelector(selectIsMobile);
  const params = useLocalSearchParams<{ q?: string }>();
  const initialSearchQuery = params.q ?? "";

  return (
    <View className="flex-1 bg-primaryPurpleLight">
      <View className={`${isMobile ? "p-1" : "p-5"} flex-1`}>
        <AdminTodosTable initialSearchQuery={initialSearchQuery} />
      </View>
    </View>
  );
};