[ui] Add another link from Events page to Partition > “View all event…

…s” modal (#20978)

## Summary & Motivation

Related: #20421

This adds another link to the Partition tab's "View Historical Events"
button to the individual event view. I think we need to re-think the
split between the partition-centric and event-centric pages and bring
partition filtering to the Events page, but until we're able to do that,
we need to make the existing modal easier to find.

Curious to get @braunjj's thoughts. We could also try to add a partition
filter to the events page, but I think right now we'd be limited to
choosing a single partition key.


![image](https://github.com/dagster-io/dagster/assets/1037212/c38b9b3d-b5e5-4b39-a675-21820aec5e57)

Co-authored-by: bengotow <[email protected]>

js_modules/dagster-ui/packages/ui-core/src/assets/AllIndividualEventsButton.tsx

@@ -23,6 +23,7 @@ import {
 } from './types/useRecentAssetEvents.types';
 import {Timestamp} from '../app/time/Timestamp';
 import {isHiddenAssetGroupJob} from '../asset-graph/Utils';
+import {useQueryPersistedState} from '../hooks/useQueryPersistedState';
 import {MetadataEntry} from '../metadata/MetadataEntry';
 import {PipelineReference} from '../pipelines/PipelineReference';
 import {RunStatusWithStats} from '../runs/RunStatusDots';
@@ -303,7 +304,11 @@ export const AllIndividualEventsButton = ({
   children: React.ReactNode;
   disabled?: boolean;
 }) => {
-  const [open, setOpen] = React.useState(false);
+  const [_open, setOpen] = useQueryPersistedState({
+    queryKey: 'showAllEvents',
+    decode: (qs) => (qs.showAllEvents === 'true' ? true : false),
+    encode: (b) => ({showAllEvents: b || undefined}),
+  });
   const [focused, setFocused] = React.useState<AssetEventGroup | undefined>();
   const groups = React.useMemo(
     () =>
@@ -315,6 +320,7 @@ export const AllIndividualEventsButton = ({
       })),
     [events],
   );
+
   const title = () => {
     if (hasPartitions && events[0]) {
       const partition = events[0].partition;
@@ -325,6 +331,8 @@ export const AllIndividualEventsButton = ({
     return `Materialization and observation events`;
   };
 
+  const open = _open && !disabled;
+
   return (
     <>
       <Button disabled={disabled} onClick={() => setOpen(true)}>

js_modules/dagster-ui/packages/ui-core/src/assets/AssetEventDetail.tsx

@@ -72,14 +72,25 @@ export const AssetEventDetail = ({
             {hidePartitionLinks ? (
               event.partition
             ) : (
-              <Link
-                to={assetDetailsPathForKey(assetKey, {
-                  view: 'partitions',
-                  partition: event.partition,
-                })}
-              >
-                {event.partition}
-              </Link>
+              <>
+                <Link
+                  to={assetDetailsPathForKey(assetKey, {
+                    view: 'partitions',
+                    partition: event.partition,
+                  })}
+                >
+                  {event.partition}
+                </Link>
+                <Link
+                  to={assetDetailsPathForKey(assetKey, {
+                    view: 'partitions',
+                    partition: event.partition,
+                    showAllEvents: true,
+                  })}
+                >
+                  View all partition events
+                </Link>
+              </>
             )}
           </Box>
         )}

js_modules/dagster-ui/packages/ui-core/src/assets/types.tsx

@@ -22,4 +22,5 @@ export interface AssetViewParams {
   checkDetail?: string;
   default_range?: string;
   column?: string;
+  showAllEvents?: boolean;
 }