From 2dec29336b825b1ea2fbccc5d5d3b380e0e9cefe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Luc=C3=ADa=20Echenique=20=C3=81lvarez?=
 <25833665+lucechal14@users.noreply.github.com>
Date: Fri, 10 Jan 2025 13:29:38 -0600
Subject: [PATCH] frontend: Add full screen option to app configuration (#3196)

This pull request includes changes to the `AppLayout` component in the
`frontend/packages/core/src/AppLayout/index.tsx` file and the
`AppConfiguration` interface in the
`frontend/packages/core/src/Types/app.tsx` file. The primary goal of
these changes is to introduce the option for a full-screen layout.

Enhancements to layout configuration:

*
[`frontend/packages/core/src/AppLayout/index.tsx`](diffhunk://#diff-1465c1bdd75a440d3a5592c719280d01afe84948428c566711068196e9a02decL36-R45):
Modified the `AppLayout` component to conditionally render the header
and drawer based on the new `useFullScreenLayout` configuration option.
*
[`frontend/packages/core/src/Types/app.tsx`](diffhunk://#diff-cf066233a855942622a45960706a4b5e3bb99869f102c3e33c040d7983fa6862R10):
Added a new `useFullScreenLayout` boolean property to the
`AppConfiguration` interface to support the new layout option.
---
 frontend/packages/core/src/AppLayout/index.tsx | 8 +++++---
 frontend/packages/core/src/Types/app.tsx       | 1 +
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/frontend/packages/core/src/AppLayout/index.tsx b/frontend/packages/core/src/AppLayout/index.tsx
index 1d5d5eade0..4824752f26 100644
--- a/frontend/packages/core/src/AppLayout/index.tsx
+++ b/frontend/packages/core/src/AppLayout/index.tsx
@@ -33,14 +33,16 @@ const AppLayout: React.FC<AppLayoutProps> = ({
 }) => {
   return (
     <AppGrid container direction="column" data-testid="app-layout-component">
-      {header && React.cloneElement(header, { ...configuration, ...header.props })}
-      {!header && <Header {...configuration} />}
+      {!configuration?.useFullScreenLayout &&
+        header &&
+        React.cloneElement(header, { ...configuration, ...header.props })}
+      {!configuration?.useFullScreenLayout && !header && <Header {...configuration} />}
       <ContentGrid container wrap="nowrap">
         {isLoading ? (
           <Loadable isLoading={isLoading} variant="overlay" />
         ) : (
           <>
-            <Drawer />
+            {!configuration?.useFullScreenLayout && <Drawer />}
             <MainContent>
               <Outlet />
             </MainContent>
diff --git a/frontend/packages/core/src/Types/app.tsx b/frontend/packages/core/src/Types/app.tsx
index 9e407b13e6..3fca17a659 100644
--- a/frontend/packages/core/src/Types/app.tsx
+++ b/frontend/packages/core/src/Types/app.tsx
@@ -7,4 +7,5 @@ export interface AppConfiguration {
   logo?: React.ReactNode | string;
   banners?: AppBanners;
   useWorkflowLayout?: boolean;
+  useFullScreenLayout?: boolean;
 }