feat: improve GitHub picker dialogs layout and mobile cleanup fixes #336 (#338)

packages/ui/src/components/session/GitHubIssuePickerDialog.tsx

@@ -587,7 +587,7 @@ Do not implement changes until I confirm; end with: “Next actions: <1 sentence
 
         <div className="mt-4 p-3 bg-muted/30 rounded-lg">
           <p className="typography-meta text-muted-foreground font-medium mb-2">Actions</p>
-          <div className="flex items-center gap-2">
+          <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:gap-2">
             <div
               className="flex items-center gap-2 cursor-pointer"
               role="button"
@@ -618,9 +618,10 @@ Do not implement changes until I confirm; end with: “Next actions: <1 sentence
                 )}
               </button>
               <span className="typography-meta text-muted-foreground">Create in worktree</span>
-              <span className="typography-meta text-muted-foreground/70">(issue-&lt;number&gt;-&lt;slug&gt;)</span>
+              <span className="typography-meta text-muted-foreground/70 hidden sm:inline">(issue-&lt;number&gt;-&lt;slug&gt;)</span>
             </div>
-            <div className="flex-1" />
+            <div className="hidden sm:block sm:flex-1" />
+            <div className="flex items-center gap-2">
               {repoUrl ? (
                 <Button variant="outline" size="sm" asChild>
                   <a href={repoUrl} target="_blank" rel="noopener noreferrer">
@@ -634,6 +635,7 @@ Do not implement changes until I confirm; end with: “Next actions: <1 sentence
               </Button>
             </div>
           </div>
+        </div>
       </DialogContent>
     </Dialog>
   );

packages/ui/src/components/session/GitHubPullRequestPickerDialog.tsx

@@ -743,7 +743,8 @@ Nice-to-have:
 
         <div className="mt-4 p-3 bg-muted/30 rounded-lg">
           <p className="typography-meta text-muted-foreground font-medium mb-2">Actions</p>
-          <div className="flex items-center gap-2">
+          <div className="flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-center sm:gap-x-4 sm:gap-y-2">
+            <div className="flex flex-col gap-2 sm:flex-row sm:gap-4">
               <div
                 className="flex items-center gap-2 cursor-pointer"
                 role="button"
@@ -773,10 +774,9 @@ Nice-to-have:
                     <RiCheckboxBlankLine className="h-4 w-4" />
                   )}
                 </button>
-              <span className="typography-meta text-muted-foreground">Create session in PR worktree</span>
+                <span className="typography-meta text-muted-foreground">Create in PR worktree</span>
               </div>
 
-
               <div
                 className="flex items-center gap-2 cursor-pointer"
                 role="button"
@@ -808,8 +808,10 @@ Nice-to-have:
                 </button>
                 <span className="typography-meta text-muted-foreground">Include full diff</span>
               </div>
+            </div>
 
-            <div className="flex-1" />
+            <div className="hidden sm:block sm:flex-1" />
+            <div className="flex items-center gap-2">
               {repoUrl ? (
                 <Button variant="outline" size="sm" asChild>
                   <a href={repoUrl} target="_blank" rel="noopener noreferrer">
@@ -823,6 +825,7 @@ Nice-to-have:
               </Button>
             </div>
           </div>
+        </div>
       </DialogContent>
     </Dialog>
   );

packages/ui/src/components/session/SessionSidebar.tsx

@@ -1800,20 +1800,12 @@ export const SessionSidebar: React.FC<SessionSidebarProps> = ({
                       if (projectKey !== activeProjectId) {
                         setActiveProject(projectKey);
                       }
-                      setActiveMainTab('chat');
-                      if (mobileVariant) {
-                        setSessionSwitcherOpen(false);
-                      }
                       setIssuePickerOpen(true);
                     }}
                     onNewSessionFromGitHubPR={() => {
                       if (projectKey !== activeProjectId) {
                         setActiveProject(projectKey);
                       }
-                      setActiveMainTab('chat');
-                      if (mobileVariant) {
-                        setSessionSwitcherOpen(false);
-                      }
                       setPullRequestPickerOpen(true);
                     }}
                     onOpenMultiRunLauncher={() => {
@@ -1870,12 +1862,24 @@ export const SessionSidebar: React.FC<SessionSidebarProps> = ({
 
       <GitHubIssuePickerDialog
         open={issuePickerOpen}
-        onOpenChange={setIssuePickerOpen}
+        onOpenChange={(open) => {
+          setIssuePickerOpen(open);
+          if (!open && mobileVariant) {
+            setActiveMainTab('chat');
+            setSessionSwitcherOpen(false);
+          }
+        }}
       />
 
       <GitHubPullRequestPickerDialog
         open={pullRequestPickerOpen}
-        onOpenChange={setPullRequestPickerOpen}
+        onOpenChange={(open) => {
+          setPullRequestPickerOpen(open);
+          if (!open && mobileVariant) {
+            setActiveMainTab('chat');
+            setSessionSwitcherOpen(false);
+          }
+        }}
       />
     </div>
   );