Merge pull request #379 from lifeomic/PHC-5381-Brand-theme/style-fixe…

…s-related-to-tracker-settings-cog PHC-5381-Brand-theme/style-fixes-related-to-tracker-settings-cog
lifeomic · Sep 26, 2023 · cc8c95e · cc8c95e
2 parents 81cb38c + 967631e
commit cc8c95e
Show file tree

Hide file tree

Showing 11 changed files with 173 additions and 190 deletions.
diff --git a/example/storybook/stories/TrackTile/AdvancedTrackerDetails.stories.tsx b/example/storybook/stories/TrackTile/AdvancedTrackerDetails.stories.tsx
@@ -12,7 +12,7 @@ import { activity, mindful, nutrition, sleep } from './util/ontologies';
 
 const ontology = {} as any;
 
-storiesOf('AdvancedTrackerDetails', module)
+storiesOf('TrackTile/AdvancedTrackerDetails', module)
   .addDecorator(withKnobs)
   .addDecorator((storyFn, context) =>
     MockEnvironmentDecorator({ ontology })(storyFn, context),

diff --git a/example/storybook/stories/TrackTile/AdvancedTrackerEditor.stories.tsx b/example/storybook/stories/TrackTile/AdvancedTrackerEditor.stories.tsx
@@ -24,7 +24,7 @@ const ontology = {} as any;
 
 const Stack = createNativeStackNavigator();
 
-storiesOf('AdvancedTrackerEditor', module)
+storiesOf('TrackTile/AdvancedTrackerEditor', module)
   .addDecorator(withKnobs)
   .addDecorator((storyFn, context) =>
     MockEnvironmentDecorator({

diff --git a/example/storybook/stories/TrackTile/Indicator.stories.tsx b/example/storybook/stories/TrackTile/Indicator.stories.tsx
@@ -9,7 +9,7 @@ import { kebabCase, invert } from 'lodash';
 import { View, Text, ScrollView } from 'react-native';
 import { CenterView } from '../../helpers/CenterView';
 
-storiesOf('Indicator', module)
+storiesOf('TrackTile/Indicator', module)
   .addDecorator((story) => <CenterView>{story()}</CenterView>)
   .add('default', () => {
     const names = Object.keys(Icons).map(kebabCase);

diff --git a/example/storybook/stories/TrackTile/ManageTrackers.stories.tsx b/example/storybook/stories/TrackTile/ManageTrackers.stories.tsx
@@ -59,7 +59,7 @@ const defaultMetricTypes: Partial<Tracker>[] = [
   },
 ];
 
-storiesOf('ManageTrackers', module)
+storiesOf('TrackTile/ManageTrackers', module)
   .addDecorator((storyFn, context) =>
     MockEnvironmentDecorator()(storyFn, context),
   )

diff --git a/example/storybook/stories/TrackTile/Pillar.stories.tsx b/example/storybook/stories/TrackTile/Pillar.stories.tsx
@@ -106,7 +106,7 @@ const initialValue: TrackerValue = {
   code: { coding: [] },
 };
 
-storiesOf('Pillar', module)
+storiesOf('TrackTile/Pillar', module)
   .addDecorator(MockEnvironmentDecorator())
   .addDecorator((story) => <CenterView>{story()}</CenterView>)
   .add('default', () => <InteractivePillar />)

diff --git a/example/storybook/stories/TrackTile/PillarsTile.stories.tsx b/example/storybook/stories/TrackTile/PillarsTile.stories.tsx
@@ -3,10 +3,6 @@ import { storiesOf } from '@storybook/react-native';
 import { PillarsTile } from '../../../../src/components/TrackTile/PillarsTile/PillarsTile';
 import { action } from '@storybook/addon-actions';
 import { MockEnvironmentDecorator } from './util/MockEnvironmentDecorator';
-import {
-  Tracker,
-  TRACKER_PILLAR_CODE_SYSTEM,
-} from '../../../../src/components/TrackTile/services/TrackTileService';
 import { View } from 'react-native';
 import { boolean } from '@storybook/addon-knobs';
 import {
@@ -20,135 +16,12 @@ import {
 } from '@lifeomic/chromicons-native';
 import { IconProvider } from '../../../../src';
 import { CenterView } from '../../helpers/CenterView';
+import { getTrackers } from './util/trackerData';
 
-const baseTracker = {
-  account: 'accountid',
-  description: 'desc',
-  lifePoints: 0,
-  system: TRACKER_PILLAR_CODE_SYSTEM,
-};
-
-const nutritionPillar: Tracker = {
-  ...baseTracker,
-  id: 'nutrition',
-  metricId: 'nutrition',
-  name: 'nutrition',
-  icon: 'apple',
-  color: '#33C317',
-  resourceType: 'Observation',
-  code: 'code',
-  system: TRACKER_PILLAR_CODE_SYSTEM,
-  order: 1,
-  units: [
-    {
-      code: 'nutrition',
-      system: 'http://lifeomic.com/fhir/track-tile-pillar-value/health-plants',
-      default: true,
-      display: 'svgs',
-      target: 5,
-      unit: 'svg',
-    },
-  ],
-};
-const activityPillar: Tracker = {
-  ...baseTracker,
-  id: 'activity',
-  metricId: 'activity',
-  name: 'activity',
-  icon: 'running',
-  color: '#CD335E',
-  resourceType: 'Observation',
-  code: 'activity',
-  system: TRACKER_PILLAR_CODE_SYSTEM,
-  order: 2,
-  units: [
-    {
-      code: 'activity',
-      default: true,
-      display: 'min',
-      system: 'http://lifeomic.com/fhir/track-tile-pillar-value/health-plants',
-      target: 30,
-      unit: 'min',
-    },
-  ],
-};
-const mindfulnessPillar: Tracker = {
-  ...baseTracker,
-  id: 'self-care',
-  metricId: 'self-care',
-  name: 'self care',
-  icon: 'heart',
-  color: '#EFC002',
-  resourceType: 'Procedure',
-  code: 'self-care',
-  system: TRACKER_PILLAR_CODE_SYSTEM,
-  order: 3,
-  units: [
-    {
-      code: 'self-care',
-      default: true,
-      display: 'min',
-      system: 'http://lifeomic.com/fhir/track-tile-pillar-value/health-plants',
-      target: 15,
-      unit: 'min',
-    },
-  ],
-};
-const sleepPillar: Tracker = {
-  ...baseTracker,
-  id: 'sleep',
-  metricId: 'sleep',
-  name: 'sleep',
-  color: '#6956D0',
-  icon: 'moon',
-  resourceType: 'Procedure',
-  code: 'code',
-  system: TRACKER_PILLAR_CODE_SYSTEM,
-  order: 4,
-  units: [
-    {
-      code: 'sleep',
-      default: true,
-      display: 'hrs',
-      system: 'http://lifeomic.com/fhir/track-tile-pillar-value/health-plants',
-      target: 7,
-      unit: 'hr',
-    },
-  ],
-};
-const schoolPillar: Tracker = {
-  ...baseTracker,
-  id: 'school',
-  metricId: 'school',
-  name: 'school',
-  icon: 'book-open',
-  resourceType: 'Procedure',
-  code: 'school',
-  system: TRACKER_PILLAR_CODE_SYSTEM,
-  color: '#00A7D4',
-  order: 5,
-  units: [
-    {
-      code: 'school',
-      default: true,
-      display: 'min',
-      system: 'http://lifeomic.com/fhir/track-tile-pillar-value/health-plants',
-      target: 60,
-      unit: 'min',
-    },
-  ],
-};
-
-storiesOf('PillarsTile', module)
+storiesOf('TrackTile/PillarsTile', module)
   .addDecorator((storyFn, context) =>
     MockEnvironmentDecorator({
-      trackers: [
-        nutritionPillar,
-        activityPillar,
-        mindfulnessPillar,
-        sleepPillar,
-        schoolPillar,
-      ],
+      trackers: getTrackers({ pillars: true }),
     })(storyFn, context),
   )
   .addDecorator((story) => <CenterView>{story()}</CenterView>)

diff --git a/example/storybook/stories/TrackTile/TrackTiles.stories.tsx b/example/storybook/stories/TrackTile/TrackTiles.stories.tsx
@@ -5,65 +5,41 @@ import { MockEnvironmentDecorator } from './util/MockEnvironmentDecorator';
 import { action } from '@storybook/addon-actions';
 import { TrackTile } from '../../../../src/components/TrackTile';
 import { CenterView } from '../../helpers/CenterView';
+import { getTrackers } from './util/trackerData';
+import { boolean } from '@storybook/addon-knobs';
+import { PillarsTile } from '../../../../src/components/TrackTile/PillarsTile/PillarsTile';
 
-storiesOf('TrackTile', module)
+const trackers = [...getTrackers(), ...getTrackers({ pillars: true })];
+
+storiesOf('TrackTile/TrackTiles', module)
   .addDecorator((storyFn, context) =>
     MockEnvironmentDecorator({
-      trackers: [
-        {
-          id: '1',
-          metricId: '1',
-          name: 'Test',
-          color: 'chartreuse',
-          resourceType: 'Procedure',
-          units: [
-            {
-              code: 'h',
-              default: true,
-              display: 'hour',
-              system: 'http://unitsofmeasure.org',
-              target: 5,
-              unit: 'h',
-            },
-          ],
-        },
-      ],
+      trackers,
     })(storyFn, context),
   )
-  .addDecorator((story) => <CenterView>{story()}</CenterView>)
   .add('default', () => (
-    <TrackTile
-      onOpenSettings={action('onOpenSettings')}
-      onOpenTracker={action('onOpenTracker')}
-    />
-  ))
-  .add('With title and settings button', () => (
-    <TrackTile
-      onOpenSettings={action('onOpenSettings')}
-      onOpenTracker={action('onOpenTracker')}
-      title="TrackTile Title"
-    />
-  ))
-  .add('Title without settings button', () => (
-    <TrackTile
-      onOpenSettings={action('onOpenSettings')}
-      onOpenTracker={action('onOpenTracker')}
-      title="TrackTile Title"
-      hideSettingsButton
-    />
-  ))
-  .add('Settings button without title', () => (
-    <TrackTile
-      onOpenSettings={action('onOpenSettings')}
-      onOpenTracker={action('onOpenTracker')}
-    />
+    <CenterView>
+      <TrackTile
+        onOpenSettings={action('onOpenSettings')}
+        onOpenTracker={action('onOpenTracker')}
+        title={boolean('Title', true) ? 'TrackTile Title' : undefined}
+        hideSettingsButton={boolean('Hide Settings Button', false)}
+      />
+    </CenterView>
   ))
-  .add('Without settings button or title', () => (
-    <TrackTile
-      onOpenSettings={action('onOpenSettings')}
-      onOpenTracker={action('onOpenTracker')}
-      hideSettingsButton
-    />
+  .add('In context with Pillars', () => (
+    <>
+      <PillarsTile
+        onOpenDetails={action('onOpenDetails')}
+        onSaveNewValueOverride={action('onSaveNewValueOverride')}
+      />
+      <TrackTile
+        onOpenSettings={action('onOpenSettings')}
+        onOpenTracker={action('onOpenTracker')}
+        title={boolean('Title', true) ? 'TrackTile Title' : undefined}
+        hideSettingsButton={boolean('Hide Settings Button', false)}
+      />
+    </>
   ))
   .add('Custom style', () => {
     const styles = {

diff --git a/example/storybook/stories/TrackTile/Tracker.stories.tsx b/example/storybook/stories/TrackTile/Tracker.stories.tsx
@@ -14,7 +14,7 @@ import {
 } from '@storybook/addon-knobs';
 import { CenterView } from '../../helpers/CenterView';
 
-storiesOf('Tracker', module)
+storiesOf('TrackTile/Tracker', module)
   .addDecorator(withKnobs)
   .addDecorator((story) => <CenterView>{story()}</CenterView>)
   .add('default', () => {

diff --git a/example/storybook/stories/TrackTile/TrackerDetails.stories.tsx b/example/storybook/stories/TrackTile/TrackerDetails.stories.tsx
@@ -68,7 +68,7 @@ const valuesContext = {
   codeBelow: TRACKER_CODE,
 };
 
-storiesOf('TrackerDetails', module)
+storiesOf('TrackTile/TrackerDetails', module)
   .addDecorator(withKnobs)
   .addDecorator((storyFn, context) =>
     MockEnvironmentDecorator({

diff --git a/example/storybook/stories/TrackTile/TrackerHistoryChart.stories.tsx b/example/storybook/stories/TrackTile/TrackerHistoryChart.stories.tsx
@@ -13,7 +13,7 @@ const defaultProps = {
   },
 };
 
-storiesOf('Tracker History Chart', module)
+storiesOf('TrackTile/Tracker History Chart', module)
   .addDecorator((Story) => (
     <View style={{ marginHorizontal: 34, marginVertical: 128, height: 250 }}>
       {Story()}