How to use the @wordpress/compose.ifCondition function in @wordpress/compose

toggleSelection( selectionEnabled );
		},
		enableNavigationMode() {
			setNavigationMode( true );
		},
	};
} );

export default compose(
	pure,
	withViewportMatch( { isLargeViewport: 'medium' } ),
	applyWithSelect,
	applyWithDispatch,
	// block is sometimes not mounted at the right time, causing it be undefined
	// see issue for more info https://github.com/WordPress/gutenberg/issues/17013
	ifCondition( ( { block } ) => !! block ),
	withFilters( 'editor.BlockListBlock' )
)( BlockListBlock );

},
		toggleSelection( selectionEnabled ) {
			toggleSelection( selectionEnabled );
		},
		setNavigationMode,
	};
} );

export default compose(
	pure,
	withViewportMatch( { isLargeViewport: 'medium' } ),
	applyWithSelect,
	applyWithDispatch,
	// block is sometimes not mounted at the right time, causing it be undefined
	// see issue for more info https://github.com/WordPress/gutenberg/issues/17013
	ifCondition( ( { block } ) => !! block ),
	withFilters( 'editor.BlockListBlock' )
)( BlockListBlock );

export default compose(
	withSelect( ( select ) => {
		const { getEditedPostAttribute, getSuggestedPostFormat } = select( 'core/editor' );
		const supportedFormats = get( select( 'core' ).getThemeSupports(), [ 'formats' ], [] );
		return {
			currentPostFormat: getEditedPostAttribute( 'format' ),
			suggestion: getSuggestion( supportedFormats, getSuggestedPostFormat() ),
		};
	} ),
	withDispatch( ( dispatch ) => ( {
		onUpdatePostFormat( postFormat ) {
			dispatch( 'core/editor' ).editPost( { format: postFormat } );
		},
	} ) ),
	ifCondition( ( { suggestion, currentPostFormat } ) => suggestion && suggestion.id !== currentPostFormat ),
)( PostFormatPanel );

const ConnectedRichTextJustifyButton = compose(
	withSelect( wpSelect => {
		const selectedBlock = wpSelect( 'core/editor' ).getSelectedBlock();
		if ( ! selectedBlock ) {
			return {};
		}
		return {
			blockId: selectedBlock.clientId,
			blockName: selectedBlock.name,
			isBlockJustified: 'justify' === get( selectedBlock, 'attributes.align' ),
		};
	} ),
	withDispatch( dispatch => ( {
		updateBlockAttributes: dispatch( 'core/editor' ).updateBlockAttributes,
	} ) ),
	ifCondition( props => 'core/paragraph' === props.blockName )
)( RichTextJustifyButton );

registerFormatType( 'wpcom/justify', {
	title: wpcomGutenberg.richTextToolbar.justify,
	tagName: 'p',
	className: null,
	edit: ConnectedRichTextJustifyButton,
} );

className="edit-post-sidebar"
				role="region"
				aria-label={ label }
				tabIndex="-1"
			>
				{ children }
			
		
	);
};

const WrappedSidebar = compose(
	withSelect( ( select, { name } ) => ( {
		isActive: select( 'core/edit-post' ).getActiveGeneralSidebarName() === name,
	} ) ),
	ifCondition( ( { isActive } ) => isActive ),
	withFocusReturn,
)( Sidebar );

WrappedSidebar.Slot = Slot;

export default WrappedSidebar;

function AnimatedSidebarFill( props ) {
	return (
		
			
				{ () =>  }
			
		
	);
}

const WrappedSidebar = compose(
	withSelect( ( select, { name } ) => ( {
		isActive: select( 'core/edit-post' ).getActiveGeneralSidebarName() === name,
	} ) ),
	ifCondition( ( { isActive } ) => isActive ),
)( AnimatedSidebarFill );

WrappedSidebar.Slot = Slot;

export default WrappedSidebar;

const { localAutosaveInterval } = useSelect( ( select ) => ( {
		localAutosaveInterval: select( 'core/editor' )
			.getEditorSettings().__experimentalLocalAutosaveInterval,
	} ) );

	return (
		
	);
}

export default ifCondition( hasSessionStorageSupport )( LocalAutosaveMonitor );

function ChildBlocks( { rootBlockIcon, rootBlockTitle, items, ...props } ) {
	return (
		<div>
			{ ( rootBlockIcon || rootBlockTitle ) &amp;&amp; (
				<div>
					
					{ rootBlockTitle &amp;&amp; <h2>{ rootBlockTitle }</h2> }
				</div>
			) }
			
		</div>
	);
}

export default compose(
	ifCondition( ( { items } ) =&gt; items &amp;&amp; items.length &gt; 0 ),
	withSelect( ( select, { rootClientId } ) =&gt; {
		const {
			getBlockType,
		} = select( 'core/blocks' );
		const {
			getBlockName,
		} = select( 'core/block-editor' );
		const rootBlockName = getBlockName( rootClientId );
		const rootBlockType = getBlockType( rootBlockName );
		return {
			rootBlockTitle: rootBlockType &amp;&amp; rootBlockType.title,
			rootBlockIcon: rootBlockType &amp;&amp; rootBlockType.icon,
		};
	} ),
)( ChildBlocks );

return null;
	}
}

export default compose(
	withSelect( ( select ) => {
		const postType = select( 'core/editor' ).getCurrentPostType();
		const tagsTaxonomy = select( 'core' ).getTaxonomy( 'post_tag' );
		const tags = tagsTaxonomy && select( 'core/editor' ).getEditedPostAttribute( tagsTaxonomy.rest_base );
		return {
			areTagsFetched: tagsTaxonomy !== undefined,
			isPostTypeSupported: tagsTaxonomy && some( tagsTaxonomy.types, ( type ) => type === postType ),
			hasTags: tags && tags.length,
		};
	} ),
	ifCondition( ( { areTagsFetched, isPostTypeSupported } ) => isPostTypeSupported && areTagsFetched ),
)( MaybeTagsPanel );

*/
const Sidebar = ( { children, label } ) => {
	return (
		
			<div tabindex="-1" label="" aria-label="{" role="region">
				{ children }
			</div>
		
	);
};

const WrappedSidebar = compose(
	withSelect( ( select, { name } ) =&gt; ( {
		isActive: select( 'core/edit-post' ).getActiveGeneralSidebarName() === name,
	} ) ),
	ifCondition( ( { isActive } ) =&gt; isActive ),
	withFocusReturn
)( Sidebar );

WrappedSidebar.Slot = Slot;

export default WrappedSidebar;