add 0.5.11

CHANGELOG.md

@@ -11,6 +11,29 @@ Sections:
 
 ---
 
+## [0.5.11] - 2026-01-18
+
+### Added
+- Automatic backup of existing custom components before install or update.
+- Backup retention with a configurable limit per domain.
+
+### Safety
+- Automatic rollback is triggered if an install or update fails after a backup was created.
+
+## [0.5.10] - 2026-01-17
+
+### Added
+- Store view controls: Filter and Sort dropdowns alongside the existing Category selector.
+
+### Fixed
+- Search input focus is preserved while typing (cursor no longer jumps out after re-render).
+
+## [0.5.9] - 2026-01-17
+
+### Changed
+- README is now collapsible with a preview by default (Show more / Show less).
+- Improved mobile readability by keeping long README content contained without affecting the page layout.
+
 ## [0.5.8] - 2026-01-17
 
 ### Changed

custom_components/bahmcloud_store/core.py

@@ -90,6 +90,10 @@ class BCSCore:
         self._install_lock = asyncio.Lock()
         self._installed_cache: dict[str, Any] = {}
 
+        # Phase F2: backups before install/update
+        self._backup_root = Path(self.hass.config.path(".bcs_backups"))
+        self._backup_keep_per_domain: int = 5
+
     async def async_initialize(self) -> None:
         """Async initialization that avoids blocking file IO."""
         self.version = await self._read_manifest_version_async()
@@ -482,6 +486,65 @@ class BCSCore:
                 return candidate
         return None
 
+    async def _ensure_backup_root(self) -> None:
+        """Create backup root directory if needed."""
+        def _mkdir() -> None:
+            self._backup_root.mkdir(parents=True, exist_ok=True)
+
+        await self.hass.async_add_executor_job(_mkdir)
+
+    async def _backup_domain(self, domain: str) -> Path | None:
+        """Backup an existing domain folder.
+
+        Returns the created backup path, or None if the domain folder does not exist.
+        """
+        dest_root = Path(self.hass.config.path("custom_components"))
+        target = dest_root / domain
+
+        if not target.exists() or not target.is_dir():
+            return None
+
+        await self._ensure_backup_root()
+
+        ts = time.strftime("%Y%m%d_%H%M%S")
+        domain_root = self._backup_root / domain
+        backup_path = domain_root / ts
+
+        def _do_backup() -> None:
+            domain_root.mkdir(parents=True, exist_ok=True)
+            if backup_path.exists():
+                shutil.rmtree(backup_path, ignore_errors=True)
+            shutil.copytree(target, backup_path, dirs_exist_ok=True)
+
+            # Retention: keep only the newest N backups per domain.
+            try:
+                backups = [p for p in domain_root.iterdir() if p.is_dir()]
+                backups.sort(key=lambda p: p.name, reverse=True)
+                for old in backups[self._backup_keep_per_domain :]:
+                    shutil.rmtree(old, ignore_errors=True)
+            except Exception:
+                # Never fail install/update because of retention cleanup.
+                pass
+
+        await self.hass.async_add_executor_job(_do_backup)
+        _LOGGER.info("BCS backup created: domain=%s path=%s", domain, backup_path)
+        return backup_path
+
+    async def _restore_domain_from_backup(self, domain: str, backup_path: Path) -> None:
+        """Restore a domain folder from a backup."""
+        dest_root = Path(self.hass.config.path("custom_components"))
+        target = dest_root / domain
+
+        def _restore() -> None:
+            if not backup_path.exists() or not backup_path.is_dir():
+                return
+            if target.exists():
+                shutil.rmtree(target, ignore_errors=True)
+            shutil.copytree(backup_path, target, dirs_exist_ok=True)
+
+        await self.hass.async_add_executor_job(_restore)
+        _LOGGER.info("BCS rollback applied: domain=%s from=%s", domain, backup_path)
+
     async def _copy_domain_dir(self, src_domain_dir: Path, domain: str) -> None:
         dest_root = Path(self.hass.config.path("custom_components"))
         target = dest_root / domain
@@ -613,6 +676,11 @@ class BCSCore:
 
             _LOGGER.info("BCS install started: repo_id=%s ref=%s zip_url=%s", repo_id, ref, zip_url)
 
