datastake-daf 0.6.774 → 0.6.776

package/src/@daf/pages/Summary/Activities/PlantingCycle/components/AssociatedInformation/config.js

@@ -0,0 +1,548 @@
+import { Tooltip } from "antd";
+import { MoreMenu  , CustomIcon} from "../../../../../../../index";
+import { renderDateFormatted } from "../../../../../../../helpers/Forms";
+import { Avatar, Tag } from "antd";
+import { convertDMS } from "../../../../../../../helpers/Map";
+import { findOptions, capitalize } from "../../../../../../../helpers/StringHelper.js";
+const ACTIVITIES_TAB = 'activities';
+const PARTNERS_TAB = 'partners';
+const INCIDENTS_TAB = 'incidents';
+
+export const getColumns = ({
+    projectId,
+    t,
+    show = 'show',
+    navigate,
+    selectOptions,
+    view,
+    getRedirectLink,
+    activeTab = ACTIVITIES_TAB,
+
+}) => {
+    const renderActions = (record, viewType = 'activities') => {
+        if (record.empty) {
+            return <div className="daf-default-cell" />;
+        }
+
+        if (!navigate || !getRedirectLink) {
+            return null;
+        }
+
+        const onClick = () => {
+            const link = `/app/view/${viewType}/${record.datastakeId}`;
+            navigate(getRedirectLink(link));
+        };
+
+        const menuItems = [
+            {
+                label: t("Details"),
+                key: "details",
+                onClick: onClick
+            }
+        ];
+
+        if (viewType === 'activities') {
+            menuItems.push({
+                label: t("Summary"),
+                key: "summary",
+                onClick: () => {
+                    const link = `/app/projects/${record.projectId}/planting-cycles/summary/${record.datastakeId}`;
+                    navigate(getRedirectLink(link));
+                }
+            });
+        }
+
+        return <MoreMenu items={menuItems} />;
+    };
+
+    if (activeTab === ACTIVITIES_TAB) {
+        return [
+            {
+                title: "",
+                dataIndex: 'image',
+                key: 'image',
+                active: true,
+                width: 80,
+                pending: true,
+                suspended: true,
+                ellipsis: true,
+                render: (v, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    
+                    const firstGroupPhoto = all?.groupPhotos?.[0];
+                    const pictures = firstGroupPhoto?.pictures;
+                    const firstPicture = Array.isArray(pictures) && pictures.length > 0 ? pictures[0] : null;
+                    let imageUrl = firstPicture?.url;
+                    
+                    const normalizeUrl = (url) => url?.endsWith(':') ? url.slice(0, -1) : url;
+                    let normalizedUrl = imageUrl ? normalizeUrl(imageUrl.trim()) : null;
+                    
+                    if (normalizedUrl && !normalizedUrl.startsWith('http://') && !normalizedUrl.startsWith('https://') && !normalizedUrl.startsWith('//')) {
+                        if (normalizedUrl.startsWith('cdn.') || (normalizedUrl.includes('.') && !normalizedUrl.startsWith('/'))) {
+                            normalizedUrl = `https://${normalizedUrl}`;
+                        }
+                    }
+                    
+                    return (
+                        <div className="daf-default-cell" style={{ display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+                            <div
+                                style={{
+                                    width: 32,
+                                    height: 32,
+                                    borderWidth: '1px',
+                                    borderStyle: 'solid',
+                                    borderColor: '#E5E7EB',
+                                    borderRadius: '6px',
+                                    background: '#F9FAFB',
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    justifyContent: 'center',
+                                    overflow: 'hidden',
+                                    position: 'relative',
+                                }}
+                            >
+                                {normalizedUrl && (
+                                    <img
+                                        src={normalizedUrl}
+                                        alt={all.name || 'Activity image'}
+                                        style={{
+                                            width: '100%',
+                                            height: '100%',
+                                            objectFit: 'cover',
+                                            borderRadius: '6px',
+                                        }}
+                                        onError={(e) => {
+                                            e.target.style.display = 'none';
+                                        }}
+                                    />
+                                )}
+                            </div>
+                        </div>
+                    );
+                }
+            },
+            {
+                title: t('ID'),
+                dataIndex: 'datastakeId',
+                key: 'datastakeId',
+                active: true,
+                pending: true,
+                suspended: true,
+                ellipsis: true,
+                render: (v, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    return (
+                        <div className="daf-default-cell">
+                            {all.datastakeId}
+                        </div>
+                    );
+                }
+            },
+            {
+                title: t("Title"),
+                dataIndex: "name",
+                key: "name",
+                ellipsis: true,
+                active: true,
+                pending: true,
+                suspended: true,
+                render: (value) => <Tooltip title={value}>{value}</Tooltip>,
+            },
+            {
+                title: t("Type"),
+                dataIndex: "type",
+                key: "type",
+                ellipsis: true,
+                active: true,
+                pending: true,
+                suspended: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    return <Tooltip title={value}>{capitalize(value) || '-'}</Tooltip>;
+                },
+            },
+            {
+                title: t("Location"),
+                dataIndex: "location",
+                key: "location",
+                ellipsis: true,
+                active: true,
+                pending: true,
+                width: 220,
+                suspended: true,
+                show: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    
+                    const location = all.location || value;
+                    if (location && typeof location === 'object' && typeof location.latitude === 'number' && typeof location.longitude === 'number') {
+                        const coordinates = convertDMS(location.latitude, location.longitude);
+                        const iconColor = "#016C6E";
+                        
+                        return (
+                            <div style={{ display: 'flex', alignItems: 'center', gap: '8px', flexWrap: 'nowrap' }}>
+                                <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
+                                    <CustomIcon 
+                                        name="SpacingHeight" 
+                                        width={14} 
+                                        height={14}
+                                        fill={iconColor}
+                                    />
+                                    <span>{coordinates[0]}</span>
+                                </div>
+                               
+                                <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
+                                    <CustomIcon 
+                                        name="SpacingWidth" 
+                                        width={14} 
+                                        height={14}
+                                        fill={iconColor}
+                                    />
+                                    <span>{coordinates[1]}</span>
+                                </div>
+                            </div>
+                        );
+                    }
+                    
+                    let locationDisplay = '-';
+                    if (all.project?.name || all.project?.title) {
+                        locationDisplay = all.project?.name || all.project?.title;
+                    } else if (location?.name) {
+                        locationDisplay = location.name;
+                    } else if (value && typeof value === 'string') {
+                        locationDisplay = value;
+                    }
+                    return <Tooltip title={locationDisplay}>{locationDisplay}</Tooltip>
+                },
+            },
+            {
+                title: t("Implementer"),
+                dataIndex: "technicalPartner",
+                key: "implementer",
+                ellipsis: true,
+                show: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    const implementerName = all.technicalPartner || all.implementer?.name || all.implementer?.title || value || '-';
+                    return <Tooltip title={implementerName}>{implementerName}</Tooltip>;
+                }
+            },
+            {
+                title: t("Status"),
+                dataIndex: "published",
+                key: "published",
+                ellipsis: false,
+                show: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    let statusDisplay = '-';
+                    let color = 'default';
+                    if (value !== undefined) {
+                        statusDisplay = value ? t('Published') : t('Unpublished');
+                        color = value ? 'green' : 'default';
+                    } 
+                    return <Tag color={color} style={{ width: 100 }} className="text-center">
+                        {t(statusDisplay)}
+                    </Tag>
+                }
+            },
+            {
+                title: t("Date"),
+                dataIndex: "lastUpdated",
+                key: "lastUpdated",
+                ellipsis: true,
+                active: true,
+                pending: false,
+                suspended: true,
+                show: true,
+                render: (val, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    const title = renderDateFormatted(all.updatedAt || all.date, "DD MMM YYYY");
+                    return <Tooltip title={title}>{title}</Tooltip>;
+                },
+            },
+            {
+                title: "",
+                dataIndex: "actions",
+                key: "actions",
+                width: 60,
+                render: (_, val) => {
+                    if (val.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+
+                    const items = [
+                        {
+                            key: "viewSummary",
+                            label: t("Summary"),
+                            onClick: () => {
+                                const link = `/app/projects/${projectId}/restoration/summary/${val.datastakeId}`;
+                                navigate(getRedirectLink(link));
+                            }
+                        },
+                        {
+                            key: "viewDetails",
+                            label: t("Details"),
+                            onClick: () => {
+                                const link = `/app/projects/${projectId}/restoration/view/general/${val.datastakeId}/identification`;
+                                navigate(getRedirectLink(link));
+                            }
+                        },
+                    ];
+
+                    return <MoreMenu items={items} />;
+                },
+                ellipsis: true,
+            },
+        ];
+    }
+
+    if (activeTab === PARTNERS_TAB) {
+        return [
+            {
+                title: t('ID'),
+                dataIndex: 'datastakeId',
+                key: 'datastakeId',
+                ellipsis: true,
+                width: 160,
+                render: (v, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    return <Tooltip title={v}>{v || '-'}</Tooltip>;
+                }
+            },
+            {
+                title: t("Name"),
+                dataIndex: "name",
+                key: "name",
+                ellipsis: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    const name = value || all.nickName || '-';
+                    return <Tooltip title={name}>{name}</Tooltip>;
+                },
+            },
+            {
+                title: t("Category"),
+                dataIndex: "category",
+                key: "category",
+                ellipsis: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    return <Tooltip title={value}>{value || '-'}</Tooltip>;
+                },
+            },
+            {
+                title: t("Subcategory"),
+                dataIndex: "subcategory",
+                key: "subcategory",
+                ellipsis: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    return <Tooltip title={value}>{value || '-'}</Tooltip>;
+                },
+            },
+            {
+                title: t("Country"),
+                dataIndex: "country",
+                key: "country",
+                ellipsis: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+
+                    const title = findOptions(value, selectOptions?.country || []) || '-';
+
+                    return <Tooltip title={title}>{title}</Tooltip>
+                },
+            },
+            {
+                title: t("Last Update"),
+                dataIndex: "lastUpdated",
+                key: "lastUpdated",
+                ellipsis: true,
+                render: (val, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    const title = renderDateFormatted(all.updatedAt || all.lastUpdated, "DD MMM YYYY");
+                    return <Tooltip title={title}>{title}</Tooltip>;
+                },
+            },
+            {
+                title: t(''),
+                dataIndex: 'actions',
+                key: 'actions',
+                width: 60,
+                render: (_, record) => {
+                  const onClick = () => {
+                    const id = record.id;
+                    const link = `/app/projects/${projectId}/implementation-partners/view/general/${record?.datastakeId}/identification`;
+                    navigate(getRedirectLink(link));
+                  }
+                  return !record.empty ? (
+                    <div className="cursor-pointer" onClick={onClick}>
+                      <CustomIcon name="Link" width={16} height={16} color="#6C737F" />
+                    </div>
+                  ) : null;
+                },
+                active: true,
+                pending: true,
+                suspended: true,
+              },
+        ];
+    }
+
+    if (activeTab === INCIDENTS_TAB) {
+        return [
+            {
+                title: t('ID'),
+                dataIndex: 'datastakeId',
+                key: 'datastakeId',
+                ellipsis: true,
+                width: 160,
+                render: (v, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    return <Tooltip title={v}>{v}</Tooltip>;
+                }
+            },
+            {
+                title: t("Title"),
+                dataIndex: "name",
+                key: "name",
+                ellipsis: true,
+                render: (value) => <Tooltip title={value}>{value}</Tooltip>,
+            },
+            {
+                title: t("Date"),
+                dataIndex: "date",
+                key: "date",
+                ellipsis: true,
+                render: (val, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    const title = renderDateFormatted(all.date || all.updatedAt, "DD MMM YYYY");
+                    return <Tooltip title={title}>{title}</Tooltip>;
+                },
+            },
+            {
+                title: t("Location"),
+                dataIndex: "location",
+                key: "location",
+                ellipsis: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    let locationDisplay = '-';
+                    if (all.location?.name) {
+                        locationDisplay = all.location.name;
+                    } else if (all.mineSite?.name) {
+                        locationDisplay = all.mineSite.name;
+                    } else if (all.location && typeof all.location === 'object' && all.location.latitude && all.location.longitude) {
+                        locationDisplay = `${all.location.latitude.toFixed(6)}, ${all.location.longitude.toFixed(6)}`;
+                    } else if (value && typeof value === 'string') {
+                        locationDisplay = value;
+                    }
+                    return <Tooltip title={locationDisplay}>{locationDisplay}</Tooltip>;
+                },
+            },
+            {
+                title: t("Province"),
+                dataIndex: "province",
+                key: "province",
+                ellipsis: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    let province = '-';
+                    if (all.province) {
+                        province = all.province;
+                    } else if (all.location && typeof all.location === 'object' && all.location.administrativeLevel1) {
+                        province = all.location.administrativeLevel1;
+                    }
+                    return <Tooltip title={province}>{province}</Tooltip>;
+                },
+            },
+            {
+                title: t("Territory"),
+                dataIndex: "territory",
+                key: "territory",
+                ellipsis: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    let territory = '-';
+                    if (all.territory) {
+                        territory = all.territory;
+                    } else if (all.location && typeof all.location === 'object' && all.location.administrativeLevel2) {
+                        territory = all.location.administrativeLevel2;
+                    }
+                    return <Tooltip title={territory}>{territory}</Tooltip>;
+                },
+            },
+            {
+                title: t("Category"),
+                dataIndex: "category",
+                key: "category",
+                ellipsis: true,
+                render: (value, all) => {
+                    if (all.empty) {
+                        return <div className="daf-default-cell" />;
+                    }
+                    const category = all.eventCategory || all.category || value || '-';
+                    return <Tooltip title={category}>{category}</Tooltip>;
+                },
+            },
+            {
+                title: t(''),
+                dataIndex: 'actions',
+                key: 'actions',
+                width: 60,
+                render: (_, record) => {    
+                    const onClick = () => {
+                        const link = `/app/projects/${projectId}/implementation-partners/view/general/${record.datastakeId}/identification`;
+                        getRedirectLink(link);
+                    }
+                    return !record.empty ? (
+                        <div className="cursor-pointer" onClick={onClick}>
+                            <CustomIcon name="Link" width={16} height={16} color="#6C737F" />
+                        </div>
+                    ) : null;
+                },
+                active: true,
+                pending: true,
+                suspended: true,
+            },
+        ];
+    }
+
+    return [];
+}