Skip to content

Commit cb6e1d5

Browse files
authored
Merge pull request #225 from rice-crc/develop
Merge develop into main
2 parents 5f4cfa7 + 6dece12 commit cb6e1d5

File tree

27 files changed

+1020
-305
lines changed

27 files changed

+1020
-305
lines changed

src/components/BlogPageComponents/Blogcomponents/BlogCardHeaderBody.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ const BlogCardHeaderBody = () => {
3333

3434
const { title, thumbnail, authors, subtitle, tags, updated_on } = post;
3535
const effectOnce = useRef(false);
36+
console.log({ authors });
3637

3738
useEffect(() => {
3839
if (!effectOnce.current) {
@@ -112,7 +113,7 @@ const BlogCardHeaderBody = () => {
112113
</div>
113114
<div className="media-body" key={`${index}-${author.name}`}>
114115
<h4 className="media-heading">{author.name}</h4>
115-
{author.description}
116+
{author?.institution?.name}
116117
</div>
117118
</div>
118119
);

src/components/BlogPageComponents/InstitutionsAuthors/InstitutionAuthorsList.tsx

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,37 @@
1-
import { RootState } from '@/redux/store';
2-
import { InitialStateBlogProps } from '@/share/InterfaceTypesBlog';
31
import { useSelector } from 'react-redux';
4-
import { BASEURL } from '@/share/AUTH_BASEURL';
52
import { Link } from 'react-router-dom';
3+
4+
import { RootState } from '@/redux/store';
5+
import { BASEURL } from '@/share/AUTH_BASEURL';
66
import '@/style/blogs.scss';
77
import { BLOGPAGE } from '@/share/CONST_DATA';
8+
import { InitialStateBlogProps } from '@/share/InterfaceTypesBlog';
89

910
const InstitutionAuthorsList: React.FC = () => {
1011
const { institutionList } = useSelector(
11-
(state: RootState) => state.getBlogData as InitialStateBlogProps
12+
(state: RootState) => state.getBlogData as InitialStateBlogProps,
1213
);
1314

1415
return (
1516
<div className="container-new-author">
1617
<h3>Institution Authors:</h3>
1718
{institutionList?.length > 0 &&
1819
institutionList?.map((institution, index) => (
19-
<div className="media" key={`${institution.id}-${index}`}>
20+
<div className="media" key={`${institution?.id}-${index}`}>
2021
<div
2122
className="media-left media-top"
22-
key={`${index}-${institution.photo}`}
23+
key={`${index}-${institution?.photo}`}
2324
>
2425
<Link
25-
to={`/${BLOGPAGE}/author/${institution.name}/${institution?.id}/`}
26+
to={`/${BLOGPAGE}/author/${institution?.name}/${institution?.id}/`}
2627
>
2728
{institution.photo ? (
2829
<img
2930
className="rounded-circle"
30-
src={`${BASEURL}${institution.photo}`}
31+
src={`${BASEURL}${institution?.photo}`}
3132
width="64"
3233
height="64"
34+
alt={institution?.name}
3335
/>
3436
) : (
3537
<div className="avatar">
@@ -38,15 +40,15 @@ const InstitutionAuthorsList: React.FC = () => {
3840
)}
3941
</Link>
4042
</div>
41-
<div className="media-body" key={`${index}-${institution.name}`}>
43+
<div className="media-body" key={`${index}-${institution?.name}`}>
4244
<h4 className="media-heading">
4345
<Link
44-
to={`/${BLOGPAGE}/author/${institution.name}/${institution?.id}/`}
46+
to={`/${BLOGPAGE}/author/${institution?.name}/${institution?.id}/`}
4547
>
46-
{institution.name}
48+
{institution?.institution?.name}
4749
</Link>
4850
</h4>
49-
<p>{institution.role}</p>
51+
<p>{institution?.role}</p>
5052
</div>
5153
</div>
5254
))}

src/components/FilterComponents/AutoCompletedSearhBlog/AutoCompletedSearhBlog.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,6 @@ const AutoCompletedSearhBlog = () => {
150150
navigate(`/${BLOGPAGE}`);
151151
}
152152
if (newValue) {
153-
console.log({ newValue });
154153
if (newValue.value === 'Introductory Maps') {
155154
navigate(
156155
`/${BLOGPAGE}/tag/${formatTextURL('all Intro Maps')}#${formatTextURL('all Intro Maps')}`,

src/components/NavigationComponents/CollectionTab/CollectionTabVoyages.tsx

Lines changed: 17 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
import { Button, Dropdown, Menu } from 'antd';
1+
import { useState } from 'react';
2+
23
import { DownOutlined } from '@ant-design/icons';
4+
import { Button, Dropdown } from 'antd';
35
import { useDispatch, useSelector } from 'react-redux';
46
import { useNavigate } from 'react-router-dom';
5-
import { useState } from 'react';
67

78
import { setPathNameVoyages } from '@/redux/getDataPathNameSlice';
89
import { setFilterObject, setIsFilter } from '@/redux/getFilterSlice';
@@ -137,15 +138,15 @@ const CollectionTabVoyages = () => {
137138
label: blockName,
138139
onClick: () => handlePageNavigation(buttonIndex, newBlockName),
139140
style: {
140-
backgroundColor: isActive ? getColorBackground(styleName) : 'transparent',
141+
backgroundColor: isActive
142+
? getColorBackground(styleName)
143+
: 'transparent',
141144
color: isActive ? 'white' : getColorTextCollection(styleName),
142145
fontWeight: isActive ? 'bold' : 600,
143146
},
144147
};
145148
});
146149

147-
const menu = <Menu items={menuItems} />;
148-
149150
// Desktop version - vertical buttons
150151
if (isDesktop) {
151152
return (
@@ -182,7 +183,8 @@ const CollectionTabVoyages = () => {
182183
target.style.backgroundColor = getColorHoverBackgroundCollection(
183184
styleName!,
184185
);
185-
target.style.color = getColorBTNVoyageDatasetBackground(styleName);
186+
target.style.color =
187+
getColorBTNVoyageDatasetBackground(styleName);
186188
};
187189

188190
const handleMouseLeave = (e: React.MouseEvent<HTMLElement>) => {
@@ -198,7 +200,8 @@ const CollectionTabVoyages = () => {
198200
target.style.backgroundColor = getColorHoverBackgroundCollection(
199201
styleName!,
200202
);
201-
target.style.color = getColorBTNVoyageDatasetBackground(styleName);
203+
target.style.color =
204+
getColorBTNVoyageDatasetBackground(styleName);
202205
target.style.outline = 'none';
203206
};
204207

@@ -234,12 +237,14 @@ const CollectionTabVoyages = () => {
234237
// Mobile version - dropdown menu
235238
return (
236239
<div className="navbar-wrapper-mobile">
237-
<Dropdown
238-
overlay={menu}
239-
trigger={['click']}
240+
<Dropdown
241+
menu={{
242+
items: menuItems,
243+
style: { zIndex: 10001 },
244+
}}
245+
trigger={['click']}
240246
placement="bottomRight"
241247
getPopupContainer={(trigger) => trigger.parentElement || document.body}
242-
overlayStyle={{ zIndex: 10001 }}
243248
>
244249
<Button
245250
className="nav-dropdown-button"
@@ -257,4 +262,4 @@ const CollectionTabVoyages = () => {
257262
);
258263
};
259264

260-
export default CollectionTabVoyages;
265+
export default CollectionTabVoyages;
Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
import React, { useCallback, useEffect, useState } from 'react';
2+
3+
import type { CustomHeaderProps } from 'ag-grid-react';
4+
5+
import { usePageRouter } from '@/hooks/usePageRouter';
6+
import { getHeaderColomnColor } from '@/utils/functions/getColorStyle';
7+
8+
type SortOrder = 'asc' | 'desc' | null;
9+
10+
export interface CustomHeaderTableProps extends CustomHeaderProps {
11+
menuIcon: string;
12+
column: any;
13+
}
14+
15+
const CustomHeaderSummaryTable = (props: CustomHeaderTableProps) => {
16+
const { styleName } = usePageRouter();
17+
const [ascSort, setAscSort] = useState('inactive');
18+
const [descSort, setDescSort] = useState('inactive');
19+
20+
useEffect(() => {
21+
const updateSortState = () => {
22+
const sortModel = props.api
23+
.getColumnState()
24+
.find((col) => col.colId === props.column.getColId());
25+
26+
if (!sortModel || !sortModel.sort) {
27+
setAscSort('inactive');
28+
setDescSort('inactive');
29+
} else if (sortModel.sort === 'asc') {
30+
setAscSort('active');
31+
setDescSort('inactive');
32+
} else if (sortModel.sort === 'desc') {
33+
setAscSort('inactive');
34+
setDescSort('active');
35+
}
36+
};
37+
38+
// Initial check
39+
updateSortState();
40+
41+
// Listen for sort changes from AG-Grid
42+
const sortChangedListener = () => {
43+
updateSortState();
44+
};
45+
46+
props.api.addEventListener('sortChanged', sortChangedListener);
47+
48+
return () => {
49+
props.api.removeEventListener('sortChanged', sortChangedListener);
50+
};
51+
}, [props.api, props.column]);
52+
53+
const handleSortRequest = useCallback(
54+
(
55+
order: SortOrder,
56+
event:
57+
| React.MouseEvent<HTMLButtonElement>
58+
| React.TouchEvent<HTMLButtonElement>,
59+
) => {
60+
props.setSort(order, event.shiftKey);
61+
62+
// const sortingFields = props.column.colDef?.context?.fieldToSort || [];
63+
// console.log({ sortingFields });
64+
65+
if (order === 'asc') {
66+
setAscSort('active');
67+
setDescSort('inactive');
68+
} else if (order === 'desc') {
69+
setAscSort('inactive');
70+
setDescSort('active');
71+
} else {
72+
setAscSort('inactive');
73+
setDescSort('inactive');
74+
}
75+
},
76+
[props],
77+
);
78+
79+
const renderSortButtons = () => {
80+
if (!props.enableSorting) return null;
81+
return (
82+
<div className="sort-buttons" style={{ display: 'flex' }}>
83+
<button
84+
type="button"
85+
onClick={(event) => handleSortRequest('asc', event)}
86+
onTouchEnd={(event) => handleSortRequest('asc', event)}
87+
className={`customSortUpLabel ${ascSort}`}
88+
>
89+
<i className="fa fa-long-arrow-alt-up"></i>
90+
</button>
91+
<button
92+
type="button"
93+
onClick={(event) => handleSortRequest('desc', event)}
94+
onTouchEnd={(event) => handleSortRequest('desc', event)}
95+
className={`customSortDownLabel ${descSort}`}
96+
>
97+
<i className="fa fa-long-arrow-alt-down"></i>
98+
</button>
99+
</div>
100+
);
101+
};
102+
103+
return (
104+
<div className="customHeaderLabel-box">
105+
<div
106+
className="customHeaderLabel"
107+
style={{ color: getHeaderColomnColor(styleName!) }}
108+
>
109+
{props.displayName}
110+
</div>
111+
{renderSortButtons()}
112+
</div>
113+
);
114+
};
115+
116+
export default CustomHeaderSummaryTable;

src/components/NavigationComponents/Header/CustomHeaderTable.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,12 @@ import { getHeaderColomnColor } from '@/utils/functions/getColorStyle';
1313

1414
type SortOrder = 'asc' | 'desc' | null;
1515

16-
export interface MyCustomHeaderProps extends CustomHeaderProps {
16+
export interface CustomHeaderTableProps extends CustomHeaderProps {
1717
menuIcon: string;
1818
column: any;
1919
}
2020

21-
const CustomHeaderTable = (props: MyCustomHeaderProps) => {
21+
const CustomHeaderTable = (props: CustomHeaderTableProps) => {
2222
const { styleName } = usePageRouter();
2323
const dispatch: AppDispatch = useDispatch();
2424
const [ascSort, setAscSort] = useState('inactive');
@@ -83,7 +83,7 @@ const CustomHeaderTable = (props: MyCustomHeaderProps) => {
8383

8484
const handleSortRequest = useCallback(
8585
(
86-
order: 'asc' | 'desc' | null,
86+
order: SortOrder,
8787
event:
8888
| React.MouseEvent<HTMLButtonElement>
8989
| React.TouchEvent<HTMLButtonElement>,

src/components/PresentationComponents/Assessment/Estimates/EstimateTable.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -217,7 +217,7 @@ const EstimateTable = () => {
217217
link.target = '_blank';
218218
link.click();
219219
setMode('html');
220-
}, [mode, data]);
220+
}, []);
221221

222222
const handleChangeOptions = useCallback(
223223
(

src/components/PresentationComponents/Assessment/Estimates/EstimatesTabs.tsx

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,29 @@
1-
import { Tabs } from 'antd';
21
import '@/style/cards.scss';
32
import '@/style/estimates.scss';
4-
import { setValueVariable } from '@/redux/getCardFlatObjectSlice';
5-
import { useDispatch, useSelector } from 'react-redux';
6-
import { styleCardEstimate } from '@/styleMUI';
73
import { Box } from '@mui/material';
8-
import MAPComponents from '@/components/PresentationComponents/Map/MAPS';
94
import type { TabsProps } from 'antd';
5+
import { Tabs } from 'antd';
6+
import { useDispatch, useSelector } from 'react-redux';
107
import { useNavigate } from 'react-router-dom';
11-
import { setCurrentBlockName } from '@/redux/getScrollEnslavedPageSlice';
12-
import EstimateTable from './EstimateTable';
13-
import TimeLineGraph from './TimeLineGraph';
14-
import { ASSESSMENT, ESTIMATES } from '@/share/CONST_DATA';
8+
9+
import MAPComponents from '@/components/PresentationComponents/Map/MAPS';
1510
import { usePageRouter } from '@/hooks/usePageRouter';
11+
import { setValueVariable } from '@/redux/getCardFlatObjectSlice';
12+
import { setCurrentBlockName } from '@/redux/getScrollEnslavedPageSlice';
1613
import { AppDispatch, RootState } from '@/redux/store';
14+
import { ASSESSMENT, ESTIMATES } from '@/share/CONST_DATA';
15+
import { styleCardEstimate } from '@/styleMUI';
1716
import { translationLanguagesEstimatePage } from '@/utils/functions/translationLanguages';
1817

18+
import EstimateTable from './EstimateTable';
19+
import TimeLineGraph from './TimeLineGraph';
20+
1921
const EstimatesTabs = () => {
2022
const navigate = useNavigate();
2123
const dispatch: AppDispatch = useDispatch();
2224
const { currentBlockName } = usePageRouter();
2325
const { languageValue } = useSelector(
24-
(state: RootState) => state.getLanguages
26+
(state: RootState) => state.getLanguages,
2527
);
2628

2729
const onChange = (key: string) => {

0 commit comments

Comments
 (0)