BuzzbeeSCD/openchamber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): improve mobile layout for attachments, git & permissions (#218)

Browse Source 
* feat: improve file attachment chip layout and truncation

* style(chat): improve PermissionCard layout and sizing

* feat(CommitSection): add mobile-friendly commit & push with tooltip

* style: refine chat file attachments and permission controls

* feat: Add aria-label for Commit & Push button
This commit is contained in:
Nelson Pires
2026-01-26 01:43:11 +02:00
committed by GitHub
parent efe9ad27b7
commit 1de0ebd4fc
3 changed files with 78 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/views/git/CommitSection.tsx
+45 -17
View File
@@ -13,6 +13,8 @@ import { Button } from '@/components/ui/button';
import { ButtonLarge } from '@/components/ui/button-large';
import { CommitInput } from './CommitInput';
import { AIHighlightsBox } from './AIHighlightsBox';
import { useDeviceInfo } from '@/lib/device';
import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
type CommitAction = 'commit' | 'commitAndPush' | null;
@@ -51,6 +53,7 @@ export const CommitSection: React.FC<CommitSectionProps> = ({
}) => {
const hasSelectedFiles = selectedCount > 0;
const canCommit = commitMessage.trim() && hasSelectedFiles && commitAction === null;
const { isMobile } = useDeviceInfo();
return (
<Collapsible
@@ -122,6 +125,7 @@ export const CommitSection: React.FC<CommitSectionProps> = ({
variant="outline"
onClick={onCommit}
disabled={!canCommit || isGeneratingMessage}
className="whitespace-nowrap"
>
{commitAction === 'commit' ? (
<>
@@ -136,23 +140,47 @@ export const CommitSection: React.FC<CommitSectionProps> = ({
)}
</ButtonLarge>
<ButtonLarge
variant="default"
onClick={onCommitAndPush}
disabled={!canCommit || isGeneratingMessage}
>
{commitAction === 'commitAndPush' ? (
<>
<RiLoader4Line className="size-4 animate-spin" />
Pushing...
</>
) : (
<>
<RiArrowUpLine className="size-4" />
Commit &amp; Push
</>
)}
</ButtonLarge>
{isMobile ? (
<Tooltip>
<TooltipTrigger asChild>
<Button
variant="default"
size="sm"
onClick={onCommitAndPush}
disabled={!canCommit || isGeneratingMessage}
className="h-7 w-7 p-0"
aria-label="Commit & Push"
>
{commitAction === 'commitAndPush' ? (
<RiLoader4Line className="size-4 animate-spin" />
) : (
<RiArrowUpLine className="size-4" />
)}
</Button>
</TooltipTrigger>
<TooltipContent side="top">
<p>Commit & Push</p>
</TooltipContent>
</Tooltip>
) : (
<ButtonLarge
variant="default"
onClick={onCommitAndPush}
disabled={!canCommit || isGeneratingMessage}
>
{commitAction === 'commitAndPush' ? (
<>
<RiLoader4Line className="size-4 animate-spin" />
Pushing...
</>
) : (
<>
<RiArrowUpLine className="size-4" />
Commit &amp; Push
</>
)}
</ButtonLarge>
)}
</div>
</div>
</CollapsibleContent>