public render()

in fronts-client/src/components/FrontsEdit/Collection.tsx [122:250]
128 lines of code
5 McCabe index (conditional complexity)

	public render() {
		const {
			id,
			frontId,
			handleBlur,
			priority,
			alsoOn,
			browsingStage,
			size = 'default',
			handleMove,
			handleInsert,
			handleArticleFocus,
			selectCard,
			removeCard,
			removeSupportingCard,
			lastDesktopArticle,
			lastMobileArticle,
			updateCardMeta,
			addImageToCard,
		} = this.props;

		return (
			<CollectionWrapper data-testid="collection">
				<Collection
					key={id}
					id={id}
					priority={priority}
					frontId={frontId}
					alsoOn={alsoOn}
					canPublish={browsingStage !== 'live'}
					browsingStage={browsingStage}
				>
					{(group, isUneditable, groupIds, groups, showGroupName) => (
						<div key={group.uuid}>
							<GroupDisplayComponent
								key={group.uuid}
								groupName={showGroupName ? group.name : null}
							/>
							<GroupLevel
								isUneditable={isUneditable}
								groupId={group.uuid}
								collectionId={id}
								groupName={group.name ? group.name : ''}
								groupIds={groupIds}
								groupMaxItems={group.maxItems}
								groups={groups}
								onMove={handleMove}
								onDrop={handleInsert}
								cardIds={group.cards}
							>
								{(card, getAfNodeProps) => (
									<>
										<FocusWrapper
											tabIndex={0}
											area="collection"
											onBlur={() => handleBlur()}
											onFocus={(e: React.FocusEvent<HTMLDivElement>) =>
												handleArticleFocus(e, group.uuid, card, frontId)
											}
											uuid={card.uuid}
										>
											<Card
												frontId={frontId}
												collectionId={id}
												uuid={card.uuid}
												parentId={group.uuid}
												isUneditable={isUneditable}
												size={size}
												canShowPageViewData={true}
												getNodeProps={() => getAfNodeProps(isUneditable)}
												onSelect={() => selectCard(card.uuid, id, false)}
												onDelete={() => removeCard(group.uuid, card.uuid)}
												groupSizeId={group.id ? parseInt(group.id) : 0}
												updateCardMeta={updateCardMeta}
												addImageToCard={addImageToCard}
											>
												<CardLevel
													isUneditable={isUneditable}
													cardId={card.uuid}
													groupName={group.name ? group.name : ''}
													groupIds={groupIds}
													groups={groups}
													onMove={handleMove}
													onDrop={handleInsert}
													cardTypeAllowList={this.getPermittedCardTypes(
														card.cardType,
													)}
													dropMessage={this.getDropMessage(card.cardType)}
												>
													{(supporting, getSupportingProps) => (
														<Card
															frontId={frontId}
															uuid={supporting.uuid}
															parentId={card.uuid}
															canShowPageViewData={false}
															onSelect={() =>
																selectCard(supporting.uuid, id, true)
															}
															isUneditable={isUneditable}
															getNodeProps={() =>
																getSupportingProps(isUneditable)
															}
															onDelete={() =>
																removeSupportingCard(card.uuid, supporting.uuid)
															}
															size="small"
															updateCardMeta={updateCardMeta}
															addImageToCard={addImageToCard}
														/>
													)}
												</CardLevel>
											</Card>
										</FocusWrapper>
										<VisibilityDivider
											notifications={getArticleNotifications(
												card.uuid,
												lastDesktopArticle,
												lastMobileArticle,
											)}
										/>
									</>
								)}
							</GroupLevel>
						</div>
					)}
				</Collection>
			</CollectionWrapper>
		);
	}