Skip to content

Commit

Permalink
Move filters
Browse files Browse the repository at this point in the history
  • Loading branch information
@ludeeus
ludeeus committed May 16, 2020
1 parent 2d147ca commit 62c49df
Show file tree
Hide file tree
Showing 6 changed files with 201 additions and 156 deletions.
104 changes: 62 additions & 42 deletions src/components/dialogs/hacs-add-repository-dialog.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,62 +10,45 @@ import {
} from "lit-element";
import { classMap } from "lit-html/directives/class-map";
import { HacsDialogBase } from "./hacs-dialog-base";
import { Repository, sortRepositoriesByName } from "../../data/common";
import { Repository } from "../../data/common";

import { localize } from "../../localize/localize";
import { repositoriesInActiveCategory } from "../../tools/filter";

import "../hacs-search";

@customElement("hacs-add-repository-dialog")
export class HacsAddRepositoryDialog extends HacsDialogBase {
@property() private _searchInput: string = "";

private _searchFilter(repo: Repository): boolean {
const input = this._searchInput.toLocaleLowerCase();
if (input === "") return true;
if (repo.name.toLocaleLowerCase().includes(input)) return true;
if (repo.description?.toLocaleLowerCase().includes(input)) return true;
if (repo.category.toLocaleLowerCase().includes(input)) return true;
if (repo.full_name.toLocaleLowerCase().includes(input)) return true;
if (String(repo.authors)?.toLocaleLowerCase().includes(input)) return true;
if (repo.domain?.toLocaleLowerCase().includes(input)) return true;
return false;
}
private _repositoriesInActiveCategory = memoizeOne(
(repositories: Repository[], categories: string[]) =>
repositories.filter((repo) => categories.includes(repo.category))
);

private _filterRepositories = memoizeOne(
(repositories: Repository[], filter: string) =>
repositories.filter(
(repo) =>
repo.name.includes(filter) ||
repo.description?.toLocaleLowerCase().includes(filter) ||
repo.category.toLocaleLowerCase().includes(filter) ||
repo.full_name.toLocaleLowerCase().includes(filter) ||
String(repo.authors)?.toLocaleLowerCase().includes(filter) ||
repo.domain?.toLocaleLowerCase().includes(filter)
)
);

protected render(): TemplateResult | void {
this._searchInput = window.localStorage.getItem("hacs-search");
if (!this.active) return html``;
const repositoryCards = sortRepositoriesByName(
repositoriesInActiveCategory(

const repositories = this._filterRepositories(
this._repositoriesInActiveCategory(
this.repositories,
this.configuration?.categories
)?.filter((repo) => this._searchFilter(repo))
)?.map(
(repo) => html`<paper-icon-item
class=${classMap({ narrow: this.narrow })}
@click=${() => this._openInformation(repo)}
>
${repo.category === "integration"
? html`
<img
src="https://brands.home-assistant.io/_/${repo.domain}/icon.png"
referrerpolicy="no-referrer"
@error=${this._onImageError}
@load=${this._onImageLoad}
/>
`
: html`<ha-icon icon="mdi:github-circle" slot="item-icon"></ha-icon>`}
<paper-item-body three-line
>${repo.name}
<div secondary>${repo.description}</div>
<div secondary>
${localize("settings.category")}:
${localize(`common.${repo.category}`)}
</div></paper-item-body
>
</paper-icon-item>`
),
this._searchInput.toLocaleLowerCase()
);

return html`
<hacs-dialog
.active=${this.active}
Expand All @@ -79,7 +62,44 @@ export class HacsAddRepositoryDialog extends HacsDialogBase {
@input=${this._inputValueChanged}
></hacs-search>
<div class="list"></div>
${repositoryCards}
${repositories.slice(0, 100).map(
(repo) => html`<paper-icon-item
class=${classMap({ narrow: this.narrow })}
@click=${() => this._openInformation(repo)}
>
${repo.category === "integration"
? html`
<img
src="https://brands.home-assistant.io/_/${repo.domain}/icon.png"
referrerpolicy="no-referrer"
@error=${this._onImageError}
@load=${this._onImageLoad}
/>
`
: html`<ha-icon
icon="mdi:github-circle"
slot="item-icon"
></ha-icon>`}
<paper-item-body three-line
>${repo.name}
<div secondary>${repo.description}</div>
<div secondary>
${localize("settings.category")}:
${localize(`common.${repo.category}`)}
</div></paper-item-body
>
</paper-icon-item>`
)}
${repositories.length === 0
? html`<p>
No repositories found matching your filter
</p>`
: repositories.length > 100
? html`<p>
Only the first 100 repositories are shown, use the search to
filter what you need
</p>`
: ""}
</div>
</hacs-dialog>
`;
Expand Down
2 changes: 1 addition & 1 deletion src/components/dialogs/hacs-custom-repositories-dialog.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export class HacsCustomRepositoriesDialog extends HacsDialogBase {
<input
id="add-input"
class="add-input"
placeholder="Add custom repository"
placeholder="Add custom repository URL"
.value=${this._inputRepository || ""}
@input=${this._inputValueChanged}
/>
Expand Down
27 changes: 21 additions & 6 deletions src/hacs-resolver.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import {
query,
property,
} from "lit-element";
import memoizeOne from "memoize-one";

import { HomeAssistant } from "custom-card-helpers";
import { HacsLogger } from "./components/HacsLogger";

Expand Down Expand Up @@ -51,6 +53,12 @@ export class HacsResolver extends LitElement {

public logger = new HacsLogger();

private _sortRepositoriesByName = memoizeOne((repositories: Repository[]) =>
repositories.sort((a: Repository, b: Repository) =>
a.name.toLowerCase() > b.name.toLowerCase() ? 1 : -1
)
);

public connectedCallback() {
super.connectedCallback();
this.addEventListener("hacs-location-changed", (e) =>
Expand Down Expand Up @@ -94,19 +102,26 @@ export class HacsResolver extends LitElement {
}

private async _updateProperties() {
[
this.repositories,
this.configuration,
this.status,
this.critical,
this.lovelace,
const [
repositories,
configuration,
status,
critical,
lovelace,
] = await Promise.all([
getRepositories(this.hass),
getConfiguration(this.hass),
getStatus(this.hass),
getCritical(this.hass),
getLovelaceConfiguration(this.hass),
]);

this.configuration = configuration;
this.status = status;
this.critical = critical;
this.lovelace = lovelace;
this.configuration = configuration;
this.repositories = this._sortRepositoriesByName(repositories);
}

protected render(): TemplateResult | void {
Expand Down
18 changes: 16 additions & 2 deletions src/panels/hacs-entry-panel.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import {
TemplateResult,
property,
} from "lit-element";
import memoizeOne from "memoize-one";
import { HomeAssistant } from "custom-card-helpers";
import {
Route,
Expand All @@ -25,7 +26,6 @@ import { HacsCommonStyle } from "../styles/hacs-common-style";
import { localize } from "../localize/localize";

import { sections } from "./hacs-sections";
import { panelsEnabled } from "../tools/filter";
//import "../components/hacs-link";

@customElement("hacs-entry-panel")
Expand All @@ -38,6 +38,18 @@ export class HacsEntryPanel extends LitElement {
@property({ attribute: false }) public lovelace: LovelaceResource[];
@property({ attribute: false }) public status: Status;

private _panelsEnabled = memoizeOne(
(sections: any, config: Configuration) => {
return sections.panels.filter((panel) => {
const categories = panel.categories;
if (categories === undefined) return true;
return (
categories.filter((c) => config?.categories.includes(c)).length !== 0
);
});
}
);

protected render(): TemplateResult | void {
sections.updates = []; // reset so we don't get duplicates
this.repositories?.forEach((repo) => {
Expand All @@ -46,6 +58,8 @@ export class HacsEntryPanel extends LitElement {
}
});

const enabledSections = this._panelsEnabled(sections, this.configuration);

return html`
<hacs-single-page-layout
.hass=${this.hass}
Expand Down Expand Up @@ -90,7 +104,7 @@ export class HacsEntryPanel extends LitElement {
</ha-card>`
: ""}
<ha-card>
${panelsEnabled(sections, this.configuration).map(
${enabledSections.map(
(panel) =>
html`
<paper-icon-item @click=${() => this._changeLocation(panel.id)}>
Expand Down
Loading

0 comments on commit 62c49df

Please sign in to comment.