Skip to content

Commit

Permalink
[TM-1425] fix error color tag in table monitored (#766)
Browse files Browse the repository at this point in the history 
* [TM-1425] fix error color tag in table monitored

* [TM-1425] fix error table link
  • Loading branch information
@dottyy
dottyy authored Dec 18, 2024
1 parent 8f92486 commit f445d56
Show file tree
Hide file tree
Showing 2 changed files with 151 additions and 144 deletions.
5 changes: 4 additions & 1 deletion src/admin/components/Fields/CustomChipField.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,10 @@ const STATUS_CLASSNAME_MAP: { [key: string]: string } = {
"Needs Info": "bg-tertiary-50 text-tertiary-650",
"Needs more information": "bg-tertiary-50 text-tertiary-650",
"More info requested": "bg-tertiary-50 text-tertiary-650",
"No Update": "bg-grey-200 text-grey-500"
"No Update": "bg-grey-200 text-grey-500",
approved: "bg-green-30 text-green-100",
submitted: "bg-blue-200 text-blue",
"needs-more-information": "bg-tertiary-50 text-tertiary-650"
};

const CustomChipField = ({
Expand Down
290 changes: 147 additions & 143 deletions src/admin/components/ResourceTabs/MonitoredTab/components/DataCard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -120,144 +120,6 @@ const COMMON_COLUMNS: ColumnDef<RowData>[] = [

type CustomColumnDefInternal<TData> = ColumnDef<TData> & { type?: string };

const TABLE_COLUMNS_HECTARES_STRATEGY: ColumnDef<RowData>[] = [
...COMMON_COLUMNS,
{
accessorKey: "data.tree_planting",
header: "Tree Planting",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "11.95%" } }
},
{
accessorKey: "data.assisted_natural_regeneration",
header: () => (
<>
Asst. Nat.
<br />
Regeneration
</>
),
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "12.09%" } }
},
{
accessorKey: "data.direct_seeding",
header: () => (
<>
Direct
<br />
Seeding
</>
),
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "8.57%" } }
},
{
accessorKey: "more",
header: "",
enableSorting: false,
cell: props => (
<div className="flex w-full cursor-pointer items-center justify-end rounded p-1 hover:text-primary">
<Icon name={IconNames.EDIT_PA} className="h-4 w-4 text-darkCustom-300 hover:text-primary" />
</div>
),
meta: { style: { width: "5%" } }
}
];

const TABLE_COLUMNS_HECTARES_ECO_REGION: ColumnDef<RowData>[] = [
...COMMON_COLUMNS,
{
accessorKey: "data.australasian",
header: "Australasian",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "11.45%" } }
},
{
accessorKey: "data.afrotropical",
header: "Afrotropical",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "11.05%" } }
},
{
accessorKey: "data.paleartic",
header: "Paleartic11",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "10.33%" } }
},
{
accessorKey: "more",
header: "",
enableSorting: false,
cell: props => (
<div className="flex w-full cursor-pointer items-center justify-end rounded p-1 hover:text-primary">
<Icon name={IconNames.EDIT_PA} className="h-4 w-4 text-darkCustom-300 hover:text-primary" />
</div>
),
meta: { style: { width: "5%" } }
}
];

const TABLE_COLUMNS_HECTARES_LAND_USE: ColumnDef<RowData>[] = [
...COMMON_COLUMNS,
{
accessorKey: "data.agroforest",
header: "Agroforest",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "11.95%" } }
},
{
accessorKey: "data.natural_forest",
header: "Natural Forest",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "12.09%" } }
},
{
accessorKey: "data.mangrove",
header: "Mangrove",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "8.57%" } }
},
{
accessorKey: "more",
header: "",
enableSorting: false,
cell: props => (
<div className="flex w-full cursor-pointer items-center justify-end rounded p-1 hover:text-primary">
<Icon name={IconNames.EDIT_PA} className="h-4 w-4 text-darkCustom-300 hover:text-primary" />
</div>
),
meta: { style: { width: "5%" } }
}
];

