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

     1  import React from "react"
     2  import { MemoryRouter } from "react-router"
     3  import HeaderBar, { HeaderBarPage } from "./HeaderBar"
     4  import {
     5    clusterConnection,
     6    nResourceView,
     7    tenResourceView,
     8    twoResourceView,
     9  } from "./testdata"
    10  import { UpdateStatus } from "./types"
    11  
    12  export default {
    13    title: "New UI/Shared/HeaderBar",
    14    decorators: [
    15      (Story: any) => (
    16        <MemoryRouter initialEntries={["/"]}>
    17          <div style={{ margin: "-1rem" }}>
    18            <Story />
    19          </div>
    20        </MemoryRouter>
    21      ),
    22    ],
    23  }
    24  
    25  export const TwoResources = () => (
    26    <HeaderBar
    27      view={twoResourceView()}
    28      currentPage={HeaderBarPage.Detail}
    29      isSocketConnected={true}
    30    />
    31  )
    32  
    33  export const TenResources = () => (
    34    <HeaderBar
    35      view={tenResourceView()}
    36      currentPage={HeaderBarPage.Detail}
    37      isSocketConnected={true}
    38    />
    39  )
    40  
    41  export const TenResourcesErrorsAndWarnings = () => {
    42    let view = tenResourceView() as any
    43    view.uiResources[0].status.updateStatus = UpdateStatus.Error
    44    view.uiResources[1].status.buildHistory[0].warnings = ["warning time"]
    45    view.uiResources[5].status.updateStatus = UpdateStatus.Error
    46    return (
    47      <HeaderBar
    48        view={view}
    49        currentPage={HeaderBarPage.Grid}
    50        isSocketConnected={true}
    51      />
    52    )
    53  }
    54  
    55  export const OneHundredResources = () => (
    56    <HeaderBar
    57      view={nResourceView(100)}
    58      currentPage={HeaderBarPage.Grid}
    59      isSocketConnected={true}
    60    />
    61  )
    62  
    63  export const UpgradeAvailable = () => {
    64    let view = twoResourceView()
    65    let status = view.uiSession!.status
    66    status!.suggestedTiltVersion = "0.18.1"
    67    status!.runningTiltBuild = { version: "0.18.0", dev: false }
    68    status!.versionSettings = { checkUpdates: true }
    69    return (
    70      <HeaderBar
    71        view={view}
    72        currentPage={HeaderBarPage.Detail}
    73        isSocketConnected={true}
    74      />
    75    )
    76  }
    77  
    78  export const HealthyClusterConnection = () => {
    79    const view = nResourceView(5)
    80    const k8sConnection = clusterConnection()
    81    view.clusters = [k8sConnection]
    82  
    83    return (
    84      <HeaderBar
    85        view={view}
    86        currentPage={HeaderBarPage.Detail}
    87        isSocketConnected={true}
    88      />
    89    )
    90  }
    91  
    92  export const UnhealthyClusterConnection = () => {
    93    const view = nResourceView(5)
    94    const k8sConnection = clusterConnection(
    95      'Get "https://kubernetes.docker.internal:6443/version?timeout=32s": dial tcp 127.0.0.1:6443: connect: connection refused'
    96    )
    97    view.clusters = [k8sConnection]
    98  
    99    return (
   100      <HeaderBar
   101        view={view}
   102        currentPage={HeaderBarPage.Detail}
   103        isSocketConnected={true}
   104      />
   105    )
   106  }