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

DashboardSettings: Migrate Link Settings to React (#31150)

Browse Source 
* feat(dashboardsettings): migrate dashboard links EmptyListCTA to react

* feat(dashboardsettings): initial commit of links settings migration to react

* feat(dashboardsettings): add links form functionality

* refactor(dashboardsettings): separate out linksettings components and concerns

* Updates to links list

* Form improvements

* test(dashboardlinks): update links so tests run

* refactor: move _.move to arrayMove for testing purposes

* test(dashboardsettings): initial commit of link settings tests

* refactor(app): put back lodash move method for backwards compatibility

* test(dashboardsettings): add links settings tests

* style(dashboardsettings): camelcase constants

* chore(dashboardsettings): delete old angular links settings view

* fix(dashboardsettings): forceupdate links on submenuVisibilityChanged and correct imports

* chore: remove reference to old angular link settings components

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
This commit is contained in:
Jack Westbrook
2021-02-25 11:50:10 +01:00
committed by GitHub
parent 47d2a8085b
commit ad68f3c5e6
17 changed files with 546 additions and 340 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
packages/grafana-ui/src/components/ConfirmButton/ConfirmButton.tsx
View File

@@ -30,16 +30,15 @@ const getStyles = stylesFactory((theme: GrafanaTheme) => {
transition: opacity 0.1s ease;
z-index: 0;
`,
confirmButtonContainer: css`
confirmButton: css`
align-items: flex-start;
background: ${theme.colors.bg1};
display: flex;
overflow: hidden;
position: absolute;
z-index: 1;
`,
confirmButton: css`
display: flex;
align-items: flex-start;
`,
confirmButtonShow: css`
z-index: 1;
opacity: 1;
transition: opacity 0.08s ease-out, transform 0.1s ease-out;
transform: translateX(0);
@@ -137,6 +136,7 @@ class UnThemedConfirmButton extends PureComponent<Props, State> {
styles.confirmButton,
this.state.showConfirm ? styles.confirmButtonShow : styles.confirmButtonHide
);
const onClick = disabled ? () => {} : this.onClickButton;
return (
@@ -152,15 +152,13 @@ class UnThemedConfirmButton extends PureComponent<Props, State> {
{children}
</span>
)}
<span className={styles.confirmButtonContainer}>
<span className={confirmButtonClass}>
<Button size={size} variant="link" onClick={this.onClickCancel}>
Cancel
</Button>
<Button size={size} variant={confirmButtonVariant} onClick={this.onConfirm}>
{confirmText}
</Button>
</span>
<span className={confirmButtonClass}>
<Button size={size} variant="link" onClick={this.onClickCancel}>
Cancel
</Button>
<Button size={size} variant={confirmButtonVariant} onClick={this.onConfirm}>
{confirmText}
</Button>
</span>
</span>
);