@imposium-hub/components 2.2.27 → 2.2.28

package/src/components/tag/Tag.tsx

@@ -1,11 +1,14 @@
 import * as React from 'react';
 import { ICON_TIMES } from '../../constants/icons';
 import { string2HexCode } from '../../Util';
+import { copying } from '../../constants/copy';
 
 interface ITagProps {
     copy: string;
     colorize?: boolean;
     removeHandler?: (...args) => any;
+    onNotification?: (e) => void;
+    onError?: (e) => void;
 }
 
 const Tag: React.FC<ITagProps> = (p: ITagProps) => {
@@ -13,6 +16,22 @@ const Tag: React.FC<ITagProps> = (p: ITagProps) => {
         throw new Error('Prop passed to Tag is not string: ');
     }
 
+    const copyToClipboard = (e) => {
+        const { onNotification, onError } = p;
+        navigator.clipboard.writeText(e.target.textContent).then(
+            () => {
+                if (onNotification) {
+                    onNotification(`${copying.copied}`);
+                }
+            },
+            () => {
+                if (onError) {
+                    onError(`${copying.error}`);
+                }
+            }
+        );
+    };
+
     const borderLeftColor: string = p.colorize ? `${string2HexCode(p.copy)}` : '';
     const remove = typeof p.removeHandler === 'function' && (
         <div
@@ -26,7 +45,8 @@ const Tag: React.FC<ITagProps> = (p: ITagProps) => {
         <div
             key={p.copy}
             style={{ borderLeftColor }}
-            className='imposium-tag'>
+            className='imposium-tag'
+            onClick={(e) => copyToClipboard(e)}>
             {p.copy}
             {remove}
         </div>

package/src/components/text-area-field/TextAreaField.tsx

@@ -3,6 +3,7 @@ import Button from '../button/Button';
 import FieldWrapper from '../field-wrapper/FieldWrapper';
 import { IToolTipConfig } from '../Tooltip';
 import { ICON_CLIPBOARD, ICON_EDIT, ICON_CHECK } from '../../constants/icons';
+import { copying } from '../../constants/copy';
 
 interface ITextAreaFieldProps {
     buttons?: any;
@@ -123,7 +124,7 @@ class TextAreaField extends React.PureComponent<ITextAreaFieldProps, ITextAreaFi
                 <Button
                     key='btn-copy'
                     style='subtle'
-                    tooltip='Copy to Clipboard'
+                    tooltip={`${copying.tooltip}`}
                     color='primary'
                     onClick={this.evtHandlers.copyToClipboard}>
                     {ICON_CLIPBOARD}

package/src/components/text-field/TextField.tsx

@@ -14,6 +14,7 @@ import {
 } from '../../constants/icons';
 import ReactTextareaAutocomplete from '@imposium-hub/react-textarea-autocomplete';
 import Spinner from '../spinner/Spinner';
+import { copying } from '../../constants/copy';
 
 interface ITextFieldProps {
     buttons?: any;
@@ -396,7 +397,7 @@ class TextField extends React.PureComponent<ITextFieldProps, ITextFieldState> {
                     key='btn-copy'
                     style='subtle'
                     color='primary'
-                    tooltip='Copy to Clipboard'
+                    tooltip={`${copying.tooltip}`}
                     onClick={this.evtHandlers.copyToClipboard}>
                     {ICON_CLIPBOARD}
                 </Button>

package/src/constants/copy.ts

@@ -248,3 +248,9 @@ export const BATCHES_COPY = {
 export const ERROR: any = {
     download: `Unable to download from host server: [error].`
 };
+
+export const copying: any = {
+    copied: 'Copied to clipboard!',
+    error: 'Error copying to clipboard.',
+    tooltip: 'Copy to clipboard!'
+};

package/src/services/Session.ts

@@ -37,7 +37,7 @@ export default class SessionService {
             let accessUrl = baseUrl ? `${baseUrl}/access` : SessionService.determineAccessUrl();
 
             if (getTotalRenders) {
-                accessUrl += '?include_total_renders=true`';
+                accessUrl += '?include_total_renders=true';
             }
 
             axios