Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 | 1x 1x 4x 4x 48x 4x 4x 8x 4x 4x | import { __ } from '@wordpress/i18n';
import { Provider } from 'react-redux';
import useSiteLoadingState from 'hooks/use-loading-state';
import useSearchOptions from 'hooks/use-search-options';
import SearchApp from 'instant-search/components/search-app';
import { buildFilterAggregations } from 'instant-search/lib/api';
import { SERVER_OBJECT_NAME } from 'instant-search/lib/constants';
import { getThemeOptions } from 'instant-search/lib/dom';
import store from 'instant-search/store';
import './styles.scss';
// eslint-disable-next-line no-undef
__webpack_public_path__ = window.JetpackInstantSearchOptions.webpackPublicPath;
const PROPS_FROM_WINDOW = {
aggregations: buildFilterAggregations( [
...window[ SERVER_OBJECT_NAME ].widgets,
...window[ SERVER_OBJECT_NAME ].widgetsOutsideOverlay,
] ),
defaultSort: window[ SERVER_OBJECT_NAME ].defaultSort,
hasOverlayWidgets: !! window[ SERVER_OBJECT_NAME ].hasOverlayWidgets,
options: window[ SERVER_OBJECT_NAME ],
themeOptions: getThemeOptions( window[ SERVER_OBJECT_NAME ] ),
};
/**
* Component for wrapping Jetpack Instant Search application.
*
* @return {Element} component instance
*/
export default function AppWrapper() {
const {
aiAnswersEnabled,
color,
excludedPostTypes,
infiniteScroll,
filteringOpensOverlay,
postDate,
productPrice,
resultFormat,
searchSuggestionsEnabled,
showLogo,
sort,
sortEnabled,
theme,
trigger,
} = useSearchOptions();
const overlayOptions = {
...window[ SERVER_OBJECT_NAME ].overlayOptions,
// Override with defined values from Gutenberg preview.
...Object.fromEntries(
Object.entries( {
colorTheme: theme,
defaultSort: sort,
enableInfScroll: infiniteScroll,
enableFilteringOpensOverlay: filteringOpensOverlay,
enablePostDate: postDate,
enableProductPrice: productPrice,
enableSort: sortEnabled,
excludedPostTypes,
highlightColor: color,
overlayTrigger: trigger,
resultFormat,
showPoweredBy: showLogo,
} ).filter( ( [ , v ] ) => typeof v !== 'undefined' )
),
};
// aiAnswersEnabled + searchSuggestionsEnabled live at the top level of the
// options object; overridden here so the preview reacts to the sidebar. While
// the master is off a saved choice persists unenforced — preview gets false.
const { aiMasterEnabled = true } = window[ SERVER_OBJECT_NAME ];
const options = {
...window[ SERVER_OBJECT_NAME ],
...Object.fromEntries(
Object.entries( {
aiAnswersEnabled: aiMasterEnabled ? aiAnswersEnabled : false,
searchSuggestionsEnabled,
} ).filter( ( [ , v ] ) => typeof v !== 'undefined' )
),
};
const { isLoading } = useSiteLoadingState();
return (
<div
/* translators: accessibility text for the widgets screen content landmark region. */
aria-label={ __( 'Jetpack Search customization preview', 'jetpack-search-pkg' ) }
className="jp-search-configure-app-wrapper"
role="region"
tabIndex="-1"
>
{ isLoading ? (
<img
className="jp-search-configure-loading-spinner"
width="32"
height="32"
alt={ __( 'Loading', 'jetpack-search-pkg' ) }
src="//en.wordpress.com/i/loading/loading-64.gif"
/>
) : (
<Provider store={ store }>
<SearchApp
{ ...PROPS_FROM_WINDOW }
enableAnalytics={ false }
initialIsVisible={ true }
initialShowResults={ true }
isInCustomizer={ false }
options={ options }
overlayOptions={ overlayOptions }
shouldCreatePortal={ false }
shouldIntegrateWithDom={ false }
/>
</Provider>
) }
</div>
);
}
|