admin: fix useSearch

app/src/ui/routes/data/data.$entity.$id.tsx

@@ -257,15 +257,20 @@ function EntityDetailInner({
 }) {
    const other = relation.other(entity);
    const [navigate] = useNavigate();
-
-   const search = {
+   const [search, setSearch] = useState({
       select: other.entity.getSelect(undefined, "table"),
+      sort: other.entity.getDefaultSort(),
       limit: 10,
       offset: 0,
-   };
+   });
+
    // @todo: add custom key for invalidation
-   const $q = useApiQuery((api) =>
-      api.data.readManyByReference(entity.name, id, other.reference, search),
+   const $q = useApiQuery(
+      (api) => api.data.readManyByReference(entity.name, id, other.reference, search),
+      {
+         keepPreviousData: true,
+         revalidateOnFocus: true,
+      },
    );
 
    function handleClickRow(row: Record<string, any>) {
@@ -300,11 +305,17 @@ function EntityDetailInner({
             select={search.select}
             data={$q.data ?? null}
             entity={other.entity}
+            sort={search.sort}
             onClickRow={handleClickRow}
             onClickNew={handleClickNew}
-            page={1}
+            page={Math.floor(search.offset / search.limit) + 1}
             total={$q.data?.body?.meta?.count ?? 1}
-            /*onClickPage={handleClickPage}*/
+            onClickPage={(page) => {
+               setSearch((s) => ({
+                  ...s,
+                  offset: (page - 1) * s.limit,
+               }));
+            }}
          />
       </div>
    );

app/src/ui/routes/data/data.$entity.index.tsx

@@ -35,8 +35,19 @@ export function DataEntityList({ params }) {
    useBrowserTitle(["Data", entity?.label ?? params.entity]);
    const [navigate] = useNavigate();
    const search = useSearch(searchSchema, {
-      select: entity.getSelect(undefined, "table"),
-      sort: entity.getDefaultSort(),
+      defaultValue: {
+         select: entity.getSelect(undefined, "table"),
+         sort: entity.getDefaultSort(),
+      },
+      beforeEncode: (v) => {
+         if ("sort" in v && v.sort) {
+            return {
+               ...v,
+               sort: `${v.sort.dir === "asc" ? "" : "-"}${v.sort.by}`,
+            };
+         }
+         return v;
+      },
    });
 
    const $q = useApiQuery(