github.com/tilt-dev/tilt@v0.36.0/web/src/OverviewActionBar.stories.tsx (about)

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