mirror of
https://github.com/ToolJet/ToolJet
synced 2026-05-23 17:08:34 +00:00
fix-dateCreated
This commit is contained in:
parent
f88411f01b
commit
66eac07917
1 changed files with 102 additions and 103 deletions
|
|
@ -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>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue