fix-dateCreated

This commit is contained in:
arpitnath 2021-08-09 16:30:51 +05:30
parent f88411f01b
commit 66eac07917

View file

@ -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>
);
}