import * as React from "react" ; import * as ReactDom from 'react-dom' ; import { override } from '@microsoft/decorators' ; import { Log } from '@microsoft/sp-core-library' ; import { BaseApplicationCustomizer , PlaceholderContent , PlaceholderName } from '@microsoft/sp-application-base' ; import * as strings from 'siteBreadcrumbStrings' ; import SiteBreadcrumb from './components/SiteBreadcrumb' ; import { ISiteBreadcrumbProps } from './components/ISiteBreadcrumb' ; const LOG_SOURCE = 'SiteBreadcrumbApplicationCustomizer' ; /**
 * If your command set uses the ClientSideComponentProperties JSON input,
 * it will be deserialized into the BaseExtension.properties object.
 * You can define an interface to describe it.
 */ export interface ISiteBreadcrumbApplicationCustomizerProperties { testMessage : string ; } /** A Custom Action which can be run during execution of a Client Side Application */ export default class SiteBreadcrumbApplicationCustomizer extends BaseApplicationCustomizer < ISiteBreadcrumbApplicationCustomizerProperties > { private _headerPlaceholder : PlaceholderContent ; @ override public onInit ( ) { Log . info ( LOG_SOURCE , `Initialized ${ strings . Title }` ) ; this . context . placeholderProvider . changedEvent . add ( this , this . _renderPlaceHolders ) ; this . _renderPlaceHolders ( ) ; return Promise . resolve < void > ( ) ; } private _renderPlaceHolders ( ) { if ( ! this . _headerPlaceholder && this . context . placeholderProvider . placeholderNames . indexOf ( PlaceholderName . Top ) !== - 1 ) { this . _headerPlaceholder = this . context . placeholderProvider . tryCreateContent ( PlaceholderName . Top , { onDispose : this . _onDispose } ) ; if ( ! this . _headerPlaceholder ) { console . error ( 'The expected placeholder (PageHeader) was not found.' ) ; return ; } if ( this . _headerPlaceholder . domElement ) { const element = React . createElement ( SiteBreadcrumb , { context : this . context } ) ; ReactDom . render ( element , this . _headerPlaceholder . domElement ) ; } } } private _onDispose ( ) { console . log ( '[Breadcrumb._onDispose] Disposed breadcrumb.' ) ; } }