diff --git a/teachertool/src/App.tsx b/teachertool/src/App.tsx
index 4973715e2cf8..13a9b3bf4391 100644
--- a/teachertool/src/App.tsx
+++ b/teachertool/src/App.tsx
@@ -8,7 +8,6 @@ import { logDebug } from "./services/loggingService";
 import { HeaderBar } from "./components/HeaderBar";
 import { MainPanel } from "./components/MainPanel";
 import { Toasts } from "./components/Toasts";
-import { CatalogModal } from "./components/CatalogModal";
 import { showToast } from "./transforms/showToast";
 import { loadCatalogAsync } from "./transforms/loadCatalogAsync";
 import { loadValidatorPlansAsync } from "./transforms/loadValidatorPlansAsync";
@@ -16,6 +15,7 @@ import { tryLoadLastActiveRubricAsync } from "./transforms/tryLoadLastActiveRubr
 import { ImportRubricModal } from "./components/ImportRubricModal";
 import { ConfirmationModal } from "./components/ConfirmationModal";
 import { BlockPickerModal } from "./components/BlockPickerModal";
+import { ScreenReaderAnnouncer } from "./components/ScreenReaderAnnouncer";
 
 export const App = () => {
     const { state, dispatch } = useContext(AppStateContext);
@@ -57,11 +57,11 @@ export const App = () => {
         <>
             <HeaderBar />
             <MainPanel />
-            <CatalogModal />
             <ImportRubricModal />
             <ConfirmationModal />
             <BlockPickerModal />
             <Toasts />
+            <ScreenReaderAnnouncer />
         </>
     );
 };
diff --git a/teachertool/src/components/AddCriteriaButton.tsx b/teachertool/src/components/AddCriteriaButton.tsx
index 8e3935c20876..35667262bff9 100644
--- a/teachertool/src/components/AddCriteriaButton.tsx
+++ b/teachertool/src/components/AddCriteriaButton.tsx
@@ -1,29 +1,22 @@
-import { getSelectableCatalogCriteria } from "../state/helpers";
 import { Button } from "react-common/components/controls/Button";
-import { showModal } from "../transforms/showModal";
 import { AppStateContext } from "../state/appStateContext";
-import { useContext, useMemo } from "react";
+import { useContext } from "react";
 import { classList } from "react-common/components/util";
 import { Strings } from "../constants";
-import { CatalogDisplayOptions } from "../types/modalOptions";
+import { setCatalogOpen } from "../transforms/setCatalogOpen";
 
 interface IProps {}
 
 export const AddCriteriaButton: React.FC<IProps> = ({}) => {
     const { state: teacherTool } = useContext(AppStateContext);
 
-    const hasAvailableCriteria = useMemo<boolean>(
-        () => getSelectableCatalogCriteria(teacherTool).length > 0,
-        [teacherTool.catalog, teacherTool.rubric]
-    );
-    return (
+    return !teacherTool.catalogOpen ? (
         <Button
             className={classList("inline", "outline-button")}
             label={Strings.AddCriteria}
-            onClick={() => showModal({ modal: "catalog-display" } as CatalogDisplayOptions)}
+            onClick={() => setCatalogOpen(true)}
             title={Strings.AddCriteria}
             leftIcon="fas fa-plus-circle"
-            disabled={!hasAvailableCriteria}
         />
-    );
+    ) : null;
 };
