feat: add group

frontend/pages/terminal/new-session-page.tsx

@@ -0,0 +1,40 @@
+import { View, Text } from "react-native";
+import React from "react";
+import HostList from "../hosts/components/host-list";
+import { useQueryParams } from "@/hooks/useQueryParams";
+import { BackButton } from "@/components/ui/button";
+import { XStack } from "tamagui";
+
+type Params = {
+  parentId?: string | null;
+};
+
+const NewSessionPage = () => {
+  const queryParams = useQueryParams<Params>();
+  const parentId = queryParams.params?.parentId;
+
+  const setParentId = (id: string | null) => {
+    queryParams.push({ parentId: id || "" });
+  };
+
+  const onGoBack = () => {
+    if (!queryParams.goBack()) {
+      queryParams.replace({ parentId: "" });
+    }
+  };
+
+  return (
+    <>
+      <XStack alignItems="center" h="$6">
+        {parentId ? <BackButton onPress={onGoBack} /> : null}
+      </XStack>
+      <HostList
+        allowEdit={false}
+        parentId={parentId}
+        onParentIdChange={setParentId}
+      />
+    </>
+  );
+};
+
+export default NewSessionPage;

frontend/pages/terminal/page.tsx

@@ -4,11 +4,11 @@ import PagerView, { PagerViewRef } from "@/components/ui/pager-view";
 import { useTermSession } from "@/stores/terminal-sessions";
 import { Button, useMedia } from "tamagui";
 import SessionTabs from "./components/session-tabs";
-import HostList from "../hosts/components/host-list";
 import Drawer from "expo-router/drawer";
 import { router } from "expo-router";
 import Icons from "@/components/ui/icons";
 import { useDebounceCallback } from "@/hooks/useDebounce";
+import NewSessionPage from "./new-session-page";
 
 const TerminalPage = () => {
   const pagerViewRef = useRef<PagerViewRef>(null!);
@@ -58,7 +58,7 @@ const TerminalPage = () => {
       />
 
       {sessions.length > 0 && media.gtSm ? <SessionTabs /> : null}
-      {!sessions.length ? <HostList allowEdit={false} /> : pagerView}
+      {!sessions.length ? <NewSessionPage /> : pagerView}
     </>
   );
 };