@salesforcedevs/arch-components 1.20.17-alpha1 → 1.20.17-alpha10

package/src/modules/sa/explorer/explorer.html

@@ -1,403 +0,0 @@
-<template>
-    <div class="filter-header">
-        <div>
-            <h2 class="filter-title">Search for Patterns & Anti-Patterns</h2>
-            <tds-button onclick={handleResetFiltersClick}
-                >Clear filters</tds-button
-            >
-        </div>
-        <div class="filter-header">
-            <tds-button class="filter-title" onclick={handleFeedbackClick}
-                >Submit feedback</tds-button
-            >
-            <sa-social-share
-                title="Pattern &amp; Anti-Pattern Explorer"
-                url={shareUrl}
-            ></sa-social-share>
-        </div>
-    </div>
-
-    <div class="filter-form">
-        <tds-select
-            id="Trusted"
-            label="Trusted"
-            value={_selectedTrusted}
-            onchange={filterChange}
-        >
-            <option value="-1">Select a Dimension</option>
-            <template for:each={trustedArr} for:item="behavior">
-                <optgroup label={behavior.Name} key={behavior.Name}>
-                    <template
-                        for:each={behavior.Dimensions}
-                        for:item="dimension"
-                    >
-                        <template if:false={dimension.isDisabled}>
-                            <option key={dimension.Name} value={dimension.Name}>
-                                {dimension.Name}
-                            </option>
-                        </template>
-                        <template if:true={dimension.isDisabled}>
-                            <option
-                                key={dimension.Name}
-                                value={dimension.Name}
-                                disabled
-                            >
-                                {dimension.Name}
-                            </option>
-                        </template>
-                    </template>
-                </optgroup>
-            </template>
-        </tds-select>
-
-        <tds-select
-            id="Easy"
-            label="Easy"
-            value={_selectedEasy}
-            onchange={filterChange}
-        >
-            <option value="-1">Select a Dimension</option>
-            <template for:each={easyArr} for:item="behavior">
-                <optgroup label={behavior.Name} key={behavior.Name}>
-                    <template
-                        for:each={behavior.Dimensions}
-                        for:item="dimension"
-                    >
-                        <template if:false={dimension.isDisabled}>
-                            <option key={dimension.Name} value={dimension.Name}>
-                                {dimension.Name}
-                            </option>
-                        </template>
-                        <template if:true={dimension.isDisabled}>
-                            <option
-                                key={dimension.Name}
-                                value={dimension.Name}
-                                disabled
-                            >
-                                {dimension.Name}
-                            </option>
-                        </template>
-                    </template>
-                </optgroup>
-            </template>
-        </tds-select>
-
-        <tds-select
-            id="Adaptable"
-            label="Adaptable"
-            value={_selectedAdaptable}
-            onchange={filterChange}
-        >
-            <option value="-1">Select a Dimension</option>
-            <template for:each={adaptableArr} for:item="behavior">
-                <optgroup label={behavior.Name} key={behavior.Name}>
-                    <template
-                        for:each={behavior.Dimensions}
-                        for:item="dimension"
-                    >
-                        <template if:false={dimension.isDisabled}>
-                            <option key={dimension.Name} value={dimension.Name}>
-                                {dimension.Name}
-                            </option>
-                        </template>
-                        <template if:true={dimension.isDisabled}>
-                            <option
-                                key={dimension.Name}
-                                value={dimension.Name}
-                                disabled
-                            >
-                                {dimension.Name}
-                            </option>
-                        </template>
-                    </template>
-                </optgroup>
-            </template>
-        </tds-select>
-        <tds-select
-            id="ProductArea"
-            label="Product Area"
-            value={_selectedProductArea}
-            onchange={filterChange}
-        >
-            <option value="-1">Select a Product Area</option>
-            <template for:each={productAreasArr} for:item="productArea">
-                <template if:false={productArea.isDisabled}>
-                    <option key={productArea.Name} value={productArea.Name}>
-                        {productArea.Name}
-                    </option>
-                </template>
-                <template if:true={productArea.isDisabled}>
-                    <option
-                        key={productArea.Name}
-                        value={productArea.Name}
-                        disabled
-                    >
-                        {productArea.Name}
-                    </option>
-                </template>
-            </template>
-        </tds-select>
-        <tds-select
-            id="Location"
-            label="Location"
-            value={_selectedLocation}
-            onchange={filterChange}
-        >
-            <option value="-1">Select a Location</option>
-            <template for:each={locationsArr} for:item="location">
-                <template if:false={location.isDisabled}>
-                    <option key={location.Name} value={location.Name}>
-                        {location.Name}
-                    </option>
-                </template>
-                <template if:true={location.isDisabled}>
-                    <option key={location.Name} value={location.Name} disabled>
-                        {location.Name}
-                    </option>
-                </template>
-            </template>
-        </tds-select>
-
-        <div class="search-input">
-            <label class="search-input__label" for="search">Search</label>
-            <div class="search-input__wrapper">
-                <tds-icon
-                    class="search-input__icon"
-                    size="small"
-                    symbol="search"
-                ></tds-icon>
-                <input
-                    id="search"
-                    name="search"
-                    class="search-input__input"
-                    placeholder="Search..."
-                    icon-symbol="search"
-                    aria-label="Search..."
-                    value={_keywordFilter}
-                    oninput={keywordFilterChange}
-                />
-            </div>
-        </div>
-
-        <div class="selected-pills">
-            <template for:each={selectedFilters} for:item="selection">
-                <div key={selection.Name} style="max-width: 200px">
-                    <tds-pill id={selection.Name} onremove={removeFilter}
-                        >{selection.Name}</tds-pill
-                    >
-                </div>
-            </template>
-        </div>
-    </div>
-
-    <div class="table-summary">
-        <div class="page-size-controls">
-            <div>Items per page</div>
-            <tds-select value={pageSize} onchange={handlePageSizeChange}>
-                <option value="10">10</option>
-                <option value="25">25</option>
-                <option value="50">50</option>
-                <option value="100">100</option>
-                <option value="200">200</option>
-            </tds-select>
-        </div>
-        <template if:false={isLoading}>
-            <div>
-                <div class="filter-stats">{filterStatsLabel}</div>
-                <div class="pagination-controls pagination-controls-top">
-                    <tds-button
-                        onclick={handlePreviousPageClick}
-                        disabled={isFirstPage}
-                        >&lt; Previous</tds-button
-                    >
-                    <tds-button
-                        onclick={handleNextPageClick}
-                        disabled={isLastPage}
-                        >Next &gt;</tds-button
-                    >
-                </div>
-            </div>
-            <div class="export-buttons">
-                <div class="export-label">Export current view:</div>
-                <tds-button onclick={handlePdfClick}>
-                    <tds-icon symbol="download"></tds-icon>
-                    &nbsp;&nbsp;PDF
-                </tds-button>
-                <tds-button onclick={handleCsvClick}>
-                    <tds-icon symbol="download"></tds-icon>
-                    &nbsp;&nbsp;CSV
-                </tds-button>
-            </div>
-        </template>
-    </div>
-
-    <tds-tabset active-tab-value="pattern">
-        <tds-tab label="Patterns" value="pattern" title="Patterns">
-            <div class="table-wrapper" id="pattern-table">
-                <table>
-                    <thead>
-                        <tr class="row-title">
-                            <th width="50%">
-                                What Good Looks Like
-                                <p>Pattern</p>
-                            </th>
-                            <th width="20%">
-                                Where to Look
-                                <p>Product Area | Location</p>
-                            </th>
-                            <th width="30%">
-                                Learn More
-                                <p>Dimension | Consideration</p>
-                            </th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <!-- Table data is loaded -->
-                        <template if:false={isLoading}>
-                            <template
-                                for:each={currentPagePatterns}
-                                for:item="pattern"
-                            >
-                                <tr key={pattern.Id} class="row-pattern">
-                                    <td>
-                                        <p>{pattern.Name}</p>
-                                        <p>{pattern.Description}</p>
-                                    </td>
-                                    <td>
-                                        <p>
-                                            {pattern.ProductArea} | In your
-                                            {pattern.Location}
-                                        </p>
-                                    </td>
-                                    <td>
-                                        <p>
-                                            <a
-                                                href={pattern.DimensionURL}
-                                                target="_blank"
-                                                >{pattern.Dimension}</a
-                                            >&nbsp;|&nbsp;
-                                            <a
-                                                href={pattern.ConsiderationURL}
-                                                target="_blank"
-                                                >{pattern.Consideration}</a
-                                            >
-                                        </p>
-                                    </td>
-                                </tr>
-                            </template>
-
-                            <template if:false={hasPatterns}>
-                                <tr>
-                                    <td colspan="3">
-                                        There are no matching patterns for the
-                                        selected dimensions...
-                                    </td>
-                                </tr>
-                            </template>
-                        </template>
-
-                        <!-- Table data is still loading -->
-                        <template if:true={isLoading}>
-                            <tr>
-                                <td colspan="3">
-                                    Select a dimension to get started...
-                                </td>
-                            </tr>
-                        </template>
-                    </tbody>
-                </table>
-            </div>
-        </tds-tab>
-        <tds-tab
-            label="Anti-Patterns"
-            value="anti-pattern"
-            title="Anti-Patterns"
-        >
-            <div class="table-wrapper" id="anti-pattern-table">
-                <table>
-                    <thead>
-                        <tr class="row-title">
-                            <th width="50%">
-                                What to Avoid
-                                <p>Anti-Pattern</p>
-                            </th>
-                            <th width="20%">
-                                Where to Look
-                                <p>Product Area | Location</p>
-                            </th>
-                            <th width="30%">
-                                Learn More
-                                <p>Dimension | Consideration</p>
-                            </th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <!-- Table data is loaded -->
-                        <template if:false={isLoading}>
-                            <template
-                                for:each={currentPageAntiPatterns}
-                                for:item="pattern"
-                            >
-                                <tr key={pattern.Id} class="row-pattern">
-                                    <td>
-                                        <p>{pattern.Name}</p>
-                                        <p>{pattern.Description}</p>
-                                    </td>
-                                    <td>
-                                        <p>
-                                            {pattern.ProductArea} | In your
-                                            {pattern.Location}
-                                        </p>
-                                    </td>
-                                    <td>
-                                        <p>
-                                            <a
-                                                href={pattern.DimensionURL}
-                                                target="_blank"
-                                                >{pattern.Dimension}</a
-                                            >&nbsp;|&nbsp;
-                                            <a
-                                                href={pattern.ConsiderationURL}
-                                                target="_blank"
-                                                >{pattern.Consideration}</a
-                                            >
-                                        </p>
-                                    </td>
-                                </tr>
-                            </template>
-
-                            <template if:false={hasAntiPatterns}>
-                                <tr>
-                                    <td colspan="3">
-                                        There are no matching anti-patterns for
-                                        the selected dimensions...
-                                    </td>
-                                </tr>
-                            </template>
-                        </template>
-
-                        <!-- Table data is still loading -->
-                        <template if:true={isLoading}>
-                            <tr>
-                                <td colspan="3">
-                                    Select a dimension to get started...
-                                </td>
-                            </tr>
-                        </template>
-                    </tbody>
-                </table>
-            </div>
-        </tds-tab>
-    </tds-tabset>
-
-    <template if:false={isLoading}>
-        <div class="pagination-controls">
-            <tds-button onclick={handlePreviousPageClick} disabled={isFirstPage}
-                >&lt; Previous</tds-button
-            >
-            <tds-button onclick={handleNextPageClick} disabled={isLastPage}
-                >Next &gt;</tds-button
-            >
-        </div>
-    </template>
-</template>