diff --git a/teachertool/src/components/CatalogModal.tsx b/teachertool/src/components/CatalogModal.tsx
deleted file mode 100644
index c755d1e5f8eb..000000000000
--- a/teachertool/src/components/CatalogModal.tsx
+++ /dev/null
@@ -1,85 +0,0 @@
-import { useContext, useMemo, useState } from "react";
-import { AppStateContext } from "../state/appStateContext";
-import { Checkbox } from "react-common/components/controls/Checkbox";
-import { Modal } from "react-common/components/controls/Modal";
-import { hideModal } from "../transforms/hideModal";
-import { addCriteriaToRubric } from "../transforms/addCriteriaToRubric";
-import { CatalogCriteria } from "../types/criteria";
-import { getSelectableCatalogCriteria } from "../state/helpers";
-import { ReadOnlyCriteriaDisplay } from "./ReadonlyCriteriaDisplay";
-import { Strings } from "../constants";
-import css from "./styling/CatalogModal.module.scss";
-
-interface CatalogModalProps {}
-export const CatalogModal: React.FC<CatalogModalProps> = ({}) => {
-    const { state: teacherTool } = useContext(AppStateContext);
-    const [checkedCriteriaIds, setCheckedCriteria] = useState<Set<string>>(new Set<string>());
-
-    const selectableCriteria = useMemo<CatalogCriteria[]>(
-        () => getSelectableCatalogCriteria(teacherTool),
-        [teacherTool.catalog, teacherTool.rubric]
-    );
-
-    function handleCriteriaSelectedChange(criteria: CatalogCriteria, newValue: boolean) {
-        const newSet = new Set(checkedCriteriaIds);
-        if (newValue) {
-            newSet.add(criteria.id);
-        } else {
-            newSet.delete(criteria.id); // Returns false if criteria.id is not in the set, can be safely ignored.
-        }
-        setCheckedCriteria(newSet);
-    }
-
-    function isCriteriaSelected(criteriaId: string): boolean {
-        return checkedCriteriaIds.has(criteriaId);
-    }
-
-    function handleAddSelectedClicked() {
-        addCriteriaToRubric([...checkedCriteriaIds]);
-        closeModal();
-    }
-
-    function closeModal() {
-        hideModal();
-
-        // Clear for next open.
-        setCheckedCriteria(new Set<string>());
-    }
-
-    const modalActions = [
-        {
-            label: Strings.Cancel,
-            className: "secondary",
-            onClick: closeModal,
-        },
-        {
-            label: Strings.AddSelected,
-            className: "primary",
-            onClick: handleAddSelectedClicked,
-        },
-    ];
-
-    return teacherTool.modalOptions?.modal === "catalog-display" ? (
-        <Modal
-            className={css["catalog-modal"]}
-            title={lf("Select the criteria you'd like to include")}
-            onClose={closeModal}
-            actions={modalActions}
-        >
-            {selectableCriteria.map(criteria => {
-                return (
-                    criteria?.template && (
-                        <Checkbox
-                            id={`checkbox_${criteria.id}`}
-                            key={criteria.id}
-                            className={css["catalog-item"]}
-                            label={<ReadOnlyCriteriaDisplay catalogCriteria={criteria} showDescription={true} />}
-                            onChange={newValue => handleCriteriaSelectedChange(criteria, newValue)}
-                            isChecked={isCriteriaSelected(criteria.id)}
-                        />
-                    )
-                );
-            })}
-        </Modal>
-    ) : null;
-};
diff --git a/teachertool/src/components/CatalogOverlay.tsx b/teachertool/src/components/CatalogOverlay.tsx
new file mode 100644
index 000000000000..42ddb777be61
--- /dev/null
+++ b/teachertool/src/components/CatalogOverlay.tsx
@@ -0,0 +1,166 @@
+import { useContext, useMemo, useState } from "react";
+import { AppStateContext } from "../state/appStateContext";
+import { addCriteriaToRubric } from "../transforms/addCriteriaToRubric";
+import { CatalogCriteria } from "../types/criteria";
+import { getCatalogCriteria } from "../state/helpers";
+import { ReadOnlyCriteriaDisplay } from "./ReadonlyCriteriaDisplay";
+import { Strings } from "../constants";
+import { Button } from "react-common/components/controls/Button";
+import { getReadableCriteriaTemplate, makeToast } from "../utils";
+import { setCatalogOpen } from "../transforms/setCatalogOpen";
+import { classList } from "react-common/components/util";
+import { announceToScreenReader } from "../transforms/announceToScreenReader";
+import { FocusTrap } from "react-common/components/controls/FocusTrap";
+import css from "./styling/CatalogOverlay.module.scss";
+
+interface CatalogHeaderProps {
+    onClose: () => void;
+}
+const CatalogHeader: React.FC<CatalogHeaderProps> = ({ onClose }) => {
+    return (
+        <div className={css["header"]}>
+            <span className={css["title"]}>{Strings.SelectCriteriaDescription}</span>
+            <Button
+                className={css["close-button"]}
+                rightIcon="fas fa-times-circle"
+                onClick={onClose}
+                title={Strings.Close}
+            />
+        </div>
+    );
+};
+
+interface CatalogItemLabelProps {
+    catalogCriteria: CatalogCriteria;
+    allowsMultiple: boolean;
+    existingInstanceCount: number;
+    recentlyAdded: boolean;
+}
+const CatalogItemLabel: React.FC<CatalogItemLabelProps> = ({
+    catalogCriteria,
+    allowsMultiple,
+    existingInstanceCount,
+    recentlyAdded,
+}) => {
+    const canAddMore = allowsMultiple || existingInstanceCount === 0;
+    const showRecentlyAddedIndicator = recentlyAdded && canAddMore;
+    return (
+        <div className={css["catalog-item-label"]}>
+            <div className={css["action-indicators"]}>
+                {canAddMore ? (
+                    <>
+                        <i
+                            className={classList(
+                                "fas fa-check",
+                                css["recently-added-indicator"],
+                                showRecentlyAddedIndicator ? undefined : css["hide-indicator"]
+                            )}
+                            title={lf("Added!")}
+                        />
+                        <i
+                            className={classList(
+                                "fas fa-plus",
+                                showRecentlyAddedIndicator ? css["hide-indicator"] : undefined
+                            )}
+                            title={Strings.AddToChecklist}
+                        />
+                    </>
+                ) : (
+                    <span className={css["max-label"]}>{Strings.Max}</span>
+                )}
+            </div>
+            <ReadOnlyCriteriaDisplay catalogCriteria={catalogCriteria} showDescription={true} />
+        </div>
+    );
+};
+
+const CatalogList: React.FC = () => {
+    const { state: teacherTool } = useContext(AppStateContext);
+
+    const recentlyAddedWindowMs = 500;
+    const [recentlyAddedIds, setRecentlyAddedIds] = useState<pxsim.Map<NodeJS.Timeout>>({});
+
+    const criteria = useMemo<CatalogCriteria[]>(
+        () => getCatalogCriteria(teacherTool),
+        [teacherTool.catalog, teacherTool.rubric]
+    );
+
+    function updateRecentlyAddedValue(id: string, value: NodeJS.Timeout | undefined) {
+        setRecentlyAddedIds(prevState => {
+            const newState = { ...prevState };
+            if (value) {
+                newState[id] = value;
+            } else {
+                delete newState[id];
+            }
+            return newState;
+        });
+    }
+
+    function onItemClicked(c: CatalogCriteria) {
+        addCriteriaToRubric([c.id]);
+
+        // Set a timeout to remove the recently added indicator
+        // and save it in the state.
+        if (recentlyAddedIds[c.id]) {
+            clearTimeout(recentlyAddedIds[c.id]);
+        }
+        const timeoutId = setTimeout(() => {
+            updateRecentlyAddedValue(c.id, undefined);
+        }, recentlyAddedWindowMs);
+        updateRecentlyAddedValue(c.id, timeoutId);
+
+        announceToScreenReader(lf("Added '{0}' to checklist.", getReadableCriteriaTemplate(c)));
+    }
+
+    return (
+        <div className={css["catalog-list"]}>
+            {criteria.map(c => {
+                const allowsMultiple = c.params !== undefined && c.params.length !== 0; // TODO add a json flag for this (MaxCount or AllowMultiple)
+                const existingInstanceCount = teacherTool.rubric.criteria.filter(
+                    i => i.catalogCriteriaId === c.id
+                ).length;
+                return (
+                    c.template && (
+                        <Button
+                            id={`criteria_${c.id}`}
+                            title={getReadableCriteriaTemplate(c)}
+                            key={c.id}
+                            className={css["catalog-item"]}
+                            label={
+                                <CatalogItemLabel
+                                    catalogCriteria={c}
+                                    allowsMultiple={allowsMultiple}
+                                    existingInstanceCount={existingInstanceCount}
+                                    recentlyAdded={recentlyAddedIds[c.id] !== undefined}
+                                />
+                            }
+                            onClick={() => onItemClicked(c)}
+                            disabled={!allowsMultiple && existingInstanceCount > 0}
+                        />
+                    )
+                );
+            })}
+        </div>
+    );
+};
+
+interface CatalogOverlayProps {}
+export const CatalogOverlay: React.FC<CatalogOverlayProps> = ({}) => {
+    const { state: teacherTool } = useContext(AppStateContext);
+
+    function closeOverlay() {
+        setCatalogOpen(false);
+    }
+
+    return teacherTool.catalogOpen ? (
+        <FocusTrap onEscape={() => {}}>
+            <div className={css["catalog-overlay"]}>
+                <div className={css["catalog-content-container"]}>
+                    <CatalogHeader onClose={closeOverlay} />
+                    <CatalogList />
+                </div>
+            </div>
+        </FocusTrap>
+    ) : null;
+};
diff --git a/teachertool/src/components/ProjectWorkspace.tsx b/teachertool/src/components/ProjectWorkspace.tsx
index b694b7617db2..62fbfc3e7426 100644
--- a/teachertool/src/components/ProjectWorkspace.tsx
+++ b/teachertool/src/components/ProjectWorkspace.tsx
@@ -6,6 +6,7 @@ import { getSafeProjectName } from "../state/helpers";
 import { Toolbar } from "./Toolbar";
 import { ShareLinkInput } from "./ShareLinkInput";
 import { MakeCodeFrame } from "./MakecodeFrame";
