jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): fix dashboards table

Browse source
This commit is contained in:
sylenien 2022-09-01 17:41:55 +02:00
parent 253743d0a3
commit f6c9cf172b
7 changed files with 16 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/app/components/Dashboard/components/Alerts/AlertListItem.tsx
View file

@ -78,7 +78,7 @@ function AlertListItem(props: Props) {
onClick={onItemClick}
>
<div className="grid grid-cols-12 py-4 select-none">
<div className="col-span-5 flex items-start">
<div className="col-span-8 flex items-start">
<div className="flex items-center capitalize-first">
<div className="w-9 h-9 rounded-full bg-tealx-lightest flex items-center justify-center mr-2">
<Icon name="bell" size="16" color="tealx" />
@ -91,7 +91,7 @@ function AlertListItem(props: Props) {
<span>{alert.detectionMethod}</span>
</div>
</div>
<div className="col-span-5 text-right">
<div className="col-span-2 text-right">
{demo
? DateTime.fromMillis(+new Date()).toFormat('LLL dd, yyyy, hh:mm a')
: checkForRecent(

4
frontend/app/components/Dashboard/components/Alerts/AlertsList.tsx
View file

@ -44,9 +44,9 @@ function AlertsList({ fetchList, list: alertsList, alertsSearch, siteId, init, f
>
<div className="mt-3 border-b">
<div className="grid grid-cols-12 py-2 font-medium px-6">
<div className="col-span-5">Title</div>
<div className="col-span-8">Title</div>
<div className="col-span-2">Type</div>
<div className="col-span-5 text-right">Modified</div>
<div className="col-span-2 text-right">Modified</div>
</div>
{sliceListPerPage(list, page - 1, pageSize).map((alert: any) => (

4
frontend/app/components/Dashboard/components/Alerts/AlertsView.tsx
View file

@ -17,10 +17,10 @@ function AlertsView({ siteId, init }: IAlertsView) {
return (
<div style={{ maxWidth: '1300px', margin: 'auto'}} className="bg-white rounded py-4 border">
<div className="flex items-center mb-4 justify-between px-6">
<div className="flex items-baseline mr-3">
<Link to={withSiteId(alertCreate(), siteId)}><Button variant="primary" onClick={null}>Create</Button></Link>
<div className="flex items-baseline ml-3">
<PageTitle title="Alerts" />
</div>
<Link to={withSiteId(alertCreate(), siteId)}><Button variant="primary" onClick={null}>Create</Button></Link>
<div className="ml-auto w-1/4" style={{ minWidth: 300 }}>
<AlertsSearch />
</div>

4
frontend/app/components/Dashboard/components/DashboardList/DashboardsView.tsx
View file

@ -23,10 +23,10 @@ function DashboardsView({ history, siteId }: { history: any, siteId: string }) {
return (
<div style={{ maxWidth: '1300px', margin: 'auto'}} className="bg-white rounded py-4 border">
<div className="flex items-center mb-4 justify-between px-6">
<div className="flex items-baseline mr-3">
<Button variant="primary" onClick={onAddDashboardClick}>Create</Button>
<div className="flex items-baseline ml-3">
<PageTitle title="Dashboards" />
</div>
<Button variant="primary" onClick={onAddDashboardClick}>Create Dashboard</Button>
<div className="ml-auto w-1/4" style={{ minWidth: 300 }}>
<DashboardSearch />
</div>

6
frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx
View file

@ -46,7 +46,7 @@ function MetricListItem(props: Props) {
};
return (
<div className="grid grid-cols-12 py-4 border-t select-none hover:bg-active-blue cursor-pointer px-6" onClick={onItemClick}>
<div className="col-span-3 flex items-start">
<div className="col-span-4 flex items-start">
<div className="flex items-center">
<MetricTypeIcon type={metric.metricType} />
<div className="link capitalize-first">
@ -54,8 +54,8 @@ function MetricListItem(props: Props) {
</div>
</div>
</div>
<div className="col-span-3">{metric.owner}</div>
<div className="col-span-4">
<div className="col-span-4">{metric.owner}</div>
<div className="col-span-2">
<div className="flex items-center">
<Icon name={metric.isPublic ? "user-friends" : "person-fill"} className="mr-2" />
<span>{metric.isPublic ? 'Team' : 'Private'}</span>

6
frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx
View file

@ -40,9 +40,9 @@ function MetricsList({ siteId }: { siteId: string }) {
>
<div className="mt-3 border-b rounded bg-white">
<div className="grid grid-cols-12 py-2 font-medium px-6">
<div className="col-span-3">Title</div>
<div className="col-span-3">Owner</div>
<div className="col-span-4">Visibility</div>
<div className="col-span-4">Title</div>
<div className="col-span-4">Owner</div>
<div className="col-span-2">Visibility</div>
<div className="col-span-2 text-right">Last Modified</div>
</div>

4
frontend/app/components/Dashboard/components/MetricsView/MetricsView.tsx
View file

@ -18,10 +18,10 @@ function MetricsView({ siteId }: Props) {
return useObserver(() => (
<div style={{ maxWidth: '1300px', margin: 'auto'}} className="bg-white rounded py-4 border">
<div className="flex items-center mb-4 justify-between px-6">
<div className="flex items-baseline mr-3">
<Link to={'/metrics/create'}><Button variant="primary">Create</Button></Link>
<div className="flex items-baseline ml-3">
<PageTitle title="Metrics" className="" />
</div>
<Link to={'/metrics/create'}><Button variant="primary">Create Metric</Button></Link>
<div className="ml-auto w-1/4" style={{ minWidth: 300 }}>
<MetricsSearch />
</div>