diff --git a/client/src/app/hooks/table-controls/types.ts b/client/src/app/hooks/table-controls/types.ts
index e165ef415..1695b1e6b 100644
--- a/client/src/app/hooks/table-controls/types.ts
+++ b/client/src/app/hooks/table-controls/types.ts
@@ -65,6 +65,7 @@ export interface IExtraArgsForURLParamHooks<
 export interface ITableControlDataDependentArgs<TItem> {
   isLoading?: boolean;
   idProperty: KeyWithValueType<TItem, string | number>;
+  forceNumRenderedColumns?: number;
 }
 
 // Derived state option args
@@ -112,6 +113,5 @@ export interface IUseTableControlPropsArgs<
     IExpansionDerivedStateArgs<TItem, TColumnKey>,
     IActiveRowDerivedStateArgs<TItem> {
   currentPageItems: TItem[];
-  forceNumRenderedColumns?: number;
   selectionState: ReturnType<typeof useSelectionState<TItem>>; // TODO make this optional? fold it in?
 }
diff --git a/client/src/app/pages/assessment-management/questionnaire/components/questionnaire-section-tab-title.tsx b/client/src/app/pages/assessment-management/questionnaire/components/questionnaire-section-tab-title.tsx
new file mode 100644
index 000000000..571a4db32
--- /dev/null
+++ b/client/src/app/pages/assessment-management/questionnaire/components/questionnaire-section-tab-title.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+import { TabTitleText, Badge } from "@patternfly/react-core";
+import spacing from "@patternfly/react-styles/css/utilities/Spacing/spacing";
+import { CustomYamlAssessmentQuestion } from "@app/api/models";
+
+const QuestionnaireSectionTabTitle: React.FC<{
+  isSearching: boolean;
+  sectionName: string;
+  unfilteredQuestions: CustomYamlAssessmentQuestion[];
+  filteredQuestions: CustomYamlAssessmentQuestion[];
+}> = ({ isSearching, sectionName, unfilteredQuestions, filteredQuestions }) => (
+  <TabTitleText aria-label="vertical" role="region">
+    {sectionName}
+    <br />
+    <small>
+      {unfilteredQuestions.length} questions
+      {isSearching ? (
+        <Badge
+          screenReaderText="Questions matching search"
+          className={spacing.mlSm}
+          isRead={filteredQuestions.length === 0}
+        >
+          {`${filteredQuestions.length} match${
+            filteredQuestions.length === 1 ? "" : "es"
+          }`}
+        </Badge>
+      ) : null}
+    </small>
+  </TabTitleText>
+);
+
+export default QuestionnaireSectionTabTitle;
diff --git a/client/src/app/pages/assessment-management/questionnaire/components/questions-table.tsx b/client/src/app/pages/assessment-management/questionnaire/components/questions-table.tsx
index f367da0d0..361ff9e2c 100644
--- a/client/src/app/pages/assessment-management/questionnaire/components/questions-table.tsx
+++ b/client/src/app/pages/assessment-management/questionnaire/components/questions-table.tsx
@@ -9,29 +9,40 @@ import {
   ExpandableRowContent,
 } from "@patternfly/react-table";
 import {
+  ConditionalTableBody,
   TableHeaderContentWithControls,
   TableRowContentWithControls,
 } from "@app/components/TableControls";
 import { useTranslation } from "react-i18next";
 import spacing from "@patternfly/react-styles/css/utilities/Spacing/spacing";
-import { CustomYamlAssessmentQuestion } from "@app/api/models";
+import { CustomYamlAssessmentQuestion, YamlAssessment } from "@app/api/models";
 import { useLocalTableControls } from "@app/hooks/table-controls";
 import { Label } from "@patternfly/react-core";
 import AnswerTable from "./answer-table";
+import { NoDataEmptyState } from "@app/components/NoDataEmptyState";
 
 const QuestionsTable: React.FC<{
-  fetchError: boolean;
+  fetchError?: Error;
   questions?: CustomYamlAssessmentQuestion[];
-}> = ({ fetchError = false, questions }) => {
+  isSearching?: boolean;
+  assessmentData?: YamlAssessment | null;
+  isAllQuestionsTab?: boolean;
+}> = ({
+  fetchError,
+  questions,
+  isSearching = false,
+  assessmentData,
+  isAllQuestionsTab = false,
+}) => {
   const tableControls = useLocalTableControls({
     idProperty: "formulation",
     items: questions || [],
     columnNames: {
       formulation: "Name",
+      section: "Section",
     },
-    hasActionsColumn: true,
-    isSelectable: false,
     expandableVariant: "single",
+    forceNumRenderedColumns: isAllQuestionsTab ? 3 : 2, // columns+1 for expand control
   });
 
   const {
@@ -54,44 +65,78 @@ const QuestionsTable: React.FC<{
         <Tr>
           <TableHeaderContentWithControls {...tableControls}>
             <Th {...getThProps({ columnKey: "formulation" })} />
+            {isAllQuestionsTab ? (
+              <Th {...getThProps({ columnKey: "section" })} />
+            ) : null}
           </TableHeaderContentWithControls>
         </Tr>
       </Thead>
-      <Tbody>
-        {currentPageItems?.map((question, rowIndex) => (
-          <>
-            <Tr key={question.formulation}>
-              <TableRowContentWithControls
-                {...tableControls}
-                item={question}
-                rowIndex={rowIndex}
-              >
-                <Td width={100} {...getTdProps({ columnKey: "formulation" })}>
-                  {(!!question?.include_if_tags_present?.length ||
-                    !!question?.skip_if_tags_present?.length) && (
-                    <Label className={spacing.mrSm}>Conditional</Label>
-                  )}
-                  {question.formulation}
-                </Td>
-              </TableRowContentWithControls>
-            </Tr>
-            {isCellExpanded(question) ? (
-              <Tr isExpanded>
-                <Td />
-                <Td
-                  {...getExpandedContentTdProps({ item: question })}
-                  className={spacing.pyLg}
-                >
-                  <ExpandableRowContent>
-                    {question.explanation}
-                    <AnswerTable answers={question.answers} />
-                  </ExpandableRowContent>
-                </Td>
-              </Tr>
-            ) : null}
-          </>
-        ))}
-      </Tbody>
+      <ConditionalTableBody
+        numRenderedColumns={numRenderedColumns}
+        isError={!!fetchError}
+        isNoData={questions?.length === 0}
+        noDataEmptyState={
+          <NoDataEmptyState
+            title={
+              isSearching
+                ? isAllQuestionsTab
+                  ? "No questions match your search"
+                  : "No questions in this section match your search"
+                : "This section is empty"
+            }
+          />
+        }
+      >
+        <Tbody>
+          {currentPageItems?.map((question, rowIndex) => {
+            const sectionName =
+              assessmentData?.sections.find((section) =>
+                section.questions.includes(question)
+              )?.name || "";
+            return (
+              <>
+                <Tr key={question.formulation}>
+                  <TableRowContentWithControls
+                    {...tableControls}
+                    item={question}
+                    rowIndex={rowIndex}
+                  >
+                    <Td
+                      width={isAllQuestionsTab ? 60 : 100}
+                      {...getTdProps({ columnKey: "formulation" })}
+                    >
+                      {(!!question?.include_if_tags_present?.length ||
+                        !!question?.skip_if_tags_present?.length) && (
+                        <Label className={spacing.mrSm}>Conditional</Label>
+                      )}
+                      {question.formulation}
+                    </Td>
+                    {isAllQuestionsTab ? (
+                      <Td width={40} {...getTdProps({ columnKey: "section" })}>
+                        {sectionName}
+                      </Td>
+                    ) : null}
+                  </TableRowContentWithControls>
+                </Tr>
+                {isCellExpanded(question) ? (
+                  <Tr isExpanded>
+                    <Td />
+                    <Td
+                      {...getExpandedContentTdProps({ item: question })}
+                      className={spacing.pyLg}
+                    >
+                      <ExpandableRowContent>
+                        {question.explanation}
+                        <AnswerTable answers={question.answers} />
+                      </ExpandableRowContent>
+                    </Td>
+                  </Tr>
+                ) : null}
+              </>
+            );
+          })}
+        </Tbody>
+      </ConditionalTableBody>
     </Table>
   );
 };
diff --git a/client/src/app/pages/assessment-management/questionnaire/questionnaire-page.css b/client/src/app/pages/assessment-management/questionnaire/questionnaire-page.css
index ea51579a9..52420e3fe 100644
--- a/client/src/app/pages/assessment-management/questionnaire/questionnaire-page.css
+++ b/client/src/app/pages/assessment-management/questionnaire/questionnaire-page.css
@@ -1,6 +1,11 @@
 .tabs-vertical-container {
-  width: 20em;
+  display: flex;
 }
-.tab-content-container {
-  width: 80em;
+
+.tabs-vertical-container .pf-v5-c-tabs {
+  width: 20%;
+}
+
+.tabs-vertical-container .pf-v5-c-tab-content {
+  width: 80%;
 }
diff --git a/client/src/app/pages/assessment-management/questionnaire/questionnaire-page.tsx b/client/src/app/pages/assessment-management/questionnaire/questionnaire-page.tsx
index 9de663589..4b550f627 100644
--- a/client/src/app/pages/assessment-management/questionnaire/questionnaire-page.tsx
+++ b/client/src/app/pages/assessment-management/questionnaire/questionnaire-page.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useMemo } from "react";
 import yaml from "js-yaml";
 import {
   Text,
@@ -7,40 +7,47 @@ import {
   PageSectionVariants,
   Breadcrumb,
   BreadcrumbItem,
-  Tab,
-  TabTitleText,
+  Button,
   Tabs,
-  TabContent,
+  Toolbar,
+  ToolbarItem,
+  SearchInput,
+  ToolbarContent,
+  Tab,
 } from "@patternfly/react-core";
+import AngleLeftIcon from "@patternfly/react-icons/dist/esm/icons/angle-left-icon";
 import { YamlAssessment } from "@app/api/models";
 import { Link } from "react-router-dom";
 import { Paths } from "@app/Paths";
 import { ConditionalRender } from "@app/components/ConditionalRender";
 import { AppPlaceholder } from "@app/components/AppPlaceholder";
 import { useTranslation } from "react-i18next";
-import "./questionnaire-page.css";
+import QuestionnaireSectionTabTitle from "./components/questionnaire-section-tab-title";
 import QuestionsTable from "./components/questions-table";
+import "./questionnaire-page.css";
 
 const Questionnaire: React.FC = () => {
   const { t } = useTranslation();
 
-  const [activeTabKey, setActiveTabKey] = React.useState<number>(0);
+  const [activeSectionIndex, setActiveSectionIndex] = React.useState<
+    "all" | number
+  >("all");
 
   const handleTabClick = (
-    event: React.MouseEvent<any> | React.KeyboardEvent | MouseEvent,
-    tabIndex: string | number
+    _event: React.MouseEvent<any> | React.KeyboardEvent | MouseEvent,
+    tabKey: string | number
   ) => {
-    setActiveTabKey(tabIndex as number);
+    setActiveSectionIndex(tabKey as "all" | number);
   };
 
   const [assessmentData, setAssessmentData] = useState<YamlAssessment | null>(
     null
   );
-  const activeSection = assessmentData?.sections[activeTabKey];
 
   // ------------------------!!
   // TODO: replace this with the real data from the API
-  const fetchError = false;
+  const fetchError = undefined;
+  const isLoading = false;
 
   useEffect(() => {
     fetch("/questionnaire-data.yaml") // adjust this path
@@ -52,6 +59,27 @@ const Questionnaire: React.FC = () => {
   }, []);
   // ------------------------!!
 
+  const [searchValue, setSearchValue] = React.useState("");
+  const filteredAssessmentData = useMemo<YamlAssessment | null>(() => {
+    if (!assessmentData) return null;
+    return {
+      ...assessmentData,
+      sections: assessmentData?.sections.map((section) => ({
+        ...section,
+        questions: section.questions.filter(({ formulation, explanation }) =>
+          [formulation, explanation].some((text) =>
+            text?.toLowerCase().includes(searchValue.toLowerCase())
+          )
+        ),
+      })),
+    };
+  }, [assessmentData, searchValue]);
+  const allQuestions =
+    assessmentData?.sections.flatMap((section) => section.questions) || [];
+  const allMatchingQuestions =
+    filteredAssessmentData?.sections.flatMap((section) => section.questions) ||
+    [];
+
   return (
     <>
       <PageSection variant={PageSectionVariants.light}>
@@ -71,48 +99,89 @@ const Questionnaire: React.FC = () => {
         <ConditionalRender
           // TODO: add loading state
           // when={isFetching && !(currentPageDataFromReactQuery || fetchError)}
-          when={fetchError}
+          when={isLoading}
           then={<AppPlaceholder />}
         >
           <div
             style={{
               backgroundColor: "var(--pf-v5-global--BackgroundColor--100)",
-              display: "flex",
             }}
           >
-            <Tabs
-              activeKey={activeTabKey}
-              onSelect={handleTabClick}
-              isVertical
-              aria-label="Tabs in the vertical example"
-              role="region"
-              width="50px"
-              className="tabs-vertical-container"
-            >
-              {assessmentData?.sections.map((section, index) => {
-                return (
+            <Toolbar>
+              <ToolbarContent>
+                <ToolbarItem widths={{ default: "300px" }}>
+                  <SearchInput
+                    placeholder="Search questions"
+                    value={searchValue}
+                    onChange={(_event, value) => setSearchValue(value)}
+                    onClear={() => setSearchValue("")}
+                    resultsCount={
+                      (searchValue && allMatchingQuestions.length) || undefined
+                    }
+                  />
+                </ToolbarItem>
+              </ToolbarContent>
+            </Toolbar>
+            <Link to={Paths.assessment}>
+              <Button variant="link" icon={<AngleLeftIcon />}>
+                Back to questionnaires
+              </Button>
+            </Link>
+            <div className="tabs-vertical-container">
+              <Tabs
+                activeKey={activeSectionIndex}
+                onSelect={handleTabClick}
+                isVertical
+                aria-label="Tabs for questionnaire sections"
+                role="region"
+              >
+                {[
                   <Tab
-                    eventKey={index}
+                    eventKey="all"
                     title={
-                      <TabTitleText aria-label="vertical" role="region">
-                        {section.name}
-                      </TabTitleText>
+                      <QuestionnaireSectionTabTitle
+                        isSearching={!!searchValue}
+                        sectionName="All questions"
+                        unfilteredQuestions={allQuestions}
+                        filteredQuestions={allMatchingQuestions}
+                      />
                     }
                   >
-                    <TabContent
-                      id={section.name}
-                      className="tab-content-container"
-                      style={{ flex: 1 }}
-                    >
-                      <QuestionsTable
-                        fetchError={fetchError}
-                        questions={activeSection?.questions}
-                      />
-                    </TabContent>
-                  </Tab>
-                );
-              })}
-            </Tabs>
+                    <QuestionsTable
+                      fetchError={fetchError}
+                      questions={allMatchingQuestions}
+                      isSearching={!!searchValue}
+                      assessmentData={assessmentData}
+                      isAllQuestionsTab
+                    />
+                  </Tab>,
+                  ...(assessmentData?.sections.map((section, index) => {
+                    const filteredQuestions =
+                      filteredAssessmentData?.sections[index]?.questions || [];
+                    return (
+                      <Tab
+                        eventKey={index}
+                        title={
+                          <QuestionnaireSectionTabTitle
+                            isSearching={!!searchValue}
+                            sectionName={section.name}
+                            unfilteredQuestions={section.questions}
+                            filteredQuestions={filteredQuestions}
+                          />
+                        }
+                      >
+                        <QuestionsTable
+                          fetchError={fetchError}
+                          questions={filteredQuestions}
+                          isSearching={!!searchValue}
+                          assessmentData={assessmentData}
+                        />
+                      </Tab>
+                    );
+                  }) || []),
+                ]}
+              </Tabs>
+            </div>
           </div>
         </ConditionalRender>
       </PageSection>