feat(dashboard): Workflow executions (#6564)

**What**
- v1 of executions domain

**TODO in follow up PR**
I think it might be a good idea for Carlos or Adrien to go over the design with Ludvig, and make sure we are displaying what is relevant to developers, and how things should be displayed. So this PR is just the initial implementation, and does not handle displaying things like compensation steps (not part of the current design), step input (not supported by the API but part of the design), etc.

Closes CORE-1751, CORE-1755

packages/design-system/ui/package.json

@@ -105,6 +105,7 @@
     "cva": "1.0.0-beta.1",
     "date-fns": "^2.30.0",
     "prism-react-renderer": "^2.0.6",
+    "prismjs": "^1.29.0",
     "react-currency-input-field": "^3.6.11",
     "react-day-picker": "^8.8.0",
     "tailwind-merge": "^2.2.1"

packages/design-system/ui/src/components/code-block/code-block.tsx

@@ -1,6 +1,10 @@
 "use client"
-import { Highlight, themes } from "prism-react-renderer"
+import { Highlight, Prism, themes } from "prism-react-renderer"
 import * as React from "react"
+;(typeof global !== "undefined" ? global : window).Prism = Prism
+
+// @ts-ignore
+import("prismjs/components/prism-json")
 
 import { Copy } from "@/components/copy"
 import { clx } from "@/utils/clx"
@@ -215,6 +219,12 @@ const Body = ({
                   color: "rgb(247,208,25)",
                 },
               },
+              {
+                types: ["property"],
+                style: {
+                  color: "rgb(247,208,25)",
+                },
+              },
               {
                 types: ["maybe-class-name"],
                 style: {
@@ -230,7 +240,7 @@ const Body = ({
               {
                 types: ["comment"],
                 style: {
-                  color: "rgb(52,211,153)",
+                  color: "var(--code-fg-subtle)",
                 },
               },
             ],