const DROPDOWN_OPTIONS = [
{
title: "Tree Cover Loss",
Expand Down Expand Up @@ -549,7 +411,9 @@ const DataCard = ({
enableSorting: false,
cell: props => (
<div className="flex w-full cursor-pointer items-center justify-end rounded p-1 hover:text-primary">
<Icon name={IconNames.EDIT_PA} className="h-4 w-4 text-darkCustom-300 hover:text-primary" />
<button onClick={() => navigate(`${basename}/site/${(props.row.original as any)?.site_id}/show/1`)}>
<Icon name={IconNames.EDIT_PA} className="h-4 w-4 text-darkCustom-300 hover:text-primary" />
</button>
</div>
),
meta: { style: { top: `${topHeaderFirstTable}`, borderRadius: "0" } }
Expand All @@ -558,6 +422,150 @@ const DataCard = ({
}
];

const TABLE_COLUMNS_HECTARES_STRATEGY: ColumnDef<RowData>[] = [
...COMMON_COLUMNS,
{
accessorKey: "data.tree_planting",
header: "Tree Planting",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "11.95%" } }
},
{
accessorKey: "data.assisted_natural_regeneration",
header: () => (
<>
Asst. Nat.
<br />
Regeneration
</>
),
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "12.09%" } }
},
{
accessorKey: "data.direct_seeding",
header: () => (
<>
Direct
<br />
Seeding
</>
),
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "8.57%" } }
},
{
accessorKey: "more",
header: "",
enableSorting: false,
cell: props => (
<div className="flex w-full cursor-pointer items-center justify-end rounded p-1 hover:text-primary">
<button onClick={() => navigate(`${basename}/site/${(props.row.original as any)?.site_id}/show/1`)}>
<Icon name={IconNames.EDIT_PA} className="h-4 w-4 text-darkCustom-300 hover:text-primary" />
</button>
</div>
),
meta: { style: { width: "5%" } }
}
];

const TABLE_COLUMNS_HECTARES_ECO_REGION: ColumnDef<RowData>[] = [
...COMMON_COLUMNS,
{
accessorKey: "data.australasian",
header: "Australasian",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "11.45%" } }
},
{
accessorKey: "data.afrotropical",
header: "Afrotropical",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "11.05%" } }
},
{
accessorKey: "data.paleartic",
header: "Paleartic11",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "10.33%" } }
},
{
accessorKey: "more",
header: "",
enableSorting: false,
cell: props => (
<div className="flex w-full cursor-pointer items-center justify-end rounded p-1 hover:text-primary">
<button onClick={() => navigate(`${basename}/site/${(props.row.original as any)?.site_id}/show/1`)}>
<Icon name={IconNames.EDIT_PA} className="h-4 w-4 text-darkCustom-300 hover:text-primary" />
</button>
</div>
),
meta: { style: { width: "5%" } }
}
];

const TABLE_COLUMNS_HECTARES_LAND_USE: ColumnDef<RowData>[] = [
...COMMON_COLUMNS,
{
accessorKey: "data.agroforest",
header: "Agroforest",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "11.95%" } }
},
{
accessorKey: "data.natural_forest",
header: "Natural Forest",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "12.09%" } }
},
{
accessorKey: "data.mangrove",
header: "Mangrove",
cell: (props: any) => {
const value = props.getValue();
return value ?? "-";
},
meta: { style: { width: "8.57%" } }
},
{
accessorKey: "more",
header: "",
enableSorting: false,
cell: props => (
<div className="flex w-full cursor-pointer items-center justify-end rounded p-1 hover:text-primary">
<button onClick={() => navigate(`${basename}/site/${(props.row.original as any)?.site_id}/show/1`)}>
<Icon name={IconNames.EDIT_PA} className="h-4 w-4 text-darkCustom-300 hover:text-primary" />
</button>
</div>
),
meta: { style: { width: "5%" } }
}
];

const TABLE_COLUMNS_MAPPING: Record<string, any> = {
treeCoverLoss: TABLE_COLUMNS_TREE_COVER_LOSS,
treeCoverLossFires: TABLE_COLUMNS_TREE_COVER_LOSS,
Expand Down Expand Up @@ -636,10 +644,6 @@ const DataCard = ({
classNameWrapper="!overflow-visible"
visibleRows={50}
border={1}
onRowClick={(row: any) => {
navigate(`${basename}/site/${row?.site_id}/show/1`);
setSelectPolygonFromMap?.({ isOpen: true, uuid: row?.poly_id });
}}
/>
</div>
</When>
Expand Down

0 comments on commit f445d56

Please sign in to comment.