github.com/tilt-dev/tilt@v0.33.15-0.20240515162809-0a22ed45d8a0/web/src/OverviewActionBar.stories.tsx (about)

     1  import { createMemoryHistory } from "history"
     2  import React from "react"
     3  import { Router } from "react-router"
     4  import { ButtonSet } from "./ApiButton"
     5  import { FilterLevel, FilterSource, useFilterSet } from "./logfilters"
     6  import OverviewActionBar from "./OverviewActionBar"
     7  import { TiltSnackbarProvider } from "./Snackbar"
     8  import { StarredResourceMemoryProvider } from "./StarredResourcesContext"
     9  import { disableButton, oneResource, oneUIButton } from "./testdata"
    10  
    11  export default {
    12    title: "New UI/Log View/OverviewActionBar",
    13    decorators: [
    14      (Story: any, context: any) => {
    15        let level = context?.args?.level || ""
    16        let source = context?.args?.source || ""
    17        let history = createMemoryHistory()
    18        history.location.search = `?level=${level}&source=${source}`
    19        return (
    20          <Router history={history}>
    21            <TiltSnackbarProvider>
    22              <StarredResourceMemoryProvider>
    23                <div style={{ margin: "-1rem", height: "80vh" }}>
    24                  <Story {...context.args} />
    25                </div>
    26              </StarredResourceMemoryProvider>
    27            </TiltSnackbarProvider>
    28          </Router>
    29        )
    30      },
    31    ],
    32    argTypes: {
    33      source: {
    34        name: "Source",
    35        control: {
    36          type: "select",
    37          options: [FilterSource.all, FilterSource.build, FilterSource.runtime],
    38        },
    39      },
    40      level: {
    41        name: "Level",
    42        control: {
    43          type: "select",
    44          options: [FilterLevel.all, FilterLevel.warn, FilterLevel.error],
    45        },
    46      },
    47    },
    48  }
    49  
    50  export const OverflowTextBar = () => {
    51    let filterSet = useFilterSet()
    52    let res = oneResource({
    53      isBuilding: true,
    54      name: "my-grafana-long-service-name-deadbeef",
    55      endpoints: 2,
    56    })
    57    return <OverviewActionBar resource={res} filterSet={filterSet} />
    58  }
    59  
    60  export const FullBar = () => {
    61    let filterSet = useFilterSet()
    62    let res = oneResource({ isBuilding: true, name: "my-deadbeef", endpoints: 2 })
    63    let buttons: ButtonSet = {
    64      default: [oneUIButton({ buttonName: "button2", componentID: "vigoda" })],
    65      toggleDisable: disableButton("vigoda", true),
    66    }
    67    return (
    68      <OverviewActionBar resource={res} filterSet={filterSet} buttons={buttons} />
    69    )
    70  }
    71  
    72  export const EmptyBar = () => {
    73    let filterSet = useFilterSet()
    74    let res = oneResource({ isBuilding: true, endpoints: 0 })
    75    res.status = res.status || {}
    76    res.status.k8sResourceInfo = {}
    77    return <OverviewActionBar resource={res} filterSet={filterSet} />
    78  }