web: add missing dependency for ApiButton stories and correct data fo…

…rmat for memo use in Sidebar (#5216)

web/src/ApiButton.stories.tsx

@@ -4,6 +4,7 @@ import styled from "styled-components"
 import { ApiButton } from "./ApiButton"
 import { makeUIButton, textField } from "./ApiButton.testhelpers"
 import { OverviewButtonMixin } from "./OverviewButton"
+import { TiltSnackbarProvider } from "./Snackbar"
 
 type UIButton = Proto.v1alpha1UIButton
 type UIInputSpec = Proto.v1alpha1UIInputSpec
@@ -15,9 +16,11 @@ export default {
   decorators: [
     (Story: any) => (
       <MemoryRouter initialEntries={["/"]}>
-        <div style={{ margin: "-1rem" }}>
-          <Story />
-        </div>
+        <TiltSnackbarProvider>
+          <div style={{ margin: "-1rem" }}>
+            <Story />
+          </div>
+        </TiltSnackbarProvider>
       </MemoryRouter>
     ),
   ],

web/src/SidebarResources.tsx

@@ -169,7 +169,7 @@ export function SidebarListSection(props: SidebarSectionProps): JSX.Element {
     })
 
     return [enabledItems, disabledItems]
-  }, props.items)
+  }, [props.items])
 
   // The title for the disabled resource list is semantically important,
   // but should only be visible when there's no filter term