+import { CatalogOverlay } from "./CatalogOverlay";
 
 const ProjectName: React.FC = () => {
     const { state: teacherTool } = useContext(AppStateContext);
@@ -16,6 +17,7 @@ const ProjectName: React.FC = () => {
 export const ProjectWorkspace: React.FC = () => {
     return (
         <div className={css.panel}>
+            <CatalogOverlay />
             <Toolbar center={<ProjectName />} />
             <ShareLinkInput />
             <MakeCodeFrame />
diff --git a/teachertool/src/components/ScreenReaderAnnouncer.tsx b/teachertool/src/components/ScreenReaderAnnouncer.tsx
new file mode 100644
index 000000000000..2ac53aba18ba
--- /dev/null
+++ b/teachertool/src/components/ScreenReaderAnnouncer.tsx
@@ -0,0 +1,17 @@
+import { useContext } from "react";
+import { AppStateContext } from "../state/appStateContext";
+import css from "./styling/ActionAnnouncer.module.scss";
+
+export interface ScreenReaderAnnouncerProps {}
+export const ScreenReaderAnnouncer: React.FC<ScreenReaderAnnouncerProps> = () => {
+    const { state: teacherTool } = useContext(AppStateContext);
+    return (
+        <>
+            {teacherTool.screenReaderAnnouncement && (
+                <div className={css["sr-only"]} aria-live="polite">
+                    {teacherTool.screenReaderAnnouncement}
+                </div>
+            )}
+        </>
+    );
+};
diff --git a/teachertool/src/components/styling/ActionAnnouncer.module.scss b/teachertool/src/components/styling/ActionAnnouncer.module.scss
new file mode 100644
index 000000000000..dd16f6f581fa
--- /dev/null
+++ b/teachertool/src/components/styling/ActionAnnouncer.module.scss
@@ -0,0 +1,13 @@
+// Hide content but keep component around for screen readers
+.sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    border: 0;
+    white-space: nowrap;
+    border-width: 0;
+}
diff --git a/teachertool/src/components/styling/CatalogModal.module.scss b/teachertool/src/components/styling/CatalogModal.module.scss
deleted file mode 100644
index 929ac1138c79..000000000000
--- a/teachertool/src/components/styling/CatalogModal.module.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-.catalog-modal {
-    div[class*="common-modal-footer"] {
-        display: flex;
-        justify-content: flex-end;
-    }
-
-    .catalog-done {
-        align-self: flex-end;
-    }
-
-    .catalog-item {
-        padding: 0.5rem;
-    }
-}
diff --git a/teachertool/src/components/styling/CatalogOverlay.module.scss b/teachertool/src/components/styling/CatalogOverlay.module.scss
new file mode 100644
index 000000000000..94c1db07038b
--- /dev/null
+++ b/teachertool/src/components/styling/CatalogOverlay.module.scss
@@ -0,0 +1,103 @@
+.catalog-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 49; // Above everything except toasts
+    background-color: rgba(0, 0, 0, 0.5);
+
+    color: var(--pxt-page-foreground);
+
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    .catalog-content-container {
+        max-width: 95%;
+        max-height: 95%;
+        background-color: var(--pxt-page-background);
+        border-radius: .285rem; // Match modal
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+
+        .header {
+            display: flex;
+            flex-direction: row;
+            justify-content: space-between;
+            align-items: center;
+            width: 100%;
+            border-bottom: 1px solid var(--pxt-content-accent);
+            height: 4rem;
+
+            .title {
+                font-size: 1.2rem;
+                font-weight: 800;
+                padding: 1rem;
+            }
+
+            .close-button {
+                height: 100%;
+                padding: 0 1rem;
+
+                i {
+                    font-size: 1.3rem;
+                    transition: scale 0.1s ease-in-out;
+                }
+
+                &:hover i {
+                    scale: 1.1;
+                }
+            }
+        }
+
+        .catalog-list {
+            overflow-y: auto;
+            display: flex;
+            flex-direction: column;
+            width: 100%;
+
+            .catalog-item {
+                width: 100%;
+                padding: 1.25rem 1.5rem 1.25rem 1rem;
+                border-bottom: 1px solid var(--pxt-content-accent);
+                flex-shrink: 0;
+                margin: 0;
+
+                &:last-child {
+                    border-bottom: none;
+                }
+
+                .catalog-item-label {
+                    display: flex;
+                    flex-direction: row;
+                    align-items: stretch;
+
+                    .action-indicators {
+                        position: relative;
+                        padding: 0 1rem 0 0;
+                        width: 3rem;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        flex-shrink: 0;
+
+                        i {
+                            position: absolute;
+                            transition: opacity 0.1s ease-in-out;
+                        }
+
+                        .hide-indicator {
+                            opacity: 0;
+                        }
+
+                        .recently-added-indicator {
+                            color: var(--pxt-success-accent);
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/teachertool/src/components/styling/ProjectWorkspace.module.scss b/teachertool/src/components/styling/ProjectWorkspace.module.scss
index 1392fa500b85..620eafb83724 100644
--- a/teachertool/src/components/styling/ProjectWorkspace.module.scss
+++ b/teachertool/src/components/styling/ProjectWorkspace.module.scss
@@ -4,6 +4,7 @@
     display: flex;
     flex-direction: column;
     background-color: var(--pxt-headerbar-accent-smoke);
+    position: relative;
 
     .projectName {
         height: 100%;
diff --git a/teachertool/src/components/styling/ReadonlyCriteriaDisplay.module.scss b/teachertool/src/components/styling/ReadonlyCriteriaDisplay.module.scss
index 43f727415a11..6cef3907b25c 100644
--- a/teachertool/src/components/styling/ReadonlyCriteriaDisplay.module.scss
+++ b/teachertool/src/components/styling/ReadonlyCriteriaDisplay.module.scss
@@ -4,11 +4,15 @@
     align-items: flex-start;
 
     .criteria-template {
+        margin-bottom: 0.4rem;
+
         .plain-text-segment {
+            display: inline-block;
             margin-right: 0.3rem;
         }
 
         .param-segment {
+            display: inline-block;
             border-radius: 0.5rem;
             border: 1px solid var(--pxt-page-foreground);
             padding: 0.2rem 0.5rem;
diff --git a/teachertool/src/constants.ts b/teachertool/src/constants.ts
index 484d31f41527..4cf131add02f 100644
--- a/teachertool/src/constants.ts
+++ b/teachertool/src/constants.ts
@@ -26,6 +26,10 @@ export namespace Strings {
     export const AddSelected = lf("Add Selected");
     export const Continue = lf("Continue");
     export const Loading = lf("Loading...");
+    export const Close = lf("Close");
+    export const Max = lf("Max");
+    export const AddToChecklist = lf("Add to Checklist");
+    export const SelectCriteriaDescription = lf("Select the criteria you'd like to include");
 }
 
 export namespace Ticks {
diff --git a/teachertool/src/services/loggingService.ts b/teachertool/src/services/loggingService.ts
index 4a969408b661..91540961d4f1 100644
--- a/teachertool/src/services/loggingService.ts
+++ b/teachertool/src/services/loggingService.ts
@@ -37,4 +37,3 @@ export const logDebug = (message: any, data?: any) => {
         console.log(timestamp(), message, data);
     }
 };
-
diff --git a/teachertool/src/state/actions.ts b/teachertool/src/state/actions.ts
index 8e0be1f69ddb..cd3cc472f9e1 100644
--- a/teachertool/src/state/actions.ts
+++ b/teachertool/src/state/actions.ts
@@ -51,6 +51,11 @@ type SetCatalog = ActionBase & {
     catalog: CatalogCriteria[] | undefined;
 };
 
+type SetCatalogOpen = ActionBase & {
+    type: "SET_CATALOG_OPEN";
+    open: boolean;
+};
+
 type SetRubric = ActionBase & {
     type: "SET_RUBRIC";
     rubric: Rubric;
@@ -100,6 +105,11 @@ type SetBlockImageUri = ActionBase & {
     imageUri: string;
 };
 
+type SetScreenReaderAnnouncement = ActionBase & {
+    type: "SET_SCREEN_READER_ANNOUNCEMENT";
+    announcement: string;
+};
+
 /**
  * Union of all actions
  */
@@ -115,6 +125,7 @@ export type Action =
     | SetEvalResultsBatch
     | SetTargetConfig
     | SetCatalog
+    | SetCatalogOpen
     | SetRubric
     | ShowModal
     | HideModal
@@ -122,7 +133,8 @@ export type Action =
     | SetActiveTab
     | SetAutorun
     | SetToolboxCategories
-    | SetBlockImageUri;
+    | SetBlockImageUri
+    | SetScreenReaderAnnouncement;
 
 /**
  * Action creators
@@ -167,6 +179,11 @@ const setCatalog = (catalog: CatalogCriteria[] | undefined): SetCatalog => ({
     catalog,
 });
 
+const setCatalogOpen = (open: boolean): SetCatalogOpen => ({
+    type: "SET_CATALOG_OPEN",
+    open,
+});
+
 const setRubric = (rubric: Rubric): SetRubric => ({
     type: "SET_RUBRIC",
     rubric,
@@ -216,6 +233,11 @@ const setBlockImageUri = (blockId: string, imageUri: string): SetBlockImageUri =
     imageUri,
 });
 
+const setScreenReaderAnnouncement = (announcement: string): SetScreenReaderAnnouncement => ({
+    type: "SET_SCREEN_READER_ANNOUNCEMENT",
+    announcement,
+});
+
 export {
     showToast,
     dismissToast,
@@ -227,6 +249,7 @@ export {
     setEvalResultsBatch,
     setTargetConfig,
     setCatalog,
+    setCatalogOpen,
     setRubric,
     showModal,
     hideModal,
@@ -235,4 +258,5 @@ export {
     setAutorun,
     setToolboxCategories,
     setBlockImageUri,
+    setScreenReaderAnnouncement,
 };
diff --git a/teachertool/src/state/helpers.ts b/teachertool/src/state/helpers.ts
index 8988cded86b5..04d96f8e5766 100644
--- a/teachertool/src/state/helpers.ts
+++ b/teachertool/src/state/helpers.ts
@@ -75,17 +75,15 @@ export function getSafeRubricName(state: AppState): string | undefined {
     return state.rubric.name || Strings.UntitledRubric;
 }
 
-export function getSelectableCatalogCriteria(state: AppState): CatalogCriteria[] {
-    const usedCatalogCriteria = state.rubric.criteria.map(c => c.catalogCriteriaId) ?? [];
+export function getCatalogCriteria(state: AppState): CatalogCriteria[] {
+    return state.catalog?.filter(c => !c.hideInCatalog) ?? [];
+}
 
+export function criteriaIsSelectable(state: AppState, catalogCriteria: CatalogCriteria): boolean {
     // Return a criteria as selectable if it has parameters (so it can be used multiple times in a rubric)
     // or if it has not yet been used in the active rubric.
     return (
-        state.catalog?.filter(
-            catalogCriteria =>
-                ((catalogCriteria.params && catalogCriteria.params.length > 0) ||
-                    !usedCatalogCriteria.includes(catalogCriteria.id)) &&
-                !catalogCriteria.hideInCatalog
-        ) ?? []
+        (catalogCriteria.params && catalogCriteria.params.length > 0) ||
+        !state.rubric.criteria.some(c => c.catalogCriteriaId === catalogCriteria.id)
     );
 }
diff --git a/teachertool/src/state/reducer.ts b/teachertool/src/state/reducer.ts
index a1df05ebb446..d260aa14a8ab 100644
--- a/teachertool/src/state/reducer.ts
+++ b/teachertool/src/state/reducer.ts
@@ -76,6 +76,12 @@ export default function reducer(state: AppState, action: Action): AppState {
                 catalog: action.catalog,
             };
         }
+        case "SET_CATALOG_OPEN": {
+            return {
+                ...state,
+                catalogOpen: action.open,
+            };
+        }
         case "SET_RUBRIC": {
             /*await*/ updateStoredRubricAsync(state.rubric, action.rubric); // fire and forget, we don't need to wait for this to finish.
             return {
@@ -133,5 +139,11 @@ export default function reducer(state: AppState, action: Action): AppState {
                 blockImageCache: cache,
             };
         }
+        case "SET_SCREEN_READER_ANNOUNCEMENT": {
+            return {
+                ...state,
+                screenReaderAnnouncement: action.announcement,
+            };
+        }
     }
 }
diff --git a/teachertool/src/state/state.ts b/teachertool/src/state/state.ts
index 8f2484cb24f4..4a74375f8634 100644
--- a/teachertool/src/state/state.ts
+++ b/teachertool/src/state/state.ts
@@ -18,6 +18,8 @@ export type AppState = {
     toolboxCategories?: pxt.Map<pxt.editor.ToolboxCategoryDefinition>;
     blockImageCache: pxt.Map<string>; // block id -> image uri
     copilotEndpointOverride?: string; // TODO: remove once copilot is available in prod.
+    catalogOpen: boolean;
+    screenReaderAnnouncement?: string;
     flags: {
         testCatalog: boolean;
     };
@@ -36,6 +38,8 @@ export const initialAppState: AppState = {
     toolboxCategories: undefined,
     blockImageCache: {},
     copilotEndpointOverride: undefined,
+    catalogOpen: false,
+    screenReaderAnnouncement: undefined,
     flags: {
         testCatalog: false,
     },
diff --git a/teachertool/src/transforms/announceToScreenReader.ts b/teachertool/src/transforms/announceToScreenReader.ts
new file mode 100644
index 000000000000..bf76ed6ab53a
--- /dev/null
+++ b/teachertool/src/transforms/announceToScreenReader.ts
@@ -0,0 +1,7 @@
+import { stateAndDispatch } from "../state";
+import * as Actions from "../state/actions";
+
+export function announceToScreenReader(announcement: string) {
+    const { dispatch } = stateAndDispatch();
+    dispatch(Actions.setScreenReaderAnnouncement(announcement));
+}
diff --git a/teachertool/src/transforms/getRubricFromFileAsync.ts b/teachertool/src/transforms/getRubricFromFileAsync.ts
index e516d520d23d..d833e4c16968 100644
--- a/teachertool/src/transforms/getRubricFromFileAsync.ts
+++ b/teachertool/src/transforms/getRubricFromFileAsync.ts
@@ -7,7 +7,7 @@ export async function getRubricFromFileAsync(file: File, allowPartial: boolean):
     let rubric = await loadRubricFromFileAsync(file);
 
     if (rubric) {
-        logDebug("Loading rubric from file...", {file, rubric});
+        logDebug("Loading rubric from file...", { file, rubric });
 
         const rubricVerificationResult = verifyRubricIntegrity(rubric);
 
diff --git a/teachertool/src/transforms/runEvaluateAsync.ts b/teachertool/src/transforms/runEvaluateAsync.ts
index 602428044db8..7988fe223214 100644
--- a/teachertool/src/transforms/runEvaluateAsync.ts
+++ b/teachertool/src/transforms/runEvaluateAsync.ts
@@ -112,7 +112,7 @@ export async function runEvaluateAsync(fromUserInteraction: boolean) {
 
                 const plan = generateValidatorPlan(criteriaInstance, fromUserInteraction);
 
-                logDebug(`${criteriaInstance.instanceId}: Generated Plan`, plan)
+                logDebug(`${criteriaInstance.instanceId}: Generated Plan`, plan);
 
                 if (!plan) {
                     dispatch(Actions.clearEvalResult(criteriaInstance.instanceId));
diff --git a/teachertool/src/transforms/setCatalogOpen.ts b/teachertool/src/transforms/setCatalogOpen.ts
new file mode 100644
index 000000000000..299e235a6102
--- /dev/null
+++ b/teachertool/src/transforms/setCatalogOpen.ts
@@ -0,0 +1,10 @@
+import { stateAndDispatch } from "../state";
+import * as Actions from "../state/actions";
+
+export function setCatalogOpen(open: boolean) {
+    const { state: teacherTool, dispatch } = stateAndDispatch();
+
+    if (teacherTool.catalogOpen != open) {
+        dispatch(Actions.setCatalogOpen(open));
+    }
+}
diff --git a/teachertool/src/types/modalOptions.ts b/teachertool/src/types/modalOptions.ts
index f6c5f645a1ce..a33331ef1047 100644
--- a/teachertool/src/types/modalOptions.ts
+++ b/teachertool/src/types/modalOptions.ts
@@ -12,12 +12,8 @@ export type BlockPickerOptions = {
     paramName: string;
 };
 
-export type CatalogDisplayOptions = {
-    modal: "catalog-display";
-};
-
 export type ImportRubricOptions = {
     modal: "import-rubric";
 };
 
-export type ModalOptions = CatalogDisplayOptions | ImportRubricOptions | ConfirmationModalOptions | BlockPickerOptions;
+export type ModalOptions = ImportRubricOptions | ConfirmationModalOptions | BlockPickerOptions;