diff --git a/frontend/src/HomePage/HomePage.jsx b/frontend/src/HomePage/HomePage.jsx
index 4d75968608..a92cdc91e7 100644
--- a/frontend/src/HomePage/HomePage.jsx
+++ b/frontend/src/HomePage/HomePage.jsx
@@ -113,9 +113,9 @@ class HomePage extends React.Component {
     const {
       apps, isLoading, creatingApp, meta, currentFolder, showAppDeletionConfirmation, isDeletingApp
     } = this.state;
+
     return (
       <div className="wrapper home-page">
-
         <ConfirmDialog
           show={showAppDeletionConfirmation}
           message={'The app and the associated data will be permanently deleted, do you want to continue?'}
@@ -124,124 +124,124 @@ class HomePage extends React.Component {
           onCancel={() => {}}
         />
 
-        <Header
-           switchDarkMode={this.props.switchDarkMode}
-           darkMode={this.props.darkMode}
-        />
-        {!isLoading && meta.total_count === 0 &&
-          <BlankPage
-            createApp={this.createApp}
-          />
-        }
+        <Header switchDarkMode={this.props.switchDarkMode} darkMode={this.props.darkMode} />
+        {!isLoading && meta.total_count === 0 && <BlankPage createApp={this.createApp} />}
 
-        {(isLoading || meta.total_count > 0) &&
+        {(isLoading || meta.total_count > 0) && (
+          <div className="page-body homepage-body">
+            <div className="container-xl">
+              <div className="row">
+                <div className="col-12 col-lg-3 mb-5">
+                  <br />
+                  <Folders
+                    foldersLoading={this.state.foldersLoading}
+                    totalCount={this.state.meta.total_count}
+                    folders={this.state.folders}
+                    currentFolder={currentFolder}
+                    folderChanged={this.folderChanged}
+                    foldersChanged={this.foldersChanged}
+                  />
+                </div>
 
-        <div className="page-body homepage-body">
-          <div className="container-xl">
-            <div className="row">
-              <div className="col-12 col-lg-3 mb-5">
-                <br />
-                <Folders
-                  foldersLoading={this.state.foldersLoading}
-                  totalCount={this.state.meta.total_count}
-                  folders={this.state.folders}
-                  currentFolder={currentFolder}
-                  folderChanged={this.folderChanged}
-                  foldersChanged={this.foldersChanged}
-                />
-              </div>
-
-              <div className="col-md-9">
-
-                    <div className="w-100 mb-5">
-                      <div className="row align-items-center">
-                        <div className="col">
-                          <h2 className="page-title">{currentFolder.id ? `Folder: ${currentFolder.name}` : 'All applications'}</h2>
-                        </div>
+                <div className="col-md-9">
+                  <div className="w-100 mb-5">
+                    <div className="row align-items-center">
+                      <div className="col">
+                        <h2 className="page-title">
+                          {currentFolder.id ? `Folder: ${currentFolder.name}` : 'All applications'}
+                        </h2>
+                      </div>
                       <div className="col-auto ms-auto d-print-none">
-                        <button className={`btn btn-primary d-none d-lg-inline ${ creatingApp ? 'btn-loading' : ''}`} onClick={this.createApp}>Create new application</button>
+                        <button
+                          className={`btn btn-primary d-none d-lg-inline ${creatingApp ? 'btn-loading' : ''}`}
+                          onClick={this.createApp}
+                        >
+                          Create new application
+                        </button>
                       </div>
                     </div>
 
-                    <div className={currentFolder.count == 0 ? 'table-responsive w-100 apps-table mt-3 d-flex align-items-center' : 'table-responsive w-100 apps-table mt-3'} style={{minHeight: '600px'}}>
+                    <div
+                      className={
+                        currentFolder.count == 0
+                          ? 'table-responsive w-100 apps-table mt-3 d-flex align-items-center'
+                          : 'table-responsive w-100 apps-table mt-3'
+                      }
+                      style={{ minHeight: '600px' }}
+                    >
                       <table
                         data-testid="appsTable"
-                        className={`table table-vcenter ${this.props.darkMode ? 'bg-dark' : 'bg-white' }`}>
+                        className={`table table-vcenter ${this.props.darkMode ? 'bg-dark' : 'bg-white'}`}
+                      >
                         <tbody>
                           {isLoading && (
                             <>
                               {Array.from(Array(10)).map(() => (
-                                 <tr className="row">
-                                   <td className="col-3 p-3">
-                                      <div className="skeleton-line w-10"></div>
-                                      <div className="skeleton-line w-10"></div>
-                                    </td>
-                                    <td className="col p-3">
-                                    </td>
-                                    <td className="text-muted col-auto col-1 pt-4">
-                                      <div className="skeleton-line"></div>
-                                    </td>
-                                    <td className="text-muted col-auto col-1 pt-4">
-                                      <div className="skeleton-line"></div>
-                                    </td>
-                                 </tr>
-                               ))}
-
+                                <tr className="row">
+                                  <td className="col-3 p-3">
+                                    <div className="skeleton-line w-10"></div>
+                                    <div className="skeleton-line w-10"></div>
+                                  </td>
+                                  <td className="col p-3"></td>
+                                  <td className="text-muted col-auto col-1 pt-4">
+                                    <div className="skeleton-line"></div>
+                                  </td>
+                                  <td className="text-muted col-auto col-1 pt-4">
+                                    <div className="skeleton-line"></div>
+                                  </td>
+                                </tr>
+                              ))}
                             </>
                           )}
 
                           {meta.total_count > 0 && (
                             <>
+                              {apps.map((app) => (
+                                <tr className="row">
+                                  <td className="col p-3">
+                                    <span className="app-title mb-3">{app.name}</span> <br />
+                                    <small className="pt-2 app-description">
+                                      created {Date(app.created_at)} ago by {app.user.first_name} {app.user.last_name}{' '}
+                                    </small>
+                                  </td>
+                                  <td className="text-muted col-auto pt-4">
+                                    <Link to={`/apps/${app.id}`} className="d-none d-lg-inline">
+                                      <OverlayTrigger
+                                        placement="top"
+                                        overlay={(props) => renderTooltip({ props, text: 'Open in app builder' })}
+                                      >
+                                        <span className="badge bg-green-lt">Edit</span>
+                                      </OverlayTrigger>
+                                    </Link>
+                                    <Link to={`/applications/${app.slug}`} target="_blank">
+                                      <OverlayTrigger
+                                        placement="top"
+                                        overlay={(props) => renderTooltip({ props, text: 'Open in app viewer' })}
+                                      >
+                                        <span className="badge bg-blue-lt mx-2">launch</span>
+                                      </OverlayTrigger>
+                                    </Link>
 
-                            {apps.map((app) => (
-                            <tr className="row">
-                              <td className="col p-3">
-                                <span className="app-title mb-3">{app.name}</span> <br />
-                                <small className="pt-2 app-description">created {app.created_at} ago by {app.user.first_name} {app.user.last_name} </small>
-                              </td>
-                              <td className="text-muted col-auto pt-4">
-                                <Link
-                                  to={`/apps/${app.id}`}
-                                  className="d-none d-lg-inline"
-                                >
-                                  <OverlayTrigger
-                                    placement="top"
-                                    overlay={(props) => renderTooltip({props, text: 'Open in app builder'})}
-                                  >
-                                    <span className="badge bg-green-lt">
-                                    Edit
-                                    </span>
-                                  </OverlayTrigger>
-                                </Link>
-                                <Link
-                                  to={`/applications/${app.slug}`}
-                                  target="_blank"
-                                >
-                                  <OverlayTrigger
-                                    placement="top"
-                                    overlay={(props) => renderTooltip({props, text: 'Open in app viewer'})}
-                                  >
-                                    <span className="badge bg-blue-lt mx-2">launch</span>
-
-                                  </OverlayTrigger>
-                                </Link>
-
-                                <AppMenu
-                                  app={app}
-                                  folders={this.state.folders}
-                                  foldersChanged={this.foldersChanged}
-                                  deleteApp={() => this.deleteApp(app)}
-                                />
-                              </td>
-                            </tr>))
-                            }
-                            </>)
-                          }
-                          {currentFolder.count == 0  && (
+                                    <AppMenu
+                                      app={app}
+                                      folders={this.state.folders}
+                                      foldersChanged={this.foldersChanged}
+                                      deleteApp={() => this.deleteApp(app)}
+                                    />
+                                  </td>
+                                </tr>
+                              ))}
+                            </>
+                          )}
+                          {currentFolder.count == 0 && (
                             <div>
-                              <img className = "mx-auto d-block" src ="assets/images/icons/empty-folder-svgrepo-com.svg" height="120px"/>
-                              <span className= "d-block text-center text-body">This folder is empty</span>
-                              </div>
+                              <img
+                                className="mx-auto d-block"
+                                src="assets/images/icons/empty-folder-svgrepo-com.svg"
+                                height="120px"
+                              />
+                              <span className="d-block text-center text-body">This folder is empty</span>
+                            </div>
                           )}
                         </tbody>
                       </table>
@@ -255,12 +255,11 @@ class HomePage extends React.Component {
                       />
                     )}
                   </div>
+                </div>
               </div>
-
             </div>
           </div>
-        </div>
-        }
+        )}
       </div>
     );
   }