Merge Master with Feature Branch (#1111)

* Dev Walkthru: add a new Panel to the Dashboard (#1062) * Dev Walkthru: add a new Panel to the Dashboard * small tweaks, review feedback * fix bad code end marker * Diagnostics bugFix (#1065) * flatMap * Dummy comment to retrigger build * Add Rule Diagnostics (#1064) Add diagnostics logging for rule create/update events. Added the following metrics: Rule_NewClick Rule_EditClick Rule_DeviceGroupClick Rule_CalculationClick Rule_FieldClick Rule_OperatorClick Rule_AddConditionClick Rule_SeverityLevelClick Rule_StatusToggle Rule_ApplyClick Rule_CancelClick Rule_TopXCloseClick Also includes new "sessionid" sections of diagnostics call, which logs the time in ms since Jan 1, 1970 when the page was loaded (amplitude expects session id in this format). This fields will be added by diagnostics to enable logging of session id to amplitude--until those changes go in it will be ignored by the backend. * Delete .travis.yml (#1066) * Delete .travis.yml * Update README.md * Add diagnostics for new device funnel (#1075) * Add device metrics Add metrics for new device flyout * Add device created metric Add metric on device create so we can log device id for physical devices * Fix rule apply event Rule apply click event was only emitted for new rules. Move call so it is emitted if a rule is added or edited. * Address comments and align metric names Address comments. Update metric names to be in same format as rule metrics * fix insertion when entities are null for devices and rules (#1078) * Refactor to make walkthrough code less intrusive (#1069) * refactor to make walkthrough code less intrusive * refactor after meeting with team * update MD files, move httpClient * review feedback * fix nit * update breadcrumbs to use isDef instead of checking undefined * Treat text and number correctly in device jobs (#1082) * treat text and number correctly in device jobs * fix formatting nit * Rule updates need to send ETag (#1084) UI needs to send the ETag when updating rules. * Rule enable/disable needs to update ETag in redux store (#1086) * Small updates for the add page walkthrough (#1089) * Making cloudToDeviceMethod to empty an string (#1090) * rearrange controls on context menus (#1093) * Add links to Time Series Insights from Dashboard and Device Details Page (#1085) Add a Hyperlink shared component Fetch the Time Series Explorer URL from Telemetry Add link to dashboard and device details * Adding curly brackets in json Payload (#1094) * Fix alignment of stats on dashbaord (quick fix) (#1097) * Move Add Condition button below the rule conditions (#1103) * Update section decriptions to be more actionable on Device Details (#1110)
Azure · Sep 27, 2018 · e287a27 · e287a27
1 parent 566e91f
commit e287a27
Show file tree

Hide file tree

Showing 5 changed files with 75 additions and 55 deletions.
diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json
@@ -206,12 +206,12 @@
         },
         "methods": {
           "title": "Methods",
-          "description": "All methods available for device",
+          "description": "To run a method on one or more devices, close this pane, select the checkbox for the device(s), click <1><0>{{jobs}}</0></1>, and then select <3><0>{{methods}}</0></3>.",
           "noneExist": "No methods found for this device."
         },
         "properties": {
           "title": "Properties",
-          "description": "Selected properties on device",
+          "description": "To change a property on one or more devices, close this pane, select the checkbox for the device(s), click <1><0>{{jobs}}</0></1>, and then select <3><0>{{properties}}</0></3>.",
           "keyHeader": "Property",
           "valueHeader": "Value",
           "noneExist": "No properties found for this device.",
@@ -221,7 +221,7 @@
         },
         "tags": {
           "title": "Tags",
-          "description": "Tags applied to device",
+          "description": "To add, delete, or change a tag on one or more devices, close this pane, select the checkbox for the device(s), click <1><0>{{jobs}}</0></1>, and then select <3><0>{{tags}}</0></3>.",
           "keyHeader": "Key",
           "valueHeader": "Value",
           "noneExist": "No tags found for this device."
@@ -265,7 +265,7 @@
           "required": "Is required"
         },
         "tags": {
-          "radioLabel": "Tag",
+          "radioLabel": "Tags",
           "title": "Tags on selected devices",
           "description": "Tags in common on selected devices",
           "keyHeader": "Key",
@@ -277,8 +277,8 @@
           "add": "Add tag"
         },
         "methods": {
-          "radioLabel": "Run method",
-          "title": "Run method",
+          "radioLabel": "Methods",
+          "title": "Run method on selected devices",
           "description": "All available methods for device or group of devices",
           "methodName": "Method name",
           "methodNameHint": "Select method",
@@ -288,8 +288,8 @@
           "firmwareUriHint": "Enter firmware URI value"
         },
         "properties": {
-          "radioLabel": "Reconfigure",
-          "title": "Reconfigure",
+          "radioLabel": "Properties",
+          "title": "Properties on selected devices",
           "description": "Available properties and values to change",
           "keyHeader": "Property",
           "valueHeader": "Value",

diff --git a/src/components/pages/devices/flyouts/deviceDetails/deviceDetails.js b/src/components/pages/devices/flyouts/deviceDetails/deviceDetails.js
@@ -1,6 +1,7 @@
 // Copyright (c) Microsoft. All rights reserved.
 
 import React, { Component } from 'react';
+import { Trans } from 'react-i18next';
 import { Subject } from 'rxjs';
 import moment from 'moment';
 import { DEFAULT_TIME_FORMAT } from 'components/shared/pcsGrid/pcsGridConfig';
@@ -230,7 +231,14 @@ export class DeviceDetails extends Component {
               <Section.Container>
                 <Section.Header>{t('devices.flyouts.details.tags.title')}</Section.Header>
                 <Section.Content>
-                  <SectionDesc>{t('devices.flyouts.details.tags.description')}</SectionDesc>
+                  <SectionDesc>
+                    <Trans i18nKey={"devices.flyouts.details.tags.description"}>
+                      To edit, close this panel, click on
+                      <strong>{{ jobs: t('devices.flyouts.jobs.title') }}</strong>
+                      then select
+                      <strong>{{ tags: t('devices.flyouts.jobs.tags.radioLabel') }}</strong>.
+                    </Trans>
+                  </SectionDesc>
                   {
                     (tags.length === 0) &&
                     t('devices.flyouts.details.tags.noneExist')
@@ -262,7 +270,14 @@ export class DeviceDetails extends Component {
               <Section.Container>
                 <Section.Header>{t('devices.flyouts.details.methods.title')}</Section.Header>
                 <Section.Content>
-                  <SectionDesc>{t('devices.flyouts.details.methods.description')}</SectionDesc>
+                  <SectionDesc>
+                    <Trans i18nKey={"devices.flyouts.details.methods.description"}>
+                      To edit, close this panel, click on
+                      <strong>{{ jobs: t('devices.flyouts.jobs.title') }}</strong>
+                      then select
+                      <strong>{{ methods: t('devices.flyouts.jobs.methods.radioLabel') }}</strong>.
+                    </Trans>
+                  </SectionDesc>
                   {
                     (device.methods.length === 0)
                       ? t('devices.flyouts.details.methods.noneExist')
@@ -283,7 +298,14 @@ export class DeviceDetails extends Component {
               <Section.Container>
                 <Section.Header>{t('devices.flyouts.details.properties.title')}</Section.Header>
                 <Section.Content>
-                  <SectionDesc>{t('devices.flyouts.details.properties.description')}</SectionDesc>
+                  <SectionDesc>
+                    <Trans i18nKey={"devices.flyouts.details.properties.description"}>
+                      To edit, close this panel, click on
+                      <strong>{{ jobs: t('devices.flyouts.jobs.title') }}</strong>
+                      then select
+                      <strong>{{ properties: t('devices.flyouts.jobs.properties.radioLabel') }}</strong>.
+                    </Trans>
+                  </SectionDesc>
                   {
                     (properties.length === 0) &&
                     t('devices.flyouts.details.properties.noneExist')

diff --git a/src/components/pages/maintenance/summary/summary.js b/src/components/pages/maintenance/summary/summary.js
@@ -56,11 +56,11 @@ export const Summary = ({
       </ContextMenuAlign>
     </ContextMenu>
     <PageContent className="maintenance-container summary-container">
-      <RefreshBar
-        refresh={props.refreshData}
-        time={props.lastUpdated}
-        isPending={alertProps.isPending || jobProps.isPending}
-        t={props.t} />
+        <RefreshBar
+          refresh={props.refreshData}
+          time={props.lastUpdated}
+          isPending={alertProps.isPending || jobProps.isPending}
+          t={props.t} />
       <PageTitle titleValue={props.t('maintenance.title')} />
       <StatSection>
         <StatGroup>

diff --git a/src/components/pages/rules/flyouts/ruleEditor/ruleEditor.js b/src/components/pages/rules/flyouts/ruleEditor/ruleEditor.js
@@ -370,12 +370,6 @@ export class RuleEditor extends LinkedComponent {
         </Section.Container>
         {
           !fieldQueryPending && <div>
-            <Section.Container collapsable={false}>
-              <Section.Header>{t('rules.flyouts.ruleEditor.conditions')}</Section.Header>
-              <Section.Content>
-                <Btn svg={svgs.plus} onClick={this.addCondition}>{t('rules.flyouts.ruleEditor.addCondition')}</Btn>
-              </Section.Content>
-            </Section.Container>
             {
               conditionLinks.map((condition, idx) => (
                 <Section.Container key={formData.conditions[idx].key}>
@@ -421,6 +415,12 @@ export class RuleEditor extends LinkedComponent {
                 </Section.Container>
               ))
             }
+            <Section.Container collapsable={false}>
+              <Section.Header>{t('rules.flyouts.ruleEditor.conditions')}</Section.Header>
+              <Section.Content>
+                <Btn svg={svgs.plus} onClick={this.addCondition}>{t('rules.flyouts.ruleEditor.addCondition')}</Btn>
+              </Section.Content>
+            </Section.Container>
             <Section.Container collapsable={false}>
               <Section.Content>
                 <FormGroup className="padded-top">

diff --git a/src/walkthrough/components/pages/dashboard/dashboard.js b/src/walkthrough/components/pages/dashboard/dashboard.js
@@ -5,7 +5,7 @@ import React, { Component } from 'react';
 import { Grid, Cell } from 'components/pages/dashboard/grid';
 
 import { ExamplePanel } from './panels';
-import { ComponentArray, ContextMenu, PageContent } from 'components/shared';
+import { ContextMenu, PageContent } from 'components/shared';
 
 import './dashboard.css';
 
@@ -22,37 +22,35 @@ export class Dashboard extends Component {
   render() {
     const { t } = this.props;
 
-    return (
-      <ComponentArray>
-        <ContextMenu>
-          {/** Add context buttons here... as needed for your dashboard. In this example, there are none. */}
-        </ContextMenu>
-        <PageContent className="dashboard-container">
-          <Grid>
-            <Cell className="col-4">
-              <ExamplePanel t={t} />
-            </Cell>
-            <Cell className="col-6">
-              <ExamplePanel t={t} />
-            </Cell>
-            <Cell className="col-2">
-              <ExamplePanel t={t} />
-            </Cell>
-            <Cell className="col-2">
-              <ExamplePanel t={t} />
-            </Cell>
-            <Cell className="col-2">
-              <ExamplePanel t={t} />
-            </Cell>
-            <Cell className="col-2">
-              <ExamplePanel t={t} />
-            </Cell>
-            <Cell className="col-2">
-              <ExamplePanel t={t} />
-            </Cell>
-          </Grid>
-        </PageContent>
-      </ComponentArray>
-    );
+    return [
+      <ContextMenu key="context-menu">
+        {/** Add context buttons here... as needed for your dashboard. In this example, there are none. */}
+      </ContextMenu>,
+      <PageContent className="dashboard-container" key="page-content">
+        <Grid>
+          <Cell className="col-4">
+            <ExamplePanel t={t} />
+          </Cell>
+          <Cell className="col-6">
+            <ExamplePanel t={t} />
+          </Cell>
+          <Cell className="col-2">
+            <ExamplePanel t={t} />
+          </Cell>
+          <Cell className="col-2">
+            <ExamplePanel t={t} />
+          </Cell>
+          <Cell className="col-2">
+            <ExamplePanel t={t} />
+          </Cell>
+          <Cell className="col-2">
+            <ExamplePanel t={t} />
+          </Cell>
+          <Cell className="col-2">
+            <ExamplePanel t={t} />
+          </Cell>
+        </Grid>
+      </PageContent>
+    ];
   }
 }