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

Forms migration: Remove Input from Forms namespace (#23301)

Browse Source
This commit is contained in:
Tobias Skarhed
2020-04-03 10:04:19 +02:00
committed by GitHub
parent c7ffc1199c
commit 2e58a65e8f
21 changed files with 61 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
public/app/features/admin/UserCreatePage.tsx
View File

@@ -1,7 +1,7 @@
import React, { useCallback } from 'react';
import { hot } from 'react-hot-loader';
import { connect } from 'react-redux';
import { Forms, Button } from '@grafana/ui';
import { Forms, Button, Input } from '@grafana/ui';
import { NavModel } from '@grafana/data';
import { getBackendSrv } from '@grafana/runtime';
import { StoreState } from '../../types';
@@ -37,15 +37,15 @@ const UserCreatePage: React.FC<UserCreatePageProps> = ({ navModel, updateLocatio
return (
<>
<Forms.Field label="Name" required invalid={!!errors.name} error={!!errors.name && 'Name is required'}>
<Forms.Input name="name" size="md" ref={register({ required: true })} />
<Input name="name" size="md" ref={register({ required: true })} />
</Forms.Field>
<Forms.Field label="E-mail">
<Forms.Input name="email" size="md" ref={register} />
<Input name="email" size="md" ref={register} />
</Forms.Field>
<Forms.Field label="Username">
<Forms.Input name="login" size="md" ref={register} />
<Input name="login" size="md" ref={register} />
</Forms.Field>
<Forms.Field
label="Password"
@@ -53,7 +53,7 @@ const UserCreatePage: React.FC<UserCreatePageProps> = ({ navModel, updateLocatio
invalid={!!errors.password}
error={!!errors.password && 'Password is required and must contain at least 4 characters'}
>
<Forms.Input
<Input
size="md"
type="password"
name="password"

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

@@ -3,7 +3,7 @@ import { css, cx } from 'emotion';
import { hot } from 'react-hot-loader';
import { connect, MapDispatchToProps, MapStateToProps } from 'react-redux';
import { NavModel } from '@grafana/data';
import { Pagination, Forms, Tooltip, HorizontalGroup, stylesFactory, LinkButton } from '@grafana/ui';
import { Pagination, Tooltip, HorizontalGroup, stylesFactory, LinkButton, Input } from '@grafana/ui';
import { StoreState, UserDTO } from '../../types';
import Page from 'app/core/components/Page/Page';
import { getNavModel } from '../../core/selectors/navModel';
@@ -42,7 +42,7 @@ const UserListAdminPageUnConnected: React.FC<Props> = props => {
<>
<div>
<HorizontalGroup justify="space-between">
<Forms.Input
<Input
size="md"
type="text"
placeholder="Search user by login,email or name"

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

@@ -3,7 +3,7 @@ import { UserDTO } from 'app/types';
import { cx, css } from 'emotion';
import { config } from 'app/core/config';
import { GrafanaTheme } from '@grafana/data';
import { ConfirmButton, ConfirmModal, LegacyInputStatus, Button, stylesFactory, Forms } from '@grafana/ui';
import { ConfirmButton, ConfirmModal, LegacyInputStatus, Button, stylesFactory, Input } from '@grafana/ui';
interface Props {
user: UserDTO;
@@ -265,7 +265,7 @@ export class UserProfileRow extends PureComponent<UserProfileRowProps, UserProfi
<td className={labelClass}>{label}</td>
<td className="width-25" colSpan={2}>
{this.state.editing ? (
<Forms.Input
<Input
size="md"
type={inputType}
defaultValue={value}

4
public/app/features/dashboard/components/PanelEditor/GeneralPanelOptions.tsx
View File

@@ -1,7 +1,7 @@
import React, { FC, useMemo } from 'react';
import { PanelModel } from '../../state';
import { SelectableValue } from '@grafana/data';
import { Forms, Select, DataLinksInlineEditor } from '@grafana/ui';
import { Forms, Select, DataLinksInlineEditor, Input } from '@grafana/ui';
import { OptionsGroup } from './OptionsGroup';
import { getPanelLinksVariableSuggestions } from '../../../panel/panellinks/link_srv';
import { getVariables } from '../../../variables/state/selectors';
@@ -24,7 +24,7 @@ export const GeneralPanelOptions: FC<{
<div>
<OptionsGroup title="Panel settings">
<Forms.Field label="Panel title">
<Forms.Input defaultValue={panel.title} onBlur={e => onPanelConfigChange('title', e.currentTarget.value)} />
<Input defaultValue={panel.title} onBlur={e => onPanelConfigChange('title', e.currentTarget.value)} />
</Forms.Field>
<Forms.Field label="Description" description="Panel description supports markdown and links.">
<Forms.TextArea

4
public/app/features/dashboard/components/PanelEditor/OptionsPaneContent.tsx
View File

@@ -10,8 +10,8 @@ import {
TabsBar,
useTheme,
Container,
Forms,
Icon,
Input,
} from '@grafana/ui';
import { DefaultFieldConfigEditor, OverrideFieldConfigEditor } from './FieldConfigEditor';
import { AngularPanelOptions } from './AngularPanelOptions';
@@ -147,7 +147,7 @@ export const OptionsPaneContent: React.FC<{
return (
<div className={styles.searchWrapper}>
<div style={{ ...defaultStyles, ...transitionStyles[state] }}>
<Forms.Input
<Input
className={styles.searchInput}
type="text"
prefix={<Icon name="search" />}

4
public/app/features/dashboard/components/PanelEditor/VisualizationTab.tsx
View File

@@ -1,7 +1,7 @@
import React, { FC, useState } from 'react';
import { css } from 'emotion';
import { GrafanaTheme, PanelPlugin, PanelPluginMeta } from '@grafana/data';
import { CustomScrollbar, useTheme, stylesFactory, Forms, Icon } from '@grafana/ui';
import { CustomScrollbar, useTheme, stylesFactory, Icon, Input } from '@grafana/ui';
import { changePanelPlugin } from '../../state/actions';
import { StoreState } from 'app/types';
import { PanelModel } from '../../state/PanelModel';
@@ -45,7 +45,7 @@ export const VisualizationTabUnconnected: FC<Props> = ({ panel, plugin, changePa
return (
<div className={styles.wrapper}>
<div className={styles.search}>
<Forms.Input
<Input
value={searchQuery}
onChange={e => setSearchQuery(e.currentTarget.value)}
prefix={<Icon name="filter" className={styles.icon} />}

9
public/app/features/dashboard/components/SaveDashboard/forms/SaveDashboardAsForm.tsx
View File

@@ -1,5 +1,5 @@
import React from 'react';
import { Button, Forms, HorizontalGroup } from '@grafana/ui';
import { Button, Forms, HorizontalGroup, Input } from '@grafana/ui';
import { DashboardModel, PanelModel } from 'app/features/dashboard/state';
import { FolderPicker } from 'app/core/components/Select/FolderPicker';
import { SaveDashboardFormProps } from '../types';
@@ -75,12 +75,7 @@ export const SaveDashboardAsForm: React.FC<SaveDashboardFormProps & { isNew?: bo
{({ register, control, errors }) => (
<>
<Forms.Field label="Dashboard name" invalid={!!errors.title} error="Dashboard name is required">
<Forms.Input
name="title"
ref={register({ required: true })}
aria-label="Save dashboard title field"
autoFocus
/>
<Input name="title" ref={register({ required: true })} aria-label="Save dashboard title field" autoFocus />
</Forms.Field>
<Forms.Field label="Folder">
<Forms.InputControl

4
public/app/features/folders/components/NewDashboardsFolder.tsx
View File

@@ -1,7 +1,7 @@
import React, { PureComponent } from 'react';
import { connect, MapDispatchToProps, MapStateToProps } from 'react-redux';
import { NavModel } from '@grafana/data';
import { Forms, Button } from '@grafana/ui';
import { Forms, Button, Input } from '@grafana/ui';
import Page from 'app/core/components/Page/Page';
import { createNewFolder } from '../state/actions';
import { getNavModel } from 'app/core/selectors/navModel';
@@ -55,7 +55,7 @@ export class NewDashboardsFolder extends PureComponent<Props> {
invalid={!!errors.folderName}
error={errors.folderName && errors.folderName.message}
>
<Forms.Input
<Input
name="folderName"
ref={register({
required: 'Folder name is required.',

4
public/app/features/manage-dashboards/DashboardImportPage.tsx
View File

@@ -2,7 +2,7 @@ import React, { FormEvent, PureComponent } from 'react';
import { connect, MapDispatchToProps, MapStateToProps } from 'react-redux';
import { css } from 'emotion';
import { AppEvents, NavModel } from '@grafana/data';
import { Button, Forms, stylesFactory } from '@grafana/ui';
import { Button, Forms, stylesFactory, Input } from '@grafana/ui';
import Page from 'app/core/components/Page/Page';
import { ImportDashboardOverview } from './components/ImportDashboardOverview';
import { DashboardFileUpload } from './components/DashboardFileUpload';
@@ -87,7 +87,7 @@ class DashboardImportUnConnected extends PureComponent<Props> {
invalid={!!errors.gcomDashboard}
error={errors.gcomDashboard && errors.gcomDashboard.message}
>
<Forms.Input
<Input
size="md"
name="gcomDashboard"
placeholder="Grafana.com dashboard url or id"

10
public/app/features/manage-dashboards/components/ImportDashboardForm.tsx
View File

@@ -1,5 +1,5 @@
import React, { FC, useEffect, useState } from 'react';
import { Button, Forms, FormAPI, FormsOnSubmit, HorizontalGroup, FormFieldErrors } from '@grafana/ui';
import { Button, Forms, FormAPI, FormsOnSubmit, HorizontalGroup, FormFieldErrors, Input } from '@grafana/ui';
import { FolderPicker } from 'app/core/components/Select/FolderPicker';
import DataSourcePicker from 'app/core/components/Select/DataSourcePicker';
import { DashboardInput, DashboardInputs, DataSourceInput, ImportDashboardDTO } from '../state/reducers';
@@ -43,7 +43,7 @@ export const ImportDashboardForm: FC<Props> = ({
<>
<Forms.Legend>Options</Forms.Legend>
<Forms.Field label="Name" invalid={!!errors.title} error={errors.title && errors.title.message}>
<Forms.Input
<Input
name="title"
size="md"
type="text"
@@ -72,7 +72,7 @@ export const ImportDashboardForm: FC<Props> = ({
>
<>
{!uidReset ? (
<Forms.Input
<Input
size="md"
name="uid"
disabled
@@ -80,7 +80,7 @@ export const ImportDashboardForm: FC<Props> = ({
addonAfter={!uidReset && <Button onClick={onUidReset}>Change uid</Button>}
/>
) : (
<Forms.Input
<Input
size="md"
name="uid"
ref={register({ required: true, validate: async (v: string) => await validateUid(v) })}
@@ -119,7 +119,7 @@ export const ImportDashboardForm: FC<Props> = ({
invalid={errors.constants && !!errors.constants[index]}
key={constantIndex}
>
<Forms.Input
<Input
ref={register({ required: true })}
name={`${constantIndex}`}
size="md"

4
public/app/features/org/NewOrgPage.tsx
View File

@@ -1,7 +1,7 @@
import React, { FC } from 'react';
import { getBackendSrv } from '@grafana/runtime';
import Page from 'app/core/components/Page/Page';
import { Forms, Button } from '@grafana/ui';
import { Forms, Button, Input } from '@grafana/ui';
import { getConfig } from 'app/core/config';
import { StoreState } from 'app/types';
import { hot } from 'react-hot-loader';
@@ -58,7 +58,7 @@ export const NewOrgPage: FC<PropsWithState> = ({ navModel }) => {
invalid={!!errors.name}
error={errors.name && errors.name.message}
>
<Forms.Input
<Input
size="md"
placeholder="Org. name"
name="name"

11
public/app/features/org/UserInviteForm.tsx
View File

@@ -1,5 +1,5 @@
import React, { FC } from 'react';
import { Forms, HorizontalGroup, Button, LinkButton } from '@grafana/ui';
import { Forms, HorizontalGroup, Button, LinkButton, Input } from '@grafana/ui';
import { getConfig } from 'app/core/config';
import { OrgRole } from 'app/types';
import { getBackendSrv } from '@grafana/runtime';
@@ -54,15 +54,10 @@ export const UserInviteForm: FC<Props> = ({ updateLocation }) => {
error={!!errors.loginOrEmail && 'Email or Username is required'}
label="Email or Username"
>
<Forms.Input
size="md"
name="loginOrEmail"
placeholder="email@example.com"
ref={register({ required: true })}
/>
<Input size="md" name="loginOrEmail" placeholder="email@example.com" ref={register({ required: true })} />
</Forms.Field>
<Forms.Field invalid={!!errors.name} label="Name">
<Forms.Input size="md" name="name" placeholder="(optional)" ref={register} />
<Input size="md" name="name" placeholder="(optional)" ref={register} />
</Forms.Field>
<Forms.Field invalid={!!errors.role} label="Role">
<Forms.InputControl as={Forms.RadioButtonGroup} control={control} options={roles} name="role" />

12
public/app/features/profile/SignupForm.tsx
View File

@@ -1,5 +1,5 @@
import React, { FC } from 'react';
import { Forms, Button, LinkButton } from '@grafana/ui';
import { Forms, Button, LinkButton, Input } from '@grafana/ui';
import { css } from 'emotion';
import { getConfig } from 'app/core/config';
@@ -66,19 +66,19 @@ export const SignupForm: FC<Props> = props => {
<>
{verifyEmailEnabled && (
<Forms.Field label="Email verification code (sent to your email)">
<Forms.Input name="code" size="md" ref={register} placeholder="Code" />
<Input name="code" size="md" ref={register} placeholder="Code" />
</Forms.Field>
)}
{!autoAssignOrg && (
<Forms.Field label="Org. name">
<Forms.Input size="md" name="orgName" placeholder="Org. name" ref={register} />
<Input size="md" name="orgName" placeholder="Org. name" ref={register} />
</Forms.Field>
)}
<Forms.Field label="Your name">
<Forms.Input size="md" name="name" placeholder="(optional)" ref={register} />
<Input size="md" name="name" placeholder="(optional)" ref={register} />
</Forms.Field>
<Forms.Field label="Email" invalid={!!errors.email} error={!!errors.email && errors.email.message}>
<Forms.Input
<Input
size="md"
name="email"
type="email"
@@ -97,7 +97,7 @@ export const SignupForm: FC<Props> = props => {
invalid={!!errors.password}
error={!!errors.password && errors.password.message}
>
<Forms.Input
<Input
size="md"
name="password"
type="password"

10
public/app/features/users/SignupInvited.tsx
View File

@@ -4,7 +4,7 @@ import { connect, MapStateToProps, MapDispatchToProps } from 'react-redux';
import { StoreState } from 'app/types';
import { updateLocation } from 'app/core/actions';
import { UrlQueryValue, getBackendSrv } from '@grafana/runtime';
import { Forms, Button } from '@grafana/ui';
import { Forms, Button, Input } from '@grafana/ui';
import { useAsync } from 'react-use';
import Page from 'app/core/components/Page/Page';
import { contextSrv } from 'app/core/core';
@@ -73,7 +73,7 @@ const SingupInvitedPageUnconnected: FC<DispatchProps & ConnectedProps> = ({ code
{({ register, errors }) => (
<>
<Forms.Field invalid={!!errors.email} error={!!errors.email && errors.email.message} label="Email">
<Forms.Input
<Input
size="md"
placeholder="email@example.com"
name="email"
@@ -87,14 +87,14 @@ const SingupInvitedPageUnconnected: FC<DispatchProps & ConnectedProps> = ({ code
/>
</Forms.Field>
<Forms.Field invalid={!!errors.name} error={!!errors.name && errors.name.message} label="Name">
<Forms.Input size="md" placeholder="Name (optional)" name="name" ref={register} />
<Input size="md" placeholder="Name (optional)" name="name" ref={register} />
</Forms.Field>
<Forms.Field
invalid={!!errors.username}
error={!!errors.username && errors.username.message}
label="Username"
>
<Forms.Input
<Input
size="md"
placeholder="Username"
name="username"
@@ -106,7 +106,7 @@ const SingupInvitedPageUnconnected: FC<DispatchProps & ConnectedProps> = ({ code
error={!!errors.password && errors.password.message}
label="Password"
>
<Forms.Input
<Input
size="md"
type="password"
placeholder="Password"