IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

grafana/ui: Add default type="button" to <Button> (#48183)

Browse Source
This commit is contained in:
Maria Alexandra 2022-05-04 18:36:14 +02:00 committed by GitHub
parent 2f1d404949
commit 6e530d45bc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
17 changed files with 65 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/grafana-ui/src/components/Button/Button.tsx
View File

@ -23,12 +23,26 @@ type CommonProps = {
className?: string;
children?: React.ReactNode;
fullWidth?: boolean;
type?: string;
};
export type ButtonProps = CommonProps & ButtonHTMLAttributes<HTMLButtonElement>;
export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
({ variant = 'primary', size = 'md', fill = 'solid', icon, fullWidth, children, className, ...otherProps }, ref) => {
(
{
variant = 'primary',
size = 'md',
fill = 'solid',
icon,
fullWidth,
children,
className,
type = 'button',
...otherProps
},
ref
) => {
const theme = useTheme2();
const styles = getButtonStyles({
theme,
@ -45,7 +59,7 @@ export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
);
return (
<button className={cx(styles.button, className)} {...otherProps} ref={ref}>
<button className={cx(styles.button, className)} type={type} {...otherProps} ref={ref}>
{icon && <Icon name={icon} size={size} className={styles.icon} />}
{children && <span className={styles.content}>{children}</span>}
</button>

2
public/app/core/components/ForgottenPassword/ForgottenPassword.tsx
View File

@ -59,7 +59,7 @@ export const ForgottenPassword: FC = () => {
/>
</Field>
<HorizontalGroup>
<Button>Send reset email</Button>
<Button type="submit">Send reset email</Button>
<LinkButton fill="text" href={loginHref}>
Back to login
</LinkButton>

7
public/app/core/components/Login/LoginForm.tsx
View File

@ -49,7 +49,12 @@ export const LoginForm: FC<Props> = ({ children, onSubmit, isLoggingIn, password
{...register('password', { required: 'Password is required' })}
/>
</Field>
<Button aria-label={selectors.pages.Login.submit} className={submitButton} disabled={isLoggingIn}>
<Button
type="submit"
aria-label={selectors.pages.Login.submit}
className={submitButton}
disabled={isLoggingIn}
>
{isLoggingIn ? 'Logging in...' : 'Log in'}
</Button>
{children}

6
public/app/core/components/SharedPreferences/SharedPreferences.tsx
View File

@ -207,7 +207,11 @@ export class SharedPreferences extends PureComponent<Props, State> {
</Field>
<div className="gf-form-button-row">
<Button variant="primary" data-testid={selectors.components.UserProfile.preferencesSaveButton}>
<Button
type="submit"
variant="primary"
data-testid={selectors.components.UserProfile.preferencesSaveButton}
>
<Trans id="common.save">Save</Trans>
</Button>
</div>

2
public/app/core/components/Signup/VerifyEmail.tsx
View File

@ -61,7 +61,7 @@ export const VerifyEmail: FC = () => {
/>
</Field>
<HorizontalGroup>
<Button>Send verification email</Button>
<Button type="submit">Send verification email</Button>
<LinkButton fill="text" href={getConfig().appSubUrl + '/login'}>
Back to login
</LinkButton>

4
public/app/features/admin/AdminEditOrgPage.tsx
View File

@ -85,7 +85,9 @@ export default function AdminEditOrgPage({ match }: Props) {
<Field label="Name" invalid={!!errors.orgName} error="Name is required" disabled={!canWriteOrg}>
<Input {...register('orgName', { required: true })} id="org-name-input" />
</Field>
<Button disabled={!canWriteOrg}>Update</Button>
<Button type="submit" disabled={!canWriteOrg}>
Update
</Button>
</>
)}
</Form>

4
public/app/features/admin/CrawlerStartButton.tsx
View File

@ -39,7 +39,9 @@ export const CrawlerStartButton = () => {
/>
</div>
<Modal.ButtonRow>
<Button onClick={doStart}>Start</Button>
<Button type="submit" onClick={doStart}>
Start
</Button>
<Button variant="secondary" onClick={onDismiss}>
Cancel
</Button>

4
public/app/features/alerting/unified/components/admin/AddAlertManagerModal.tsx
View File

@ -82,7 +82,9 @@ export const AddAlertManagerModal: FC<Props> = ({ alertmanagers, onChangeAlertma
)}
</FieldArray>
<div>
<Button onSubmit={() => onSubmit}>Add Alertmanagers</Button>
<Button type="submit" onSubmit={() => onSubmit}>
Add Alertmanagers
</Button>
</div>
</div>
)}

4
public/app/features/alerting/unified/components/receivers/ReceiversSection.tsx
View File

@ -33,7 +33,9 @@ export const ReceiversSection: FC<Props> = ({
</div>
{showButton && (
<Link to={addButtonTo}>
<Button icon="plus">{addButtonLabel}</Button>
<Button type="button" icon="plus">
{addButtonLabel}
</Button>
</Link>
)}
</div>

6
public/app/features/alerting/unified/components/receivers/TemplateForm.tsx
View File

@ -152,7 +152,11 @@ export const TemplateForm: FC<Props> = ({ existing, alertManagerSourceName, conf
Saving...
</Button>
)}
{!loading && <Button variant="primary">Save template</Button>}
{!loading && (
<Button type="submit" variant="primary">
Save template
</Button>
)}
<LinkButton
disabled={loading}
href={makeAMLink('alerting/notifications', alertManagerSourceName)}

4
public/app/features/api-keys/ApiKeysForm.tsx
View File

@ -99,7 +99,9 @@ export const ApiKeysForm: FC<Props> = ({ show, onClose, onKeyAdded, disabled })
</InlineField>
</div>
<div className="gf-form">
<Button disabled={disabled}>Add</Button>
<Button type="submit" disabled={disabled}>
Add
</Button>
</div>
</div>
</form>

6
public/app/features/canvas/elements/button.tsx
View File

@ -27,7 +27,11 @@ class ButtonDisplay extends PureComponent<CanvasElementProps<ButtonConfig, Butto
}
};
return <Button onClick={onClick}>{data?.text}</Button>;
return (
<Button type="submit" onClick={onClick}>
{data?.text}
</Button>
);
}
}

4
public/app/features/dashboard/components/DashboardSettings/DashboardSettings.tsx
View File

@ -41,7 +41,9 @@ const onClose = () => locationService.partial({ editview: null });
const MakeEditable = (props: { onMakeEditable: () => any }) => (
<div>
<div className="dashboard-settings__header">Dashboard not editable</div>
<Button onClick={props.onMakeEditable}>Make editable</Button>
<Button type="submit" onClick={props.onMakeEditable}>
Make editable
</Button>
</div>
);

4
public/app/features/dashboard/components/DashboardSettings/JsonEditorSettings.tsx
View File

@ -54,7 +54,9 @@ export const JsonEditorSettings: React.FC<Props> = ({ dashboard }) => {
</div>
{dashboard.meta.canSave && (
<HorizontalGroup>
<Button onClick={onClick}>Save changes</Button>
<Button type="submit" onClick={onClick}>
Save changes
</Button>
</HorizontalGroup>
)}
</div>

4
public/app/features/dashboard/components/SaveDashboard/forms/SaveProvisionedDashboardForm.tsx
View File

@ -67,7 +67,9 @@ export const SaveProvisionedDashboardForm: React.FC<SaveDashboardFormProps> = ({
<ClipboardButton getText={() => dashboardJSON} onClipboardCopy={onCopyToClipboardSuccess}>
Copy JSON to clipboard
</ClipboardButton>
<Button onClick={saveToFile}>Save JSON to file</Button>
<Button type="submit" onClick={saveToFile}>
Save JSON to file
</Button>
</HorizontalGroup>
</Stack>
</>

2
public/app/features/profile/ChangePasswordForm.tsx
View File

@ -69,7 +69,7 @@ export const ChangePasswordForm: FC<Props> = ({ user, onChangePassword, isSaving
/>
</Field>
<HorizontalGroup>
<Button variant="primary" disabled={isSaving}>
<Button variant="primary" disabled={isSaving} type="submit">
Change Password
</Button>
<LinkButton variant="secondary" href={`${config.appSubUrl}/profile`} fill="outline">

1
public/app/features/profile/UserProfileEditForm.tsx
View File

@ -74,6 +74,7 @@ export const UserProfileEditForm: FC<Props> = ({ user, isSavingUser, updateProfi
variant="primary"
disabled={isSavingUser}
data-testid={selectors.components.UserProfile.profileSaveButton}
type="submit"
>
<Trans id="common.save">Save</Trans>
</Button>