public render()

in fronts-client/src/components/Clipboard.tsx [141:249]
109 lines of code
2 McCabe index (conditional complexity)

	public render() {
		const {
			isClipboardOpen,
			clipboardHasOpenForms,
			clipboardHasContent,
			selectCard,
			removeCard,
			removeSupportingCard,
			updateCardMeta,
			addImageToCard,
		} = this.props;
		return (
			<React.Fragment>
				{isClipboardOpen && (
					<ClipboardWrapper
						tabIndex={0}
						onFocus={this.handleFocus}
						onBlur={this.handleBlur}
						ref={this.clipboardWrapper as Ref}
						clipboardHasOpenForms={clipboardHasOpenForms}
					>
						<StyledDragIntentContainer
							active={!isClipboardOpen}
							delay={300}
							onDragIntentStart={() => this.setState({ preActive: true })}
							onDragIntentEnd={() => this.setState({ preActive: false })}
						>
							<ClipboardBody>
								<ClipboardHeader>
									<ClearClipboardButton
										disabled={!clipboardHasContent}
										onClick={this.props.clearClipboard}
									>
										<ButtonLabel>Clear clipboard</ButtonLabel>
									</ClearClipboardButton>
								</ClipboardHeader>
								<DragAndDropRoot
									id="clipboard"
									data-testid="clipboard"
									style={{ display: 'flex', flex: 1 }}
								>
									<ClipboardLevel
										onMove={this.handleMove}
										onDrop={this.handleInsert}
									>
										{(card, getAfProps) => (
											<>
												<FocusWrapper
													tabIndex={0}
													onFocus={(e: React.FocusEvent<HTMLDivElement>) =>
														this.handleArticleFocus(e, card)
													}
													area="clipboard"
													onBlur={this.handleBlur}
													uuid={card.uuid}
												>
													<Card
														uuid={card.uuid}
														parentId={clipboardId}
														frontId={clipboardId}
														getNodeProps={getAfProps}
														showMeta={false}
														canDragImage={false}
														canShowPageViewData={false}
														textSize="small"
														onSelect={selectCard}
														onDelete={() => removeCard(card.uuid)}
														updateCardMeta={updateCardMeta}
														addImageToCard={addImageToCard}
													>
														<CardLevel
															cardId={card.uuid}
															onMove={this.handleMove}
															onDrop={this.handleInsert}
														>
															{(supporting, getSProps, i, arr) => (
																<Card
																	uuid={supporting.uuid}
																	frontId={clipboardId}
																	parentId={card.uuid}
																	canShowPageViewData={false}
																	getNodeProps={getSProps}
																	size="small"
																	showMeta={false}
																	onSelect={(id) => selectCard(id, true)}
																	onDelete={() =>
																		removeSupportingCard(
																			card.uuid,
																			supporting.uuid,
																		)
																	}
																	updateCardMeta={updateCardMeta}
																	addImageToCard={addImageToCard}
																/>
															)}
														</CardLevel>
													</Card>
												</FocusWrapper>
											</>
										)}
									</ClipboardLevel>
								</DragAndDropRoot>
							</ClipboardBody>
						</StyledDragIntentContainer>
					</ClipboardWrapper>
				)}
			</React.Fragment>
		);
	}