From 1c0991bcfcc00abd3eb010dc7d42a4cb2bbc2e4f Mon Sep 17 00:00:00 2001
From: Rae Chen <cxy7562@gmail.com>
Date: Fri, 8 Sep 2023 11:42:45 -0700
Subject: [PATCH] create conditional component

---
 src/components/conditional.tsx | 12 ++++++++++++
 src/components/mdx_wrapper.tsx |  2 ++
 2 files changed, 14 insertions(+)
 create mode 100644 src/components/conditional.tsx

diff --git a/src/components/conditional.tsx b/src/components/conditional.tsx
new file mode 100644
index 00000000..acd7c988
--- /dev/null
+++ b/src/components/conditional.tsx
@@ -0,0 +1,12 @@
+import React, { FC } from 'react';
+
+interface ConditionalProps {
+    condition: boolean;
+    children: React.ReactNode
+}
+
+const Conditional: FC<ConditionalProps> = ({ condition, children }) => {
+    return condition ? <>{children}</> : null;
+};
+
+export default Conditional;
\ No newline at end of file
diff --git a/src/components/mdx_wrapper.tsx b/src/components/mdx_wrapper.tsx
index 48e024a0..a003adb4 100644
--- a/src/components/mdx_wrapper.tsx
+++ b/src/components/mdx_wrapper.tsx
@@ -25,6 +25,7 @@ import ProjectInfoReport from '../templates/reusable/project_info_report.mdx'
 import PrintSectionWrapper from './print_section wrapper'
 import FileInputWrapper from './file_input_wrapper'
 import PDFRendererWrapper from './pdf_renderer_wrapper'
+import Conditional from './conditional'
 
 const components = {
     Collapsible,
@@ -49,6 +50,7 @@ const components = {
     ProjectInfoReport: ProjectInfoReport,
     FileInput: FileInputWrapper,
     PDFRenderer: PDFRendererWrapper,
+    Conditional: Conditional,
 }
 
 interface MdxWrapperProps {