fix(ui): minor ui fixes

frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/MissingResources.tsx

@@ -7,7 +7,7 @@ import Chart from './Chart';
 import ResourceInfo from './ResourceInfo';
 import CopyPath from './CopyPath';
 
-const cols = [
+const cols: Array<Object> = [
   {
     key: 'resource',
     title: 'Resource',
@@ -17,7 +17,7 @@ const cols = [
   {
     key: 'sessions',
     title: 'Sessions',
-    toText: count => `${ count > 1000 ? Math.trunc(count / 1000) : count }${ count > 1000 ? 'k' : '' }`,
+    toText: (count: number) => `${ count > 1000 ? Math.trunc(count / 1000) : count }${ count > 1000 ? 'k' : '' }`,
     width: '20%',
   },
   {
@@ -25,16 +25,17 @@ const cols = [
     title: 'Trend',
     Component: Chart,
     width: '20%',
-  },
-  {
-    key: 'copy-path',
-    title: '',
-    Component: CopyPath,
-    cellClass: 'invisible group-hover:visible text-right',
-    width: '20%',
   }
 ];
 
+const copyPathCol = {
+  key: 'copy-path',
+  title: '',
+  Component: CopyPath,
+  cellClass: 'invisible group-hover:visible text-right',
+  width: '20%',
+}
+
 interface Props {
     data: any
     metric?: any
@@ -43,6 +44,10 @@ interface Props {
 function MissingResources(props: Props) {
     const { data, metric, isTemplate } = props;
 
+    if (!isTemplate) {
+      cols.push(copyPathCol);
+    }
+    
     return (
         <NoContent
           title="No resources missing."

frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsResponseEnd/ResourceLoadedVsResponseEnd.tsx

@@ -18,7 +18,7 @@ function ResourceLoadedVsResponseEnd(props: Props) {
           size="small"
           show={ metric.data.chart.length === 0 }
         >
-          <ResponsiveContainer height={ 240 } width="100%">
+          <ResponsiveContainer height={ 246 } width="100%">
             <ComposedChart
                 data={metric.data.chart}
                 margin={ Styles.chartMargins}
@@ -67,4 +67,4 @@ function ResourceLoadedVsResponseEnd(props: Props) {
     );
 }
 
-export default ResourceLoadedVsResponseEnd;
+export default ResourceLoadedVsResponseEnd;

frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/SlowestResources.tsx

@@ -15,7 +15,7 @@ export const RESOURCE_OPTIONS = [
   { text: 'JS', value: 'SCRIPT', },
 ];
 
-const cols = [
+const cols: Array<Object> = [
   {
     key: 'type',
     title: 'Type',
@@ -43,16 +43,17 @@ const cols = [
     title: 'Trend',
     Component: Chart,
     width: '15%',
-  },
-  {
-    key: 'copy-path',
-    title: '',
-    Component: CopyPath,
-    cellClass: 'invisible group-hover:visible text-right',
-    width: '15%',
   }
 ];
 
+const copyPathCol = {
+  key: 'copy-path',
+  title: '',
+  Component: CopyPath,
+  cellClass: 'invisible group-hover:visible text-right',
+  width: '15%',
+}
+
 interface Props {
     data: any
     metric?: any
@@ -61,6 +62,10 @@ interface Props {
 function SlowestResources(props: Props) {
     const { data, metric, isTemplate } = props;
 
+    if (!isTemplate) {
+      cols.push(copyPathCol);
+    }
+    
     return (
         <NoContent
           title="No resources missing."

frontend/app/components/Dashboard/Widgets/ResourceLoadedVsResponseEnd/ResourceLoadedVsResponseEnd.js

@@ -29,7 +29,7 @@ export default class ResourceLoadedVsResponseEnd extends React.PureComponent {
           size="small"
           show={ data.chart.length === 0 }
         >
-          <ResponsiveContainer height={ 240 } width="100%">
+          <ResponsiveContainer height={ 247 } width="100%">
             <ComposedChart
               data={data.chart}
               margin={Styles.chartMargins}

frontend/app/components/Dashboard/Widgets/common/Table.js

@@ -52,7 +52,7 @@ export default class Table extends React.PureComponent {
           )) }
         </div>
         { !isTemplate && rows.size > (small ? 3 : 5) && !showAll &&
-            <div className="w-full flex justify-center">
+            <div className="w-full flex justify-center mt-3">
               <Button
                 onClick={ this.onLoadMoreClick }
                 variant="text-primary"

frontend/app/components/Dashboard/components/WidgetName/WidgetName.tsx

@@ -1,5 +1,7 @@
 import React, { useState, useRef, useEffect } from 'react';
 import { Icon } from 'UI';
+import cn from 'classnames';
+
 
 interface Props {
   name: string;
@@ -47,7 +49,7 @@ function WidgetName(props: Props) {
           onFocus={() => setEditing(true)}
         />
       ) : (
-        <div className="text-2xl h-8 flex items-center border-transparent">{ name }</div>
+        <div onDoubleClick={() => setEditing(true)} className={cn("text-2xl h-8 flex items-center border-transparent", canEdit && 'cursor-pointer')}>{ name }</div>
       )}
       { canEdit && <div className="ml-3 cursor-pointer" onClick={() => setEditing(true)}><Icon name="pencil" size="14" /></div> }
     </div>

frontend/app/components/Dashboard/components/WidgetView/WidgetView.tsx

@@ -11,6 +11,7 @@ import { withSiteId } from 'App/routes';
 import FunnelIssues from '../Funnels/FunnelIssues/FunnelIssues';
 import Breadcrumb from 'Shared/Breadcrumb';
 import { FilterKey } from 'Types/filter/filterType';
+
 interface Props {
     history: any;
     match: any

frontend/app/constants/filterOptions.js

@@ -70,7 +70,7 @@ export const metricTypes = [
 export const tableColumnName = {
     [FilterKey.USERID]: 'Users',
     [FilterKey.ISSUE]: 'Issues',
-    [FilterKey.USER_BROWSER]: 'Browsers',
+    [FilterKey.USER_BROWSER]: 'Browser',
     [FilterKey.USER_DEVICE]: 'Devices',
     [FilterKey.USER_COUNTRY]: 'Countries',
     [FilterKey.LOCATION]: 'URLs',
@@ -82,7 +82,7 @@ export const metricOf = [
   { label: 'Sessions', value: FilterKey.SESSIONS, type: 'table' },
   { label: 'JS Errors', value: FilterKey.ERRORS, type: 'table' },
   { label: 'Issues', value: FilterKey.ISSUE, type: 'table' },
-  { label: 'Browsers', value: FilterKey.USER_BROWSER, type: 'table' },
+  { label: 'Browser', value: FilterKey.USER_BROWSER, type: 'table' },
   { label: 'Devices', value: FilterKey.USER_DEVICE, type: 'table' },
   { label: 'Countries', value: FilterKey.USER_COUNTRY, type: 'table' },
   { label: 'URLs', value: FilterKey.LOCATION, type: 'table' },
@@ -128,4 +128,4 @@ export default {
   metricOf,
   issueOptions,
   methodOptions,
-}
+}

frontend/scripts/constants.js

@@ -27,7 +27,7 @@ fs.writeFileSync('app/constants.js',
   "/* eslint-disable */" +
   toExport('countries', countries) +
   toExport('os', os) +
-  toExport('browsers', browsers)
+  toExport('browser', browsers)
 );
 
 function toStyles(prefix, data) {