status checkbox on init

Author: jschuler

packages/dev/package.json

@@ -9,7 +9,7 @@
     "serve": "serve public"
   },
   "dependencies": {
-    "@patternfly/quickstarts": "1.0.0-rc.15",
+    "@patternfly/quickstarts": "1.0.0-rc.16",
     "@patternfly/react-core": "^4.101.3",
     "asciidoctor": "^2.2.1",
     "react": "^16.14.0",

packages/dev/src/App.tsx

@@ -53,16 +53,11 @@ const App: React.FC<AppProps> = ({ children, showCardFooters }) => {
     console.log(allQuickStartStates);
   }, [allQuickStartStates]);
 
-  const [
-    allQuickStartsLoaded,
-    setAllQuickStartsLoaded,
-  ] = React.useState<boolean>(false);
   const [allQuickStarts, setAllQuickStarts] = React.useState<QuickStart[]>([]);
   React.useEffect(() => {
     const load = async () => {
       const masGuidesQuickstarts = await loadJSONQuickStarts("");
       setAllQuickStarts(yamlQuickStarts.concat(masGuidesQuickstarts));
-      setAllQuickStartsLoaded(true);
     };
     load();
   }, []);
@@ -131,15 +126,13 @@ const App: React.FC<AppProps> = ({ children, showCardFooters }) => {
 
   return (
     <React.Suspense fallback={<LoadingBox />}>
-      {allQuickStartsLoaded && (
-        <QuickStartContextProvider value={valuesForQuickstartContext}>
-          <QuickStartDrawer>
-             <Page header={AppHeader} sidebar={AppSidebar} isManagedSidebar>
-              {children}
-             </Page>
-           </QuickStartDrawer>
-        </QuickStartContextProvider>
-      )}
+      {allQuickStarts && allQuickStarts.length && <QuickStartContextProvider value={valuesForQuickstartContext}>
+        <QuickStartDrawer>
+            <Page header={AppHeader} sidebar={AppSidebar} isManagedSidebar>
+            {children}
+            </Page>
+          </QuickStartDrawer>
+      </QuickStartContextProvider>}
     </React.Suspense>
   );
 };

packages/module/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/quickstarts",
-  "version": "1.0.0-rc.15",
+  "version": "1.0.0-rc.16",
   "description": "PatternFly quick starts",
   "files": [
     "dist"

packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx

@@ -163,15 +163,15 @@ export const QuickStartCatalogFilterStatusWrapper: React.FC<QuickStartCatalogFil
   );
 
   const dropdownItems = Object.entries(filter.status.statusTypes).map(([key, val]) => (
-    <SelectOption key={key} data-key={key} value={val} />
+    <SelectOption key={key} data-key={key} value={key}>{val}</SelectOption>
   ));
 
   return (
     <QuickStartCatalogFilterSelect
       isDropdownOpen={isDropdownOpen}
       setIsDropdownOpen={setIsDropdownOpen}
       onRowfilterSelect={onRowfilterSelect}
-      selectedFilters={filter.status.selectedFilters}
+      selectedFilters={filter.status.statusFilters}
       dropdownItems={dropdownItems}
     />
   );

packages/module/src/utils/quick-start-context.tsx

@@ -52,7 +52,6 @@ export type QuickStartContextValues = {
     status?: {
       statusTypes?: any;
       statusFilters?: any;
-      selectedFilters?: any;
     }
   }
   setFilter?: any;
@@ -124,9 +123,6 @@ export const QuickStartContextProvider: React.FC<{
     [QuickStartStatus.NOT_STARTED]: findResource('Not started ({{statusCount, number}})').replace('{{statusCount, number}}', quickStartStatusCount[QuickStartStatus.NOT_STARTED]),
   });
   const [statusFilters, setStatusFilters] = React.useState<string[]>(initialStatusFilters);
-  const [selectedFilters, setSelectedFilters] = React.useState<string[]>(
-    initialStatusFilters.map((filter) => statusTypes[filter]),
-  );
 
   const [filterKeyword, setFilterKeyword] = React.useState(initialSearchQuery);
 
@@ -135,7 +131,6 @@ export const QuickStartContextProvider: React.FC<{
       setFilterKeyword(value);
     } else if (type === 'status') {
       setStatusFilters(value);
-      setSelectedFilters(value.map((filterKey) => statusTypes[filterKey]));
     }
   };
 
@@ -362,7 +357,6 @@ export const QuickStartContextProvider: React.FC<{
       status: {
         statusTypes,
         statusFilters,
-        selectedFilters,
       }
     },
     setFilter,