[ARVADOS-WORKBENCH2] updated: 2.1.0-235-g835fca71
Git user
git at public.arvados.org
Thu Mar 11 17:41:30 UTC 2021
Summary of changes:
src/components/code-snippet/code-snippet.tsx | 2 +-
.../details-attribute/details-attribute.tsx | 2 +-
src/views-components/token-dialog/token-dialog.tsx | 76 +++++++---------------
3 files changed, 24 insertions(+), 56 deletions(-)
via 835fca715fcf8da391049b46ae89f600569896f0 (commit)
from e84e9949a55f5e25682bf7c4e4656a123091f3ff (commit)
Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.
commit 835fca715fcf8da391049b46ae89f600569896f0
Author: Lucas Di Pentima <lucas at di-pentima.com.ar>
Date: Thu Mar 11 14:40:54 2021 -0300
16848: Changes layout for token & api host display. Reduces code block font.
Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas at di-pentima.com.ar>
diff --git a/src/components/code-snippet/code-snippet.tsx b/src/components/code-snippet/code-snippet.tsx
index 72d7d92b..f54d4a11 100644
--- a/src/components/code-snippet/code-snippet.tsx
+++ b/src/components/code-snippet/code-snippet.tsx
@@ -35,7 +35,7 @@ export const CodeSnippet = withStyles(styles)(
className={classNames(classes.root, className)}>
{
lines.map((line: string, index: number) => {
- return <Typography key={index} className={apiResponse ? classes.space : ''} component="pre">{line}</Typography>;
+ return <Typography key={index} className={apiResponse ? classes.space : className} component="pre">{line}</Typography>;
})
}
</Typography>
diff --git a/src/components/details-attribute/details-attribute.tsx b/src/components/details-attribute/details-attribute.tsx
index 7633b71a..2cecc8ce 100644
--- a/src/components/details-attribute/details-attribute.tsx
+++ b/src/components/details-attribute/details-attribute.tsx
@@ -91,7 +91,7 @@ export const DetailsAttribute = connect(mapStateToProps)(withStyles(styles)(
let valueNode: React.ReactNode;
if (linkToUuid) {
- const uuid = uuidEnhancer ? uuidEnhancer(linkToUuid) : linkToUuid;
+ const uuid = uuidEnhancer ? uuidEnhancer(linkToUuid) : linkToUuid;
const linkUrl = getNavUrl(linkToUuid || "", { localCluster, remoteHostsConfig, sessions });
if (linkUrl[0] === '/') {
valueNode = <Link to={linkUrl} className={classes.link}>{uuid}</Link>;
diff --git a/src/views-components/token-dialog/token-dialog.tsx b/src/views-components/token-dialog/token-dialog.tsx
index 1421f67b..2a77ea34 100644
--- a/src/views-components/token-dialog/token-dialog.tsx
+++ b/src/views-components/token-dialog/token-dialog.tsx
@@ -12,8 +12,7 @@ import {
withStyles,
StyleRulesCallback,
Button,
- Typography,
- Tooltip
+ Typography
} from '@material-ui/core';
import * as CopyToClipboard from 'react-copy-to-clipboard';
import { ArvadosTheme } from '~/common/custom-theme';
@@ -28,9 +27,9 @@ import {
import { DefaultCodeSnippet } from '~/components/default-code-snippet/default-code-snippet';
import { snackbarActions, SnackbarKind } from '~/store/snackbar/snackbar-actions';
import { getNewExtraToken } from '~/store/auth/auth-action';
-import { CopyIcon } from '~/components/icon/icon';
+import { DetailsAttribute } from '~/components/details-attribute/details-attribute';
-type CssRules = 'link' | 'paper' | 'button' | 'actionButton' | 'copyIcon' | 'inlineMonospaced';
+type CssRules = 'link' | 'paper' | 'button' | 'actionButton' | 'codeBlock';
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
link: {
@@ -54,20 +53,9 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
marginBottom: theme.spacing.unit * 2,
marginRight: theme.spacing.unit * 2,
},
- copyIcon: {
- marginLeft: theme.spacing.unit,
- color: theme.palette.grey["500"],
- cursor: 'pointer',
- display: 'inline',
- '& svg': {
- fontSize: '1rem'
- }
+ codeBlock: {
+ fontSize: '0.8125rem',
},
- inlineMonospaced: {
- fontFamily: 'Monospace',
- fontSize: '1rem',
- display: 'inline-block',
- }
});
type TokenDialogProps = TokenDialogData & WithDialogProps<{}> & WithStyles<CssRules> & DispatchProp;
@@ -106,6 +94,9 @@ unset ARVADOS_API_HOST_INSECURE`
render() {
const { classes, open, closeDialog, ...data } = this.props;
+ const tokenExpiration = data.tokenExpiration
+ ? data.tokenExpiration.toLocaleString()
+ : `This token does not have an expiration date`;
return <Dialog
open={open}
@@ -124,46 +115,23 @@ unset ARVADOS_API_HOST_INSECURE`
</Typography>
</Typography>
<Typography paragraph={true}>
- <Typography component='span'>
- Your Arvados API host is: <Typography className={classes.inlineMonospaced} component='span'>{data.apiHost} {<Tooltip title="Copy to clipboard">
- <span className={classes.copyIcon}>
- <CopyToClipboard text={data.apiHost} onCopy={() => this.onCopy("API host copied")}>
- <CopyIcon />
- </CopyToClipboard>
- </span>
- </Tooltip>}
- </Typography>
- </Typography>
- <Typography component='span'>
- Your token is: <Typography className={classes.inlineMonospaced} component='span'>{data.token} {<Tooltip title="Copy to clipboard">
- <span className={classes.copyIcon}>
- <CopyToClipboard text={data.token} onCopy={() => this.onCopy("Token copied")}>
- <CopyIcon />
- </CopyToClipboard>
- </span>
- </Tooltip>}
- </Typography>
- </Typography>
- <Typography component='span'>
- { data.tokenExpiration
- ? `Expires at: ${data.tokenExpiration.toLocaleString()}`
- : `This token does not have an expiration date`
- }
- </Typography>
+ <DetailsAttribute label='API Host' value={data.apiHost} copyValue={data.apiHost} />
+ <DetailsAttribute label='API Token' value={data.token} copyValue={data.token} />
+ <DetailsAttribute label='Token expiration' value={tokenExpiration} />
+ { this.props.canCreateNewTokens && <Button
+ onClick={() => this.onGetNewToken()}
+ color="primary"
+ size="small"
+ variant="contained"
+ className={classes.actionButton}
+ >
+ GET NEW TOKEN
+ </Button> }
</Typography>
- { this.props.canCreateNewTokens && <Button
- onClick={() => this.onGetNewToken()}
- color="primary"
- size="small"
- variant="contained"
- className={classes.actionButton}
- >
- GET NEW TOKEN
- </Button> }
<Typography paragraph={true}>
Paste the following lines at a shell prompt to set up the necessary environment for Arvados SDKs to authenticate to your account.
</Typography>
- <DefaultCodeSnippet lines={[this.getSnippet(data)]} />
+ <DefaultCodeSnippet className={classes.codeBlock} lines={[this.getSnippet(data)]} />
<CopyToClipboard text={this.getSnippet(data)} onCopy={() => this.onCopy('Shell code block copied')}>
<Button
color="primary"
@@ -174,7 +142,7 @@ unset ARVADOS_API_HOST_INSECURE`
COPY TO CLIPBOARD
</Button>
</CopyToClipboard>
- <Typography >
+ <Typography>
Arvados
<a href='http://doc.arvados.org/user/reference/api-tokens.html' target='blank' className={classes.link}>virtual machines</a>
do this for you automatically. This setup is needed only when you use the API remotely (e.g., from your own workstation).
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list