chore: Update ADS button min width (#37338)

## Description

Sets the min width of an ADS button (expect icon buttons) to be 60px


Fixes #`Issue Number`  
_or_  
Fixes `Issue URL`
> [!WARNING]  
> _If no issue exists, please create an issue first, and check with the
maintainers if the issue is valid._

## Automation

/ok-to-test tags="@tag.All"

### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!CAUTION]
> 🔴 🔴 🔴 Some tests have failed.
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/11809774671>
> Commit: 224483d356083468d27acc5bb6a3d2b059ba8146
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=11809774671&attempt=1&selectiontype=test&testsstatus=failed&specsstatus=fail"
target="_blank">Cypress dashboard</a>.
> Tags: @tag.All
> Spec: 
> The following are new failures, please fix them before merging the PR:
<ol>
>
<li>cypress/e2e/Regression/ClientSide/Widgets/ListV2/Childwigets/List_Inputs_spec.js</ol>
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/identified-flaky-tests-65890b3c81d7400d08fa9ee3?branch=master"
target="_blank">List of identified flaky tests</a>.
> <hr>Wed, 13 Nov 2024 04:12:40 UTC
<!-- end of auto-generated comment: Cypress test results  -->


## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [ ] No


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Enhanced button styles to include minimum width constraints: 60 pixels
for small buttons and 80 pixels for medium buttons, improving layout
consistency for non-icon buttons.
- Introduced a new property `isIconButton` in the `Button` component to
adjust button presentation.
- Added functionality to refresh the workspace list immediately after
creating a new workspace.
- Implemented improved error handling by checking for `workspace.id`
before rendering workspace items.
- Added a new state variable to manage the visibility of the import
application modal.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
Hetu Nandu 2024-11-13 12:45:26 +05:30 committed by GitHub
parent 81c6a1ea8d
commit df7521e93a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 0 deletions

View File

@ -29,6 +29,7 @@ const getSizes = (size: ButtonSizes, isIconButton?: boolean) => {
? "var(--ads-v2-spaces-2)"
: "var(--ads-v2-spaces-2) var(--ads-v2-spaces-3)"};
--button-gap: var(--ads-v2-spaces-2);
--button-min-width: 60px;
`,
md: css`
--button-font-weight: 600;
@ -37,6 +38,7 @@ const getSizes = (size: ButtonSizes, isIconButton?: boolean) => {
? "var(--ads-v2-spaces-3)"
: "var(--ads-v2-spaces-3) var(--ads-v2-spaces-4)"};
--button-gap: var(--ads-v2-spaces-3);
--button-min-width: 80px;
`,
};
@ -175,6 +177,8 @@ export const ButtonContent = styled.div<{
box-sizing: border-box;
padding: var(--button-padding);
border-radius: inherit;
min-width: ${({ isIconButton }) =>
isIconButton ? "unset" : "var(--button-min-width)"};
& > .${ButtonContentChildrenClassName} {
display: flex;

View File

@ -318,6 +318,7 @@ export function LeftPaneSection(props: {
<Button
data-testid="t--workspace-new-workspace-auto-create"
isDisabled={props.isFetchingWorkspaces}
isIconButton
kind="tertiary"
onClick={createNewWorkspace}
startIcon="add-line"