Add condition for showing quick start carousel (#1278)

* Add condition for showing quick start carousel

* Show coach mark when carousel is closed

* Add condition for showing quick start carousel and other UI changes

* Fix compile error

* Fix issue with coach mark

* Fix test

* Add new sample data, fix link url, fix e2e tests

* Fix e2e tests

src/hooks/useCarousel.ts

@@ -0,0 +1,15 @@
+import create, { UseStore } from "zustand";
+
+interface CarouselState {
+  shouldOpen: boolean;
+  showCoachMark: boolean;
+  setShouldOpen: (shouldOpen: boolean) => void;
+  setShowCoachMark: (showCoachMark: boolean) => void;
+}
+
+export const useCarousel: UseStore<CarouselState> = create((set) => ({
+  shouldOpen: false,
+  showCoachMark: false,
+  setShouldOpen: (shouldOpen: boolean) => set({ shouldOpen }),
+  setShowCoachMark: (showCoachMark: boolean) => set({ showCoachMark }),
+}));

src/hooks/useTeachingBubble.ts

@@ -1,19 +1,24 @@
+import { Collection } from "Contracts/ViewModels";
 import create, { UseStore } from "zustand";
 
 interface TeachingBubbleState {
   step: number;
   isSampleDBExpanded: boolean;
   isDocumentsTabOpened: boolean;
+  sampleCollection: Collection;
   setStep: (step: number) => void;
   setIsSampleDBExpanded: (isReady: boolean) => void;
   setIsDocumentsTabOpened: (isOpened: boolean) => void;
+  setSampleCollection: (sampleCollection: Collection) => void;
 }
 
 export const useTeachingBubble: UseStore<TeachingBubbleState> = create((set) => ({
   step: 1,
   isSampleDBExpanded: false,
   isDocumentsTabOpened: false,
+  sampleCollection: undefined,
   setStep: (step: number) => set({ step }),
   setIsSampleDBExpanded: (isSampleDBExpanded: boolean) => set({ isSampleDBExpanded }),
   setIsDocumentsTabOpened: (isDocumentsTabOpened: boolean) => set({ isDocumentsTabOpened }),
+  setSampleCollection: (sampleCollection: Collection) => set({ sampleCollection }),
 }));