From fc09a29dcf2816145cc36ddb0e6e13dc32ec1991 Mon Sep 17 00:00:00 2001 From: Abhishek P Anil Date: Fri, 22 Sep 2023 16:24:49 +0530 Subject: [PATCH] fix: fixed the organizer ,performer and supporter not showing in read only page --- .../TreeSelectOption/TreeSelectOption.jsx | 2 +- .../Dashboard/EventReadOnly/EventReadOnly.jsx | 227 ++++++++---------- 2 files changed, 96 insertions(+), 133 deletions(-) diff --git a/src/components/TreeSelectOption/TreeSelectOption.jsx b/src/components/TreeSelectOption/TreeSelectOption.jsx index 52d4e6fb0..0a0cd451f 100644 --- a/src/components/TreeSelectOption/TreeSelectOption.jsx +++ b/src/components/TreeSelectOption/TreeSelectOption.jsx @@ -15,7 +15,7 @@ function TreeSelectOption(props) { showSearch treeNodeFilterProp={'title'} {...props} - showArrow + showArrow={props?.showArrow ?? true} /> ); } diff --git a/src/pages/Dashboard/EventReadOnly/EventReadOnly.jsx b/src/pages/Dashboard/EventReadOnly/EventReadOnly.jsx index 4ce0ef8b3..d5bb93ccc 100644 --- a/src/pages/Dashboard/EventReadOnly/EventReadOnly.jsx +++ b/src/pages/Dashboard/EventReadOnly/EventReadOnly.jsx @@ -1,6 +1,6 @@ import React, { useState, useEffect, useRef } from 'react'; import { Row, Col, Button } from 'antd'; -import Icon, { CalendarOutlined, UserOutlined, InfoCircleOutlined } from '@ant-design/icons'; +import { CalendarOutlined, InfoCircleOutlined } from '@ant-design/icons'; import moment from 'moment-timezone'; import './eventReadOnly.css'; import { useTranslation } from 'react-i18next'; @@ -27,9 +27,8 @@ import SelectOption from '../../../components/Select/SelectOption'; import { offerTypes } from '../../../constants/ticketOffers'; import { placesOptions } from '../../../components/Select/selectOption.settings'; import { entitiesClass } from '../../../constants/entitiesClass'; -import { useGetEntitiesQuery } from '../../../services/entities'; +// import { useGetEntitiesQuery } from '../../../services/entities'; import SelectionItem from '../../../components/List/SelectionItem'; -import { ReactComponent as Organizations } from '../../../assets/icons/organisations.svg'; import Alert from '../../../components/Alert'; import { eventPublishState, eventPublishStateOptions } from '../../../constants/eventPublishState'; import { pluralize } from '../../../utils/pluralise'; @@ -61,17 +60,20 @@ function EventReadOnly() { query.append('classes', entitiesClass.organization); query.append('classes', entitiesClass.person); - const { currentData: initialEntities, isLoading: initialEntityLoading } = useGetEntitiesQuery({ - calendarId, - searchKey: '', - classes: decodeURIComponent(query.toString()), - sessionId: timestampRef, - }); + // const { currentData: initialEntities, isLoading: initialEntityLoading } = useGetEntitiesQuery({ + // calendarId, + // searchKey: '', + // classes: decodeURIComponent(query.toString()), + // sessionId: timestampRef, + // }); const [getAllTaxonomy] = useLazyGetAllTaxonomyQuery({ sessionId: timestampRef }); const { user } = useSelector(getUserDetails); const [dateType, setDateType] = useState(); const [locationPlace, setLocationPlace] = useState(); + const [selectedOrganizers, setSelectedOrganizers] = useState([]); + const [selectedPerformers, setSelectedPerformers] = useState([]); + const [selectedSupporters, setSelectedSupporters] = useState([]); const calendar = user?.roles.filter((calendar) => { return calendar.calendarId === calendarId; @@ -96,7 +98,45 @@ function EventReadOnly() { setDateType( dateTimeTypeHandler(eventData?.startDate, eventData?.startDateTime, eventData?.endDate, eventData?.endDateTime), ); - + if (eventData?.organizer) { + let initialOrganizers = eventData?.organizer?.map((organizer) => { + return { + disambiguatingDescription: organizer?.entity?.disambiguatingDescription, + id: organizer?.entityId, + name: organizer?.entity?.name, + type: organizer?.type, + logo: organizer?.entity?.logo, + image: organizer?.entity?.image, + }; + }); + setSelectedOrganizers(treeEntitiesOption(initialOrganizers, user, calendarContentLanguage)); + } + if (eventData?.performer) { + let initialPerformers = eventData?.performer?.map((performer) => { + return { + disambiguatingDescription: performer?.entity?.disambiguatingDescription, + id: performer?.entityId, + name: performer?.entity?.name, + type: performer?.type, + logo: performer?.entity?.logo, + image: performer?.entity?.image, + }; + }); + setSelectedPerformers(treeEntitiesOption(initialPerformers, user, calendarContentLanguage)); + } + if (eventData?.collaborators) { + let initialSupporters = eventData?.collaborators?.map((supporter) => { + return { + disambiguatingDescription: supporter?.entity?.disambiguatingDescription, + id: supporter?.entityId, + name: supporter?.entity?.name, + type: supporter?.type, + logo: supporter?.entity?.logo, + image: supporter?.entity?.image, + }; + }); + setSelectedSupporters(treeEntitiesOption(initialSupporters, user, calendarContentLanguage)); + } if (initialPlace && initialPlace?.length > 0) { initialPlace[0] = { ...initialPlace[0], @@ -143,8 +183,7 @@ function EventReadOnly() { return ( !isLoading && - !taxonomyLoading && - !initialEntityLoading && ( + !taxonomyLoading && (
@@ -243,6 +282,7 @@ function EventReadOnly() { - organizer?.entityId)} - disabled={true} - bordered={false} - treeData={treeEntitiesOption(initialEntities, user, calendarContentLanguage)} - tagRender={(props) => { - const { value } = props; - let entity = initialEntities?.filter((entity) => entity?.id == value); - return ( - entity && - entity[0] && ( - - ) : ( - entity[0]?.type?.toUpperCase() == taxonomyClass.PERSON && ( - - ) - ) - } - name={contentLanguageBilingual({ - en: entity[0]?.name?.en, - fr: entity[0]?.name?.fr, - interfaceLanguage: user?.interfaceLanguage?.toLowerCase(), - calendarContentLanguage: calendarContentLanguage, - })} - description={contentLanguageBilingual({ - en: entity[0]?.disambiguatingDescription?.en, - fr: entity[0]?.disambiguatingDescription?.fr, - interfaceLanguage: user?.interfaceLanguage?.toLowerCase(), - calendarContentLanguage: calendarContentLanguage, - })} - bordered - /> - ) - ); - }} - /> + {selectedOrganizers?.map((organizer, index) => { + return ( + + ); + })} )} {eventData?.contactPoint && ( @@ -752,46 +767,19 @@ function EventReadOnly() { {t('dashboard.events.addEditEvent.otherInformation.performer.title')}

- performer?.entityId)} - disabled={true} - bordered={false} - treeData={treeEntitiesOption(initialEntities, user, calendarContentLanguage)} - tagRender={(props) => { - const { value } = props; - let entity = initialEntities?.filter((entity) => entity?.id == value); - return ( - entity && - entity[0] && ( - - ) : ( - entity[0]?.type?.toUpperCase() == taxonomyClass.PERSON && ( - - ) - ) - } - name={contentLanguageBilingual({ - en: entity[0]?.name?.en, - fr: entity[0]?.name?.fr, - interfaceLanguage: user?.interfaceLanguage?.toLowerCase(), - calendarContentLanguage: calendarContentLanguage, - })} - description={contentLanguageBilingual({ - en: entity[0]?.disambiguatingDescription?.en, - fr: entity[0]?.disambiguatingDescription?.fr, - interfaceLanguage: user?.interfaceLanguage?.toLowerCase(), - calendarContentLanguage: calendarContentLanguage, - })} - bordered - /> - ) - ); - }} - /> + {selectedPerformers?.map((performer, index) => { + return ( + + ); + })} )} {eventData?.collaborators?.length > 0 && ( @@ -800,46 +788,19 @@ function EventReadOnly() { {t('dashboard.events.addEditEvent.otherInformation.supporter.title')}

- collaborator?.entityId)} - disabled={true} - bordered={false} - treeData={treeEntitiesOption(initialEntities, user, calendarContentLanguage)} - tagRender={(props) => { - const { value } = props; - let entity = initialEntities?.filter((entity) => entity?.id == value); - return ( - entity && - entity[0] && ( - - ) : ( - entity[0]?.type?.toUpperCase() == taxonomyClass.PERSON && ( - - ) - ) - } - name={contentLanguageBilingual({ - en: entity[0]?.name?.en, - fr: entity[0]?.name?.fr, - interfaceLanguage: user?.interfaceLanguage?.toLowerCase(), - calendarContentLanguage: calendarContentLanguage, - })} - description={contentLanguageBilingual({ - en: entity[0]?.disambiguatingDescription?.en, - fr: entity[0]?.disambiguatingDescription?.fr, - interfaceLanguage: user?.interfaceLanguage?.toLowerCase(), - calendarContentLanguage: calendarContentLanguage, - })} - bordered - /> - ) - ); - }} - /> + {selectedSupporters?.map((supporter, index) => { + return ( + + ); + })} )} {eventData?.url && eventData?.url?.uri && ( @@ -911,6 +872,7 @@ function EventReadOnly() { style={{ marginBottom: '1rem' }} bordered={false} open={false} + showArrow={false} disabled treeData={treeTaxonomyOptions( allTaxonomyData, @@ -953,6 +915,7 @@ function EventReadOnly() { style={{ marginBottom: '1rem' }} bordered={false} open={false} + showArrow={false} disabled treeData={treeTaxonomyOptions( allTaxonomyData,