+            installed_domains: list[str] = []
+            backups: dict[str, Path] = {}
+            created_new: set[str] = set()
+
+            try:
                 with tempfile.TemporaryDirectory(prefix="bcs_install_") as td:
                     tmp = Path(td)
                     zip_path = tmp / "repo.zip"
@@ -626,7 +694,8 @@ class BCSCore:
                     if not cc_root:
                         raise BCSInstallError("custom_components folder not found in repository ZIP")
 
-                installed_domains: list[str] = []
+                    dest_root = Path(self.hass.config.path("custom_components"))
+
                     for domain_dir in cc_root.iterdir():
                         if not domain_dir.is_dir():
                             continue
@@ -635,6 +704,16 @@ class BCSCore:
                             continue
 
                         domain = domain_dir.name
+                        target = dest_root / domain
+
+                        # Backup only if we are going to overwrite an existing domain.
+                        if target.exists() and target.is_dir():
+                            bkp = await self._backup_domain(domain)
+                            if bkp:
+                                backups[domain] = bkp
+                        else:
+                            created_new.add(domain)
+
                         await self._copy_domain_dir(domain_dir, domain)
                         installed_domains.append(domain)
 
@@ -673,6 +752,35 @@ class BCSCore:
                     "restart_required": True,
                 }
 
+            except Exception as e:
+                # Roll back any domains we touched.
+                _LOGGER.error("BCS install failed, attempting rollback: repo_id=%s error=%s", repo_id, e)
+
+                dest_root = Path(self.hass.config.path("custom_components"))
+
+                # Restore backed-up domains.
+                for domain, bkp in backups.items():
+                    try:
+                        await self._restore_domain_from_backup(domain, bkp)
+                    except Exception:
+                        _LOGGER.debug("BCS rollback failed for domain=%s", domain, exc_info=True)
+
+                # Remove newly created domains if the install did not complete.
+                for domain in created_new:
+                    try:
+                        target = dest_root / domain
+                        def _rm() -> None:
+                            if target.exists() and target.is_dir():
+                                shutil.rmtree(target, ignore_errors=True)
+                        await self.hass.async_add_executor_job(_rm)
+                    except Exception:
+                        _LOGGER.debug("BCS cleanup failed for new domain=%s", domain, exc_info=True)
+
+                # Re-raise as install error for clean API response.
+                if isinstance(e, BCSInstallError):
+                    raise
+                raise BCSInstallError(str(e)) from e
+
     async def update_repo(self, repo_id: str) -> dict[str, Any]:
         _LOGGER.info("BCS update started: repo_id=%s", repo_id)
         return await self.install_repo(repo_id)

custom_components/bahmcloud_store/manifest.json

@@ -1,7 +1,7 @@
 {
   "domain": "bahmcloud_store",
   "name": "Bahmcloud Store",
-  "version": "0.5.7",
+  "version": "0.5.11",
   "documentation": "https://git.bahmcloud.de/bahmcloud/bahmcloud_store",
   "platforms": ["update"],
   "requirements": [],

custom_components/bahmcloud_store/panel/panel.js

@@ -15,16 +15,20 @@ class BahmcloudStorePanel extends HTMLElement {
 
     this._search = "";
     this._category = "all";
-    this._provider = "all"; // all|github|gitea|gitlab|other|custom
+    this._filter = "all"; // all|installed|not_installed|updates|custom
+    this._sort = "az"; // az|updates_first|installed_first
 
     this._detailRepoId = null;
     this._detailRepo = null;
-
     this._readmeLoading = false;
     this._readmeText = null;
     this._readmeHtml = null;
     this._readmeError = null;
 
+    // README UX (E2)
+    this._readmeExpanded = false;
+    this._readmeCanToggle = false;
+
     this._refreshing = false;
 
     this._installingRepoId = null;
@@ -201,6 +205,7 @@ class BahmcloudStorePanel extends HTMLElement {
       this._readmeText = null;
       this._readmeHtml = null;
       this._readmeError = null;
+      this._readmeExpanded = false;
       this._update();
       return;
     }
@@ -265,6 +270,8 @@ class BahmcloudStorePanel extends HTMLElement {
     this._readmeText = null;
     this._readmeHtml = null;
     this._readmeError = null;
+    this._readmeExpanded = false;
+    this._readmeCanToggle = false;
 
     this._update();
     this._loadReadme(repoId);
@@ -282,15 +289,23 @@ class BahmcloudStorePanel extends HTMLElement {
       if (resp?.ok && typeof resp.readme === "string" && resp.readme.trim()) {
         this._readmeText = resp.readme;
         this._readmeHtml = typeof resp.html === "string" && resp.html.trim() ? resp.html : null;
+
+        const lines = resp.readme.split(/\r?\n/).length;
+        this._readmeCanToggle = lines > 24 || resp.readme.length > 1600;
+        this._readmeExpanded = !this._readmeCanToggle;
       } else {
         this._readmeText = null;
         this._readmeHtml = null;
         this._readmeError = this._safeText(resp?.message) || "README not found.";
+        this._readmeCanToggle = false;
+        this._readmeExpanded = false;
       }
     } catch (e) {
       this._readmeText = null;
       this._readmeHtml = null;
       this._readmeError = e?.message ? String(e.message) : String(e);
+      this._readmeCanToggle = false;
+      this._readmeExpanded = false;
     } finally {
       this._readmeLoading = false;
       this._update();
@@ -442,6 +457,50 @@ class BahmcloudStorePanel extends HTMLElement {
           display:block;
           max-width:100%;
         }
+        .readmeWrap{
+          margin-top:12px;
+          max-width:100%;
+          border:1px solid var(--divider-color);
+          border-radius:14px;
+          padding:12px;
+          background: rgba(0,0,0,.02);
+          position:relative;
+          overflow:hidden;
+        }
+        .readmeWrap.collapsed{
+          max-height:260px;
+        }
+        @media (min-width: 1024px){
+          .readmeWrap.collapsed{ max-height:340px; }
+        }
+        .readmeWrap.collapsed::after{
+          content:"";
+          position:absolute;
+          left:0; right:0; bottom:0;
+          height:64px;
+          background: linear-gradient(to bottom, rgba(0,0,0,0), var(--card-background-color));
+          pointer-events:none;
+        }
+        .readmeWrap.expanded{
+          max-height:70vh;
+          overflow:auto;
+          -webkit-overflow-scrolling:touch;
+        }
+        .readmeActions{
+          display:flex; justify-content:flex-end;
+          margin-top:10px;
+        }
+        button.link{
+          border:1px solid transparent;
+          background: transparent;
+          color: var(--bcs-accent);
+          padding:8px 10px;
+        }
+        button.link:hover{
+          border-color: rgba(30,136,229,.25);
+          background: rgba(30,136,229,.06);
+        }
+
         .md th, .md td{
           border: 1px solid var(--divider-color);
           padding: 8px;
@@ -450,6 +509,7 @@ class BahmcloudStorePanel extends HTMLElement {
           overflow-wrap:anywhere;
           word-break:break-word;
         }
+
       </style>
 
       <div class="mobilebar">
@@ -503,6 +563,25 @@ class BahmcloudStorePanel extends HTMLElement {
     const root = this.shadowRoot;
     if (!root) return;
 
+    // Preserve focus & cursor position for inputs that trigger a re-render (e.g. search).
+    // Without this, mobile browsers may drop focus after each keystroke.
+    const active = root.activeElement;
+    const restore = {
+      id: active && active.id ? String(active.id) : null,
+      start: null,
+      end: null,
+    };
+    try {
+      if (active && (active.tagName === "INPUT" || active.tagName === "TEXTAREA")) {
+        if (typeof active.selectionStart === "number" && typeof active.selectionEnd === "number") {
+          restore.start = active.selectionStart;
+          restore.end = active.selectionEnd;
+        }
+      }
+    } catch (_) {
+      // ignore
+    }
+
     const subtitle = root.getElementById("subtitle");
     if (subtitle) subtitle.textContent = this._view === "detail" ? "Details" : this._view[0].toUpperCase() + this._view.slice(1);
 
@@ -545,6 +624,21 @@ class BahmcloudStorePanel extends HTMLElement {
     if (this._view === "detail") {
       this._wireDetail(); // now always wires buttons
     }
+
+    // Restore focus and cursor for the search field after re-render.
+    if (restore.id && this._view === "store") {
+      const el = root.getElementById(restore.id);
+      if (el && (el.tagName === "INPUT" || el.tagName === "TEXTAREA")) {
+        try {
+          el.focus({ preventScroll: true });
+          if (restore.start !== null && restore.end !== null && typeof el.setSelectionRange === "function") {
+            el.setSelectionRange(restore.start, restore.end);
+          }
+        } catch (_) {
+          // ignore
+        }
+      }
+    }
   }
 
   _safeText(v) {
@@ -584,16 +678,40 @@ class BahmcloudStorePanel extends HTMLElement {
         const cat = this._safeText(r?.category) || "";
         if (this._category !== "all" && this._category !== cat) return false;
 
-        const prov = this._safeText(r?.provider) || "other";
+        const latest = this._safeText(r?.latest_version);
-        if (this._provider !== "all") {
+        const installed = this._asBoolStrict(r?.installed);
-          if (this._provider === "custom" && r?.source !== "custom") return false;
+        const installedVersion = this._safeText(r?.installed_version);
-          if (this._provider !== "custom" && prov !== this._provider) return false;
+        const updateAvailable = installed && !!latest && (!installedVersion || latest !== installedVersion);
-        }
+
+        if (this._filter === "installed" && !installed) return false;
+        if (this._filter === "not_installed" && installed) return false;
+        if (this._filter === "updates" && !updateAvailable) return false;
+        if (this._filter === "custom" && r?.source !== "custom") return false;
+
         return true;
       })
       .sort((a, b) => {
         const an = (this._safeText(a?.name) || "").toLowerCase();
         const bn = (this._safeText(b?.name) || "").toLowerCase();
+
+        const alatest = this._safeText(a?.latest_version);
+        const ainstalled = this._asBoolStrict(a?.installed);
+        const ainstalledVersion = this._safeText(a?.installed_version);
+        const aupdate = ainstalled && !!alatest && (!ainstalledVersion || alatest !== ainstalledVersion);
+
+        const blatest = this._safeText(b?.latest_version);
+        const binstalled = this._asBoolStrict(b?.installed);
+        const binstalledVersion = this._safeText(b?.installed_version);
+        const bupdate = binstalled && !!blatest && (!binstalledVersion || blatest !== binstalledVersion);
+
+        if (this._sort === "updates_first") {
+          if (aupdate !== bupdate) return aupdate ? -1 : 1;
+          return an.localeCompare(bn);
+        }
+        if (this._sort === "installed_first") {
+          if (ainstalled !== binstalled) return ainstalled ? -1 : 1;
+          return an.localeCompare(bn);
+        }
         return an.localeCompare(bn);
       });
 
@@ -601,8 +719,6 @@ class BahmcloudStorePanel extends HTMLElement {
       new Set(repos.map((r) => this._safeText(r?.category)).filter((c) => !!c))
     ).sort();
 
-    const providers = ["github", "gitlab", "gitea", "other"];
-
     const cards = filtered
       .map((r) => {
         const id = this._safeId(r?.id);
@@ -646,10 +762,17 @@ class BahmcloudStorePanel extends HTMLElement {
           <option value="all">All categories</option>
           ${categories.map((c) => `<option value="${this._esc(c)}" ${this._category === c ? "selected" : ""}>${this._esc(c)}</option>`).join("")}
         </select>
-        <select id="prov">
+        <select id="filter">
-          <option value="all">All providers</option>
+          <option value="all" ${this._filter === "all" ? "selected" : ""}>All</option>
-          <option value="custom" ${this._provider === "custom" ? "selected" : ""}>Custom</option>
+          <option value="installed" ${this._filter === "installed" ? "selected" : ""}>Installed</option>
-          ${providers.map((p) => `<option value="${p}" ${this._provider === p ? "selected" : ""}>${p.toUpperCase()}</option>`).join("")}
+          <option value="not_installed" ${this._filter === "not_installed" ? "selected" : ""}>Not installed</option>
+          <option value="updates" ${this._filter === "updates" ? "selected" : ""}>Updates available</option>
+          <option value="custom" ${this._filter === "custom" ? "selected" : ""}>Custom repos</option>
+        </select>
+        <select id="sort">
+          <option value="az" ${this._sort === "az" ? "selected" : ""}>A–Z</option>
+          <option value="updates_first" ${this._sort === "updates_first" ? "selected" : ""}>Updates first</option>
+          <option value="installed_first" ${this._sort === "installed_first" ? "selected" : ""}>Installed first</option>
         </select>
       </div>
 
@@ -666,7 +789,8 @@ class BahmcloudStorePanel extends HTMLElement {
 
     const q = root.getElementById("q");
     const cat = root.getElementById("cat");
-    const prov = root.getElementById("prov");
+    const filter = root.getElementById("filter");
+    const sort = root.getElementById("sort");
 
     if (q) {
       q.addEventListener("input", (e) => {
@@ -680,9 +804,15 @@ class BahmcloudStorePanel extends HTMLElement {
         this._update();
       });
     }
-    if (prov) {
+    if (filter) {
-      prov.addEventListener("change", (e) => {
+      filter.addEventListener("change", (e) => {
-        this._provider = e?.target?.value || "all";
+        this._filter = e?.target?.value || "all";
+        this._update();
+      });
+    }
+    if (sort) {
+      sort.addEventListener("change", (e) => {
+        this._sort = e?.target?.value || "az";
         this._update();
       });
     }
@@ -735,7 +865,14 @@ class BahmcloudStorePanel extends HTMLElement {
             <div class="muted small">Rendered Markdown</div>
           </div>
 
-          <div id="readmePretty" class="md" style="margin-top:12px;"></div>
+          <div class="readmeWrap ${this._readmeExpanded ? "expanded" : "collapsed"}">
+            <div id="readmePretty" class="md"></div>
+          </div>
+          ${this._readmeCanToggle ? `
+          <div class="readmeActions">
+            <button class="link" id="btnReadmeToggle">${this._readmeExpanded ? "Show less" : "Show more"}</button>
+          </div>
+          ` : ``}
 
           <details>
             <summary>Show raw Markdown</summary>
@@ -838,6 +975,7 @@ class BahmcloudStorePanel extends HTMLElement {
     const btnUpdate = root.getElementById("btnUpdate");
     const btnUninstall = root.getElementById("btnUninstall");
     const btnRestart = root.getElementById("btnRestart");
+    const btnReadmeToggle = root.getElementById("btnReadmeToggle");
 
     if (btnInstall) {
       btnInstall.addEventListener("click", () => {
@@ -864,6 +1002,13 @@ class BahmcloudStorePanel extends HTMLElement {
       btnRestart.addEventListener("click", () => this._restartHA());
     }
 
+    if (btnReadmeToggle) {
+      btnReadmeToggle.addEventListener("click", () => {
+        this._readmeExpanded = !this._readmeExpanded;
+        this._update();
+      });
+    }
+
     const mount = root.getElementById("readmePretty");
     if (!mount) return;
 

custom_components/bahmcloud_store/panel/styles.css

@@ -13,3 +13,12 @@ a { color: inherit; }
 .md { max-width: 100%; overflow-x: auto; }
 .md table { display:block; max-width:100%; overflow-x:auto; }
 .md img { max-width: 100%; height: auto; }
+
+/* README UX (E2): collapsible preview (standalone page only) */
+.readmeWrap{ border:1px solid #ddd; border-radius:10px; padding:12px; background: #f7f7f7; max-width:100%; }
+.readmeWrap.collapsed{ max-height:260px; overflow:hidden; position:relative; }
+.readmeWrap.collapsed::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:56px; background: linear-gradient(to bottom, rgba(247,247,247,0), #f7f7f7); pointer-events:none; }
+.readmeWrap.expanded{ max-height:70vh; overflow:auto; }
+.readmeActions{ display:flex; justify-content:flex-end; margin-top:10px; }
+button.link{ border:none; background:transparent; padding:6px 10px; color:#1E88E5; }
+button.link:hover{ text-decoration:underline; }