Linked Time: Fix bug with pinned cards and simplify logic around emitting minMax (#6241)

## Motivation for features / changes
See #6240 for a more detailed write up on the backstory surrounding this
effort.

I managed to find two bugs while testing #6240.
* Pinning a card then reloading the page will not result in a `minMax`
being generated for the pinned copy
* There is currently some bounding logic in place ensuring `minMax`
values are not generated outside of the of the min and max steps in the
card. Adding a new selector to retrieve the pre-derived `dataMinMax`
prevents us from needing a dependency on the cards data when emitting a
`cardMinMaxChanged` event. This dramatically simplifies the logic around
surrounding the event and removes the need for the observable
altogether.

## Screenshots of UI changes
None

## Detailed steps to verify changes work correctly (as executed by you)
1) Start tensorboard
2) Navigate to localhost:6006
3) Pin a scalar card
4) Refresh the page
5) Use the developer console to find the final redux state once the page
is finished loading
6) Inspect the states metrics.cardStateMap and ensure the pinned has an
entry there. **Note**: Pinned card ids always start with `"baseCardId"`

## Alternate designs / implementations considered

Author: rileyajones

tensorboard/webapp/metrics/store/metrics_reducers.ts

@@ -890,6 +890,13 @@ const reducer = createReducer(
           ...nextCardStateMap[cardId],
           dataMinMax: nextMinMax,
         };
+        const pinnedId = state.cardToPinnedCopy.get(cardId);
+        if (pinnedId) {
+          nextCardStateMap[pinnedId] = {
+            ...nextCardStateMap[pinnedId],
+            dataMinMax: nextMinMax,
+          };
+        }
       }
 
       const nextState: MetricsState = {

tensorboard/webapp/metrics/store/metrics_reducers_test.ts

@@ -1374,6 +1374,12 @@ describe('metrics reducers', () => {
             },
           },
         },
+        cardToPinnedCopy: new Map([
+          [
+            '{"plugin":"scalars","tag":"tagA","runId":null}',
+            'somePinnedCardId',
+          ],
+        ]),
       });
 
       const sample = 9;
@@ -1440,6 +1446,12 @@ describe('metrics reducers', () => {
             maxStep: 99,
           },
         },
+        somePinnedCardId: {
+          dataMinMax: {
+            minStep: 0,
+            maxStep: 99,
+          },
+        },
       };
       expect(nextState.cardStateMap).toEqual(expectedCardStateMap);
     });

tensorboard/webapp/metrics/store/metrics_selectors.ts

@@ -500,7 +500,11 @@ export const isMetricsSlideoutMenuOpen = createSelector(
 );
 
 /**
- * Gets the min and max step of a metrics card.
+ * Gets the min and max step visible in a metrics card.
+ * This value can either be the data min max or be overridden
+ * by a user min max.
+ *
+ * Note: userMinMax is not necessarily a subset of dataMinMax.
  */
 export const getMetricsCardMinMax = createSelector(
   getCardStateMap,
@@ -510,6 +514,16 @@ export const getMetricsCardMinMax = createSelector(
   }
 );
 
+/**
+ * Returns the min and max step found in the cards data.
+ */
+export const getMetricsCardDataMinMax = createSelector(
+  getCardStateMap,
+  (cardStateMap: CardStateMap, cardId: CardId): MinMaxStep | undefined => {
+    return cardStateMap[cardId]?.dataMinMax;
+  }
+);
+
 /**
  * Gets the time selection of a metrics card.
  */

tensorboard/webapp/metrics/store/metrics_selectors_test.ts

@@ -660,6 +660,57 @@ describe('metrics selectors', () => {
     });
   });
 
+  describe('getMetricsCardDataMinMax', () => {
+    it('returns undefined when cardStateMap is undefined', () => {
+      const state = appStateFromMetricsState(buildMetricsState({}));
+      expect(
+        selectors.getMetricsCardDataMinMax(state, 'card1')
+      ).toBeUndefined();
+    });
+
+    it('returns undefined when card has no cardState', () => {
+      const state1 = appStateFromMetricsState(
+        buildMetricsState({
+          cardStateMap: {},
+        })
+      );
+
+      const state2 = appStateFromMetricsState(
+        buildMetricsState({
+          cardStateMap: {
+            card1: {},
+          },
+        })
+      );
+
+      expect(
+        selectors.getMetricsCardDataMinMax(state1, 'card1')
+      ).toBeUndefined();
+      expect(
+        selectors.getMetricsCardDataMinMax(state2, 'card1')
+      ).toBeUndefined();
+    });
+
+    it('returns data cards minMax when defined', () => {
+      const state = appStateFromMetricsState(
+        buildMetricsState({
+          cardStateMap: {
+            card1: {
+              dataMinMax: {
+                minStep: 0,
+                maxStep: 100,
+              },
+            },
+          },
+        })
+      );
+      expect(selectors.getMetricsCardDataMinMax(state, 'card1')).toEqual({
+        minStep: 0,
+        maxStep: 100,
+      });
+    });
+  });
+
   describe('getPinnedCardsWithMetadata', () => {
     beforeEach(() => {
       selectors.getPinnedCardsWithMetadata.release();