root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(FN-2396): align directory picker select button styling

Browse Source 
- Switch the DirectoryPicker Select action to shared btn btn-primary classes with explicit button type
- Move select-button padding to component-scoped DirectoryPicker.css tokens and remove hardcoded !important overrides
- Extend DirectoryPicker tests to assert the expected class contract before click behavior
This commit is contained in:
Fusion
2026-04-24 20:58:45 -07:00
committed by gsxdsm
parent 1d06305f57
commit 452d1c7a2f
3 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/dashboard/app/components/DirectoryPicker.css
View File

@@ -214,7 +214,5 @@
.directory-picker-select-btn { .directory-picker-select-btn {
flex-shrink: 0; flex-shrink: 0;
padding: 6px 16px !important; padding: var(--space-sm) var(--space-lg);
font-size: 13px !important;
} }

5
packages/dashboard/app/components/DirectoryPicker.tsx
View File

@@ -1,7 +1,7 @@
import "./DirectoryPicker.css";
import { useState, useCallback, useEffect } from "react"; import { useState, useCallback, useEffect } from "react";
import { Folder, FolderOpen, ChevronRight, ChevronUp, Loader2, Eye, EyeOff, AlertCircle } from "lucide-react"; import { Folder, FolderOpen, ChevronRight, ChevronUp, Loader2, Eye, EyeOff, AlertCircle } from "lucide-react";
import { browseDirectory, type BrowseDirectoryResult } from "../api"; import { browseDirectory, type BrowseDirectoryResult } from "../api";
import "./DirectoryPicker.css";
export interface DirectoryPickerProps { export interface DirectoryPickerProps {
value: string; value: string;
@@ -218,7 +218,8 @@ export function DirectoryPicker({ value, onChange, placeholder, onInputKeyDown,
{browser.currentPath} {browser.currentPath}
</span> </span>
<button <button
className="btn-primary directory-picker-select-btn" type="button"
className="btn btn-primary directory-picker-select-btn"
onClick={handleSelect} onClick={handleSelect}
> >
Select Select

7
packages/dashboard/app/components/__tests__/DirectoryPicker.test.tsx
View File

@@ -116,7 +116,12 @@ describe("DirectoryPicker", () => {
expect(screen.getByText("projects")).toBeDefined(); expect(screen.getByText("projects")).toBeDefined();
}); });
fireEvent.click(screen.getByText("Select")); const selectButton = screen.getByRole("button", { name: "Select" });
expect(selectButton.classList.contains("btn")).toBe(true);
expect(selectButton.classList.contains("btn-primary")).toBe(true);
expect(selectButton.classList.contains("directory-picker-select-btn")).toBe(true);
fireEvent.click(selectButton);
expect(onChange).toHaveBeenCalledWith("/home/user"); expect(onChange).toHaveBeenCalledWith("/home/user");
}); });