Spaces:
Runtime error
Runtime error
File size: 2,071 Bytes
8fd7a1d |
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 |
import React from 'react';
import PropTypes from 'prop-types';
import omit from 'lodash.omit';
import {connect} from 'react-redux';
import {setFontsLoaded} from '../reducers/fonts-loaded';
import {loadFonts} from 'scratch-render-fonts';
/* Higher Order Component to provide behavior for loading fonts.
* @param {React.Component} WrappedComponent component to receive fontsLoaded prop
* @returns {React.Component} component with font loading behavior
*/
const FontLoaderHOC = function (WrappedComponent) {
class FontLoaderComponent extends React.Component {
componentDidMount () {
if (this.props.fontsLoaded) return;
// Load fonts asynchronously without blocking the UI
const startTime = performance.now();
loadFonts()
.then(() => {
const loadTime = performance.now() - startTime;
console.log(`🔤 Fonts loaded in ${loadTime.toFixed(2)}ms`);
this.props.onSetFontsLoaded();
})
.catch(() => {
// Don't block loading if fonts fail - continue without custom fonts
console.warn('⚠️ Font loading failed, continuing with system fonts');
this.props.onSetFontsLoaded();
});
}
render () {
const componentProps = omit(this.props, ['onSetFontsLoaded']);
return (
<WrappedComponent
{...componentProps}
/>
);
}
}
FontLoaderComponent.propTypes = {
fontsLoaded: PropTypes.bool.isRequired,
onSetFontsLoaded: PropTypes.func.isRequired
};
const mapStateToProps = state => ({
fontsLoaded: state.scratchGui.fontsLoaded
});
const mapDispatchToProps = dispatch => ({
onSetFontsLoaded: () => dispatch(setFontsLoaded())
});
return connect(
mapStateToProps,
mapDispatchToProps
)(FontLoaderComponent);
};
export {
FontLoaderHOC as default
};
|