[Filters] Add support for indicating an applied filter has unsaved ch…

…anges (#11783) ### WHY are these changes introduced? Part of Shopify/web#76490 ### WHAT is this pull request doing? Adds support for indicating unsaved changes have been made to the applied filters. ![Screenshot 2024-04-04 at 4 26 23 PM](https://github.com/Shopify/polaris/assets/18447883/7133939e-c313-4cd2-bac3-8aac8e603a0d) ### How to 🎩 📚 [Storybook](https://5d559397bae39100201eedc1-fbscsztkor.chromatic.com/?path=/story/all-components-filters--with-children-content-and-unsaved-changes) 🌀 [Spinstance](https://admin.web.unsaved-indexfilter-changes.chloe-rice.us.spin.dev/store/shop1/products?selectedView=all&status=ACTIVE) 🖥 [Local development instructions](https://github.com/Shopify/polaris/blob/main/README.md#install-dependencies-and-build-workspaces) 🗒 [General tophatting guidelines](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md) 📄 [Changelog guidelines](https://github.com/Shopify/polaris/blob/main/.github/CONTRIBUTING.md#changelog) ### 🎩 checklist - [x] Tested a [snapshot](https://github.com/Shopify/polaris/blob/main/documentation/Releasing.md#-snapshot-releases) - [x] Tested on [mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing) - [x] Tested on [multiple browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers) - [x] Tested for [accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md) - [x] Updated the component's `README.md` with documentation changes - [x] [Tophatted documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md) changes in the style guide --------- Co-authored-by: translation-platform[bot] <34770790+translation-platform[bot]@users.noreply.github.com>
Shopify · Apr 5, 2024 · 0bf817a · 0bf817a
1 parent 99972a5
commit 0bf817a
Show file tree

Hide file tree

Showing 28 changed files with 799 additions and 71 deletions.
diff --git a/.changeset/cold-windows-occur.md b/.changeset/cold-windows-occur.md
@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': minor
+---
+
+Added support to `Filters` for indicating `appliedFilters` have unsaved changes
diff --git a/polaris-react/locales/cs.json b/polaris-react/locales/cs.json
@@ -360,7 +360,8 @@
       "accessibilityLabel": "Ukončit režim celé obrazovky"
     },
     "FilterPill": {
-      "clear": "Vymazat"
+      "clear": "Vymazat",
+      "unsavedChanges": "Neuložené změny: {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Hledat a filtrovat",

diff --git a/polaris-react/locales/de.json b/polaris-react/locales/de.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "Vollbildmodus beenden"
     },
     "FilterPill": {
-      "clear": "Löschen"
+      "clear": "Löschen",
+      "unsavedChanges": "Nicht gespeicherte Änderungen – {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Suchen und filtern",

diff --git a/polaris-react/locales/en.json b/polaris-react/locales/en.json
@@ -173,7 +173,8 @@
       "searchInView": "in:{viewName}"
     },
     "FilterPill": {
-      "clear": "Clear"
+      "clear": "Clear",
+      "unsavedChanges": "Unsaved changes - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Search and filter",

diff --git a/polaris-react/locales/fi.json b/polaris-react/locales/fi.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "Poistu koko näytön tilasta"
     },
     "FilterPill": {
-      "clear": "Tyhjennä"
+      "clear": "Tyhjennä",
+      "unsavedChanges": "Tallentamattomat muutokset – {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Haku ja suodatus",

diff --git a/polaris-react/locales/fr.json b/polaris-react/locales/fr.json
@@ -359,7 +359,8 @@
       "accessibilityLabel": "Quitter le mode plein écran"
     },
     "FilterPill": {
-      "clear": "Effacer"
+      "clear": "Effacer",
+      "unsavedChanges": "Modifications non enregistrées - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Rechercher et filtrer",

diff --git a/polaris-react/locales/it.json b/polaris-react/locales/it.json
@@ -359,7 +359,8 @@
       "accessibilityLabel": "Esci dalla modalità schermo intero"
     },
     "FilterPill": {
-      "clear": "Cancella"
+      "clear": "Cancella",
+      "unsavedChanges": "Modifiche non salvate - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Cerca e filtra",

diff --git a/polaris-react/locales/ja.json b/polaris-react/locales/ja.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "フルスクリーンモードを閉じる"
     },
     "FilterPill": {
-      "clear": "クリア"
+      "clear": "クリア",
+      "unsavedChanges": "未保存の変更 - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "検索と絞り込み",

diff --git a/polaris-react/locales/ko.json b/polaris-react/locales/ko.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "전체 화면 모드 종료"
     },
     "FilterPill": {
-      "clear": "지우기"
+      "clear": "지우기",
+      "unsavedChanges": "저장되지 않은 변경 사항 - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "검색 및 필터링",

diff --git a/polaris-react/locales/pl.json b/polaris-react/locales/pl.json
@@ -360,7 +360,8 @@
       "accessibilityLabel": "Zakończ tryb pełnoekranowy"
     },
     "FilterPill": {
-      "clear": "Wyczyść"
+      "clear": "Wyczyść",
+      "unsavedChanges": "Niezapisane zmiany – {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Wyszukaj i przefiltruj",

diff --git a/polaris-react/locales/pt-PT.json b/polaris-react/locales/pt-PT.json
@@ -359,7 +359,8 @@
       "accessibilityLabel": "Sair do modo ecrã inteiro"
     },
     "FilterPill": {
-      "clear": "Limpar"
+      "clear": "Limpar",
+      "unsavedChanges": "Alterações não guardadas - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Pesquisar e filtrar",

diff --git a/polaris-react/locales/sv.json b/polaris-react/locales/sv.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "Lämna helskärmsläget"
     },
     "FilterPill": {
-      "clear": "Rensa"
+      "clear": "Rensa",
+      "unsavedChanges": "Ej sparade ändringar – {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Sök och filtrera",

diff --git a/polaris-react/locales/th.json b/polaris-react/locales/th.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "ออกจากโหมดเต็มหน้าจอ"
     },
     "FilterPill": {
-      "clear": "ล้าง"
+      "clear": "ล้าง",
+      "unsavedChanges": "การเปลี่ยนแปลงที่ไม่ได้บันทึก - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "ค้นหาและกรอง",

diff --git a/polaris-react/locales/tr.json b/polaris-react/locales/tr.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "Tam ekran modundan çık"
     },
     "FilterPill": {
-      "clear": "Temizle"
+      "clear": "Temizle",
+      "unsavedChanges": "Kaydedilmemiş değişiklikler - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Arama ve filtreleme",

diff --git a/polaris-react/locales/vi.json b/polaris-react/locales/vi.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "Thoát chế độ toàn màn hình"
     },
     "FilterPill": {
-      "clear": "Xóa"
+      "clear": "Xóa",
+      "unsavedChanges": "Thay đổi chưa lưu - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "Tìm kiếm và lọc",

diff --git a/polaris-react/locales/zh-CN.json b/polaris-react/locales/zh-CN.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "退出全屏模式"
     },
     "FilterPill": {
-      "clear": "清除"
+      "clear": "清除",
+      "unsavedChanges": "未保存的更改 - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "搜索和筛选",

diff --git a/polaris-react/locales/zh-TW.json b/polaris-react/locales/zh-TW.json
@@ -358,7 +358,8 @@
       "accessibilityLabel": "退出全螢幕模式"
     },
     "FilterPill": {
-      "clear": "清除"
+      "clear": "清除",
+      "unsavedChanges": "尚未儲存的變更 - {label}"
     },
     "IndexFilters": {
       "searchFilterTooltip": "搜尋及篩選",