summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/vue_shared/components/local_storage_sync.vue
diff options
context:
space:
mode:
authorGitLab Bot <gitlab-bot@gitlab.com>2022-04-20 10:00:54 +0000
committerGitLab Bot <gitlab-bot@gitlab.com>2022-04-20 10:00:54 +0000
commit3cccd102ba543e02725d247893729e5c73b38295 (patch)
treef36a04ec38517f5deaaacb5acc7d949688d1e187 /app/assets/javascripts/vue_shared/components/local_storage_sync.vue
parent205943281328046ef7b4528031b90fbda70c75ac (diff)
downloadgitlab-ce-3cccd102ba543e02725d247893729e5c73b38295.tar.gz
Add latest changes from gitlab-org/gitlab@14-10-stable-eev14.10.0-rc42
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/local_storage_sync.vue')
-rw-r--r--app/assets/javascripts/vue_shared/components/local_storage_sync.vue33
1 files changed, 27 insertions, 6 deletions
diff --git a/app/assets/javascripts/vue_shared/components/local_storage_sync.vue b/app/assets/javascripts/vue_shared/components/local_storage_sync.vue
index 33e77b6510c..4ece87310c7 100644
--- a/app/assets/javascripts/vue_shared/components/local_storage_sync.vue
+++ b/app/assets/javascripts/vue_shared/components/local_storage_sync.vue
@@ -1,6 +1,18 @@
<script>
-import { isEqual } from 'lodash';
+import { isEqual, isString } from 'lodash';
+/**
+ * This component will save and restore a value to and from localStorage.
+ * The value will be saved only when the value changes; the initial value won't be saved.
+ *
+ * By default, the value will be saved using JSON.stringify(), and retrieved back using JSON.parse().
+ *
+ * If you would like to save the raw string instead, you may set the 'asString' prop to true, though be aware that this is a
+ * legacy prop to maintain backwards compatibility.
+ *
+ * For new components saving data for the first time, it's recommended to not use 'asString' even if you're saving a string; it will still be
+ * saved and restored properly using JSON.stringify()/JSON.parse().
+ */
export default {
props: {
storageKey: {
@@ -12,7 +24,7 @@ export default {
required: false,
default: '',
},
- asJson: {
+ asString: {
type: Boolean,
required: false,
default: false,
@@ -30,6 +42,8 @@ export default {
},
watch: {
value(newVal) {
+ if (!this.persist) return;
+
this.saveValue(this.serialize(newVal));
},
clear(newVal) {
@@ -67,15 +81,22 @@ export default {
}
},
saveValue(val) {
- if (!this.persist) return;
-
localStorage.setItem(this.storageKey, val);
},
serialize(val) {
- return this.asJson ? JSON.stringify(val) : val;
+ if (!isString(val) && this.asString) {
+ // eslint-disable-next-line no-console
+ console.warn(
+ `[gitlab] LocalStorageSync is saving`,
+ val,
+ `to the key "${this.storageKey}", but it is not a string and the 'asString' prop is true. This will save and restore the stringified value rather than the original value. If this is not intended, please remove or set the 'asString' prop to false.`,
+ );
+ }
+
+ return this.asString ? val : JSON.stringify(val);
},
deserialize(val) {
- return this.asJson ? JSON.parse(val) : val;
+ return this.asString ? val : JSON.parse(val);
},
},
render() {