1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import React from 'react';
6 import { StyleRulesCallback, WithStyles, Typography, withStyles, Link } from '@material-ui/core';
7 import { ArvadosTheme } from 'common/custom-theme';
8 import classNames from 'classnames';
9 import { connect, DispatchProp } from 'react-redux';
10 import { RootState } from 'store/store';
11 import { FederationConfig, getNavUrl } from 'routes/routes';
12 import { Dispatch } from 'redux';
13 import { navigationNotAvailable } from 'store/navigation/navigation-action';
15 type CssRules = 'root' | 'space';
17 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
19 boxSizing: 'border-box',
21 padding: theme.spacing.unit
28 export interface CodeSnippetDataProps {
31 apiResponse?: boolean;
35 interface CodeSnippetAuthProps {
36 auth: FederationConfig;
39 type CodeSnippetProps = CodeSnippetDataProps & WithStyles<CssRules>;
41 const mapStateToProps = (state: RootState): CodeSnippetAuthProps => ({
45 export const CodeSnippet = withStyles(styles)(connect(mapStateToProps)(
46 ({ classes, lines, linked, className, apiResponse, dispatch, auth }: CodeSnippetProps & CodeSnippetAuthProps & DispatchProp) =>
49 className={classNames(classes.root, className)}>
50 <Typography className={apiResponse ? classes.space : className} component="pre">
52 lines.map((line, index) => <React.Fragment key={index}>{renderLinks(auth, dispatch)(line)}{`\n`}</React.Fragment>) :
59 const renderLinks = (auth: FederationConfig, dispatch: Dispatch) => (text: string): JSX.Element => {
60 // Matches UUIDs & PDHs
61 const REGEX = /[a-z0-9]{5}-[a-z0-9]{5}-[a-z0-9]{15}|[0-9a-f]{32}\+\d+/g;
62 const links = text.match(REGEX);
67 {text.split(REGEX).map((part, index) =>
68 <React.Fragment key={index}>
71 <Link onClick={() => {
72 const url = getNavUrl(links[index], auth)
74 window.open(`${window.location.origin}${url}`, '_blank');
76 dispatch(navigationNotAvailable(links[index]));
79 style={ {cursor: 'pointer'} }>