How to use the inflection.humanize function in inflection

render() {
        const { title, children, isLoading, resource, validation } = this.props;
        const basePath = this.getBasePath();
        return (
            
                
                    
                
                } />
                
                    {children}
                
            
        );
    }
}

render() {
        const {
            basePath,
            children,
            isLoading,
            resource,
            translate,
        } = this.props;

        if (!children) return null;

        const resourceName = translate(`resources.${resource}.name`, {
            smart_count: 1,
            _: inflection.humanize(inflection.singularize(resource)),
        });
        const defaultTitle = translate('ra.page.create', {
            name: `${resourceName}`,
        });
        return children({
            isLoading,
            defaultTitle,
            save: this.save,
            resource,
            basePath,
            record: this.record,
            redirect: this.defaultRedirectRoute(),
            translate,
        });
    }
}

children,
            record,
            id,
            isLoading,
            resource,
            translate,
            version,
        } = this.props;

        if (!children) return null;

        const basePath = this.getBasePath();

        const resourceName = translate(`resources.${resource}.name`, {
            smart_count: 1,
            _: inflection.humanize(inflection.singularize(resource)),
        });
        const defaultTitle = translate('ra.page.edit', {
            name: `${resourceName}`,
            id,
            record,
        });

        return children({
            isLoading,
            defaultTitle,
            save: this.save,
            resource,
            basePath,
            record,
            redirect: this.defaultRedirectRoute(),
            version,

private _computeName() {
        this.name = inflection.humanize(inflection.underscore(this.id));
    }

<button label="{label}">
                {icon}
            </button>
            
        
    );
};

const {
            actions = ,
            children,
            isLoading,
            resource,
            title,
            translate,
            hasList,
        } = this.props;

        if (!children) return null;
        const basePath = this.getBasePath();

        const resourceName = translate(`resources.${resource}.name`, {
            smart_count: 1,
            _: inflection.humanize(inflection.singularize(resource)),
        });
        const defaultTitle = translate('aor.page.create', {
            name: `${resourceName}`,
        });
        const titleElement = (
            <title title="{title}">
        );

        return (
            &lt;div className="create-page"&gt;
                &lt;Card style={{ opacity: isLoading ? 0.8 : 1 }}&gt;
                    {actions &amp;&amp;
                        React.cloneElement(actions, {
                            basePath,
                            resource,
                            hasList,</title>

render() {
        const { title, children, id, data, isLoading, resource, hasDelete, hasShow, validation } = this.props;
        const basePath = this.getBasePath();

        return (
            
                
                    {hasShow && }
                    
                    {hasDelete && }
                
                } />
                {data && 
                    {children}
                }
            
        );
    }
}

hasList,
            id,
            isLoading,
            resource,
            title,
            translate,
            version,
        } = this.props;

        if (!children) return null;

        const basePath = this.getBasePath();

        const resourceName = translate(`resources.${resource}.name`, {
            smart_count: 1,
            _: inflection.humanize(inflection.singularize(resource)),
        });
        const defaultTitle = translate('aor.page.edit', {
            name: `${resourceName}`,
            id,
            data,
        });
        const titleElement = data ? (
            <title title="{title}">
        ) : (
            ''
        );

        return (
            &lt;div className="edit-page"&gt;
                &lt;Card style={{ opacity: isLoading ? 0.8 : 1 }}&gt;
                    {actions &amp;&amp;</title>

function parseTitle(name) {
  var match = name.match(/\d{14}-([^\.]+)/);
  var dashed = match[1];
  return inflection.humanize(dashed, true);
}

render() {
        const { actions = , children, isLoading, resource, title, translate } = this.props;
        const basePath = this.getBasePath();

        const resourceName = translate(`resources.${resource}.name`, {
            smart_count: 1,
            _: inflection.humanize(inflection.singularize(resource)),
        });
        const defaultTitle = translate('aor.page.create', {
            name: `${resourceName}`,
        });
        const titleElement = <title title="{title}">;

        return (
            &lt;div className="create-page"&gt;
                &lt;Card style={{ opacity: isLoading ? 0.8 : 1 }}&gt;
                    {actions &amp;&amp; React.cloneElement(actions, {
                        basePath,
                        resource,
                    })}
                    &lt;ViewTitle title={titleElement} /&gt;
                    {React.cloneElement(children, {
                        save: this.save,</title>