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