@mikezimm/fps-library-v2/lib/components/molecules/Categories/Highlights/HighlightRegArrays.js

Library of reusable typescript/javascript functions, interfaces and constants

import * as React from 'react';
import { highlightStringBetweenB } from './highlightRegex';
// 2024-07-29:  Migrated from HubCon only updating css require
require('@mikezimm/fps-styles/dist/HighlightReg.css');
/**
 * Originally made for Hub Connections auto-filter buttons
 * HighlightRegArrays will show all ICustomRegexSearch arrays and keys and highlight any matches if blueAllRegex === false.
 * @param CustomSearch
 * @param testString
 * @param blueAllRegex
 * @returns
 */
export function HighlightRegArrays(CustomSearch, testString, blueAllRegex = false) {
    const MatchedRegex = [];
    const CustomSearchElement = React.createElement("div", { className: 'regArrays' }, Object.keys(CustomSearch).map(key => {
        // Added next line for https://github.com/fps-solutions/HubCon/issues/96
        if (CustomSearch[key].length < 1)
            return undefined;
        return React.createElement("div", { key: key, className: 'ARegexCat' },
            React.createElement("h2", null, key),
            React.createElement("ul", null, CustomSearch[key].map(reg => {
                const wasFound = testString.match(reg) ? true : false;
                if (wasFound === true)
                    MatchedRegex.push(reg);
                const highlighted = wasFound === false ? highlightStringBetweenB(`${reg}`, false) : highlightStringBetweenB(`${reg}`, true);
                // console.log( `render highlighted type = ${ typeof highlighted }`, `${reg}`);
                return React.createElement("li", { className: blueAllRegex === true ? 'regHelp' : wasFound === true ? 'regMatch' : 'regNull', key: `${reg}` }, highlighted);
            })));
    }));
    // eslint-disable-next-line @rushstack/security/no-unsafe-regexp
    const combinedRegex = new RegExp(MatchedRegex.map(r => r.source).join('|'), 'g');
    const stringToSearch = testString;
    const matches = stringToSearch.match(combinedRegex);
    console.log('HubCategories ~ render matches', matches);
    return CustomSearchElement;
}
export const RegexSiteInfo = React.createElement("div", null,
    React.createElement("div", null,
        "If a site/subsite",
        `'`,
        "s Title or Description has any of the words in ",
        React.createElement("b", { style: { color: 'blue' } }, "blue"),
        ", the site should show up in the Category Name at the top of each group."));
/**
 * pass in extraInfo such as RegexSiteInfo above which is what we use in Hub Connections web part
 * @param extraInfo
 * @returns
 */
export function GeneralRegexInfo(extraInfo, headingClass) {
    return React.createElement("div", null,
        React.createElement("div", { className: headingClass ? headingClass : 'secHeading' }, "The details:"),
        React.createElement("div", null,
            "We are using ",
            React.createElement("a", { rel: "noreferrer", target: '_blank', href: 'https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions' }, " Javascript Regular Expressions"),
            " to determine the categories a site falls under."),
        extraInfo,
        React.createElement("div", null,
            "One caveate in these Regular Expressions:  If it ends in '/gi' they are not case sensitive.  If it ",
            React.createElement("span", { style: { fontWeight: 600 } }, "ends in '/g', the ARE case sensitive"),
            "."),
        React.createElement("div", null,
            "Copy the Regular Expression to a tool like ",
            React.createElement("a", { rel: "noreferrer", target: '_blank', href: 'https://regex101.com/' }, "Regex 101"),
            " in order to test on some text."));
}
//# sourceMappingURL=HighlightRegArrays.js.map