Remove unused QueryStringPlugin

Author: mbuliard

src/LiveComponent/assets/dist/Component/plugins/QueryStringPlugin.d.ts

@@ -49,10 +49,6 @@ export default class LiveControllerDefault extends Controller<HTMLElement> imple
             type: StringConstructor;
             default: string;
         };
-        queryMapping: {
-            type: ObjectConstructor;
-            default: {};
-        };
     };
     readonly nameValue: string;
     readonly urlValue: string;
@@ -76,11 +72,6 @@ export default class LiveControllerDefault extends Controller<HTMLElement> imple
     readonly debounceValue: number;
     readonly fingerprintValue: string;
     readonly requestMethodValue: 'get' | 'post';
-    readonly queryMappingValue: {
-        [p: string]: {
-            name: string;
-        };
-    };
     private proxiedComponent;
     private mutationObserver;
     component: Component;

src/LiveComponent/assets/dist/live_controller.d.ts

@@ -33,7 +33,7 @@ class RequestBuilder {
         fetchOptions.headers = {
             Accept: 'application/vnd.live-component+html',
             'X-Requested-With': 'XMLHttpRequest',
-            'X-Live-Url': window.location.pathname + window.location.search
+            'X-Live-Url': window.location.pathname + window.location.search,
         };
         const totalFiles = Object.entries(files).reduce((total, current) => total + current.length, 0);
         const hasFingerprints = Object.keys(children).length > 0;
@@ -1805,7 +1805,109 @@ class ExternalMutationTracker {
         return element.tagName === 'FONT' && element.getAttribute('style') === 'vertical-align: inherit;';
     }
 }
-
+function isValueEmpty(value) {
+    if (null === value || value === '' || undefined === value || (Array.isArray(value) && value.length === 0)) {
+        return true;
+    }
+    if (typeof value !== 'object') {
+        return false;
+    }
+    for (const key of Object.keys(value)) {
+        if (!isValueEmpty(value[key])) {
+            return false;
+        }
+    }
+    return true;
+}
+function toQueryString(data) {
+    const buildQueryStringEntries = (data, entries = {}, baseKey = '') => {
+        Object.entries(data).forEach(([iKey, iValue]) => {
+            const key = baseKey === '' ? iKey : `${baseKey}[${iKey}]`;
+            if ('' === baseKey && isValueEmpty(iValue)) {
+                entries[key] = '';
+            }
+            else if (null !== iValue) {
+                if (typeof iValue === 'object') {
+                    entries = { ...entries, ...buildQueryStringEntries(iValue, entries, key) };
+                }
+                else {
+                    entries[key] = encodeURIComponent(iValue)
+                        .replace(/%20/g, '+')
+                        .replace(/%2C/g, ',');
+                }
+            }
+        });
+        return entries;
+    };
+    const entries = buildQueryStringEntries(data);
+    return Object.entries(entries)
+        .map(([key, value]) => `${key}=${value}`)
+        .join('&');
+}
+function fromQueryString(search) {
+    search = search.replace('?', '');
+    if (search === '')
+        return {};
+    const insertDotNotatedValueIntoData = (key, value, data) => {
+        const [first, second, ...rest] = key.split('.');
+        if (!second) {
+            data[key] = value;
+            return value;
+        }
+        if (data[first] === undefined) {
+            data[first] = Number.isNaN(Number.parseInt(second)) ? {} : [];
+        }
+        insertDotNotatedValueIntoData([second, ...rest].join('.'), value, data[first]);
+    };
+    const entries = search.split('&').map((i) => i.split('='));
+    const data = {};
+    entries.forEach(([key, value]) => {
+        value = decodeURIComponent(String(value || '').replace(/\+/g, '%20'));
+        if (!key.includes('[')) {
+            data[key] = value;
+        }
+        else {
+            if ('' === value)
+                return;
+            const dotNotatedKey = key.replace(/\[/g, '.').replace(/]/g, '');
+            insertDotNotatedValueIntoData(dotNotatedKey, value, data);
+        }
+    });
+    return data;
+}
+class UrlUtils extends URL {
+    has(key) {
+        const data = this.getData();
+        return Object.keys(data).includes(key);
+    }
+    set(key, value) {
+        const data = this.getData();
+        data[key] = value;
+        this.setData(data);
+    }
+    get(key) {
+        return this.getData()[key];
+    }
+    remove(key) {
+        const data = this.getData();
+        delete data[key];
+        this.setData(data);
+    }
+    getData() {
+        if (!this.search) {
+            return {};
+        }
+        return fromQueryString(this.search);
+    }
+    setData(data) {
+        this.search = toQueryString(data);
+    }
+}
+class HistoryStrategy {
+    static replace(url) {
+        history.replaceState(history.state, '', url);
+    }
+}
 class UnsyncedInputsTracker {
     constructor(component, modelElementResolver) {
         this.elementEventListeners = [
@@ -1984,110 +2086,6 @@ class ValueStore {
     }
 }
 
-function isValueEmpty(value) {
-    if (null === value || value === '' || undefined === value || (Array.isArray(value) && value.length === 0)) {
-        return true;
-    }
-    if (typeof value !== 'object') {
-        return false;
-    }
-    for (const key of Object.keys(value)) {
-        if (!isValueEmpty(value[key])) {
-            return false;
-        }
-    }
-    return true;
-}
-function toQueryString(data) {
-    const buildQueryStringEntries = (data, entries = {}, baseKey = '') => {
-        Object.entries(data).forEach(([iKey, iValue]) => {
-            const key = baseKey === '' ? iKey : `${baseKey}[${iKey}]`;
-            if ('' === baseKey && isValueEmpty(iValue)) {
-                entries[key] = '';
-            }
-            else if (null !== iValue) {
-                if (typeof iValue === 'object') {
-                    entries = { ...entries, ...buildQueryStringEntries(iValue, entries, key) };
-                }
-                else {
-                    entries[key] = encodeURIComponent(iValue)
-                        .replace(/%20/g, '+')
-                        .replace(/%2C/g, ',');
-                }
-            }
-        });
-        return entries;
-    };
-    const entries = buildQueryStringEntries(data);
-    return Object.entries(entries)
-        .map(([key, value]) => `${key}=${value}`)
-        .join('&');
-}
-function fromQueryString(search) {
-    search = search.replace('?', '');
-    if (search === '')
-        return {};
-    const insertDotNotatedValueIntoData = (key, value, data) => {
-        const [first, second, ...rest] = key.split('.');
-        if (!second) {
-            data[key] = value;
-            return value;
-        }
-        if (data[first] === undefined) {
-            data[first] = Number.isNaN(Number.parseInt(second)) ? {} : [];
-        }
-        insertDotNotatedValueIntoData([second, ...rest].join('.'), value, data[first]);
-    };
-    const entries = search.split('&').map((i) => i.split('='));
-    const data = {};
-    entries.forEach(([key, value]) => {
-        value = decodeURIComponent(String(value || '').replace(/\+/g, '%20'));
-        if (!key.includes('[')) {
-            data[key] = value;
-        }
-        else {
-            if ('' === value)
-                return;
-            const dotNotatedKey = key.replace(/\[/g, '.').replace(/]/g, '');
-            insertDotNotatedValueIntoData(dotNotatedKey, value, data);
-        }
-    });
-    return data;
-}
-class UrlUtils extends URL {
-    has(key) {
-        const data = this.getData();
-        return Object.keys(data).includes(key);
-    }
-    set(key, value) {
-        const data = this.getData();
-        data[key] = value;
-        this.setData(data);
-    }
-    get(key) {
-        return this.getData()[key];
-    }
-    remove(key) {
-        const data = this.getData();
-        delete data[key];
-        this.setData(data);
-    }
-    getData() {
-        if (!this.search) {
-            return {};
-        }
-        return fromQueryString(this.search);
-    }
-    setData(data) {
-        this.search = toQueryString(data);
-    }
-}
-class HistoryStrategy {
-    static replace(url) {
-        history.replaceState(history.state, '', url);
-    }
-}
-
 class Component {
     constructor(element, name, props, listeners, id, backend, elementDriver) {
         this.fingerprint = '';
@@ -2885,25 +2883,6 @@ class PollingPlugin {
     }
 }
 
-class QueryStringPlugin {
-    constructor(mapping) {
-        this.mapping = mapping;
-    }
-    attachToComponent(component) {
-        component.on('render:finished', (component) => {
-            const urlUtils = new UrlUtils(window.location.href);
-            const currentUrl = urlUtils.toString();
-            Object.entries(this.mapping).forEach(([prop, mapping]) => {
-                const value = component.valueStore.get(prop);
-                urlUtils.set(mapping.name, value);
-            });
-            if (currentUrl !== urlUtils.toString()) {
-                HistoryStrategy.replace(urlUtils);
-            }
-        });
-    }
-}
-
 class SetValueOntoModelFieldsPlugin {
     attachToComponent(component) {
         this.synchronizeValueOfModelFields(component);
@@ -3113,7 +3092,6 @@ class LiveControllerDefault extends Controller {
             new PageUnloadingPlugin(),
             new PollingPlugin(),
             new SetValueOntoModelFieldsPlugin(),
-            new QueryStringPlugin(this.queryMappingValue),
             new ChildComponentPlugin(this.component),
         ];
         plugins.forEach((plugin) => {
@@ -3244,7 +3222,6 @@ LiveControllerDefault.values = {
     debounce: { type: Number, default: 150 },
     fingerprint: { type: String, default: '' },
     requestMethod: { type: String, default: 'post' },
-    queryMapping: { type: Object, default: {} },
 };
 LiveControllerDefault.backendFactory = (controller) => new Backend(controller.urlValue, controller.requestMethodValue);
 

src/LiveComponent/assets/dist/live_controller.js

@@ -26,7 +26,7 @@ export default class {
         fetchOptions.headers = {
             Accept: 'application/vnd.live-component+html',
             'X-Requested-With': 'XMLHttpRequest',
-            'X-Live-Url' : window.location.pathname + window.location.search
+            'X-Live-Url': window.location.pathname + window.location.search,
         };
 
         const totalFiles = Object.entries(files).reduce((total, current) => total + current.length, 0);

src/LiveComponent/assets/src/Backend/RequestBuilder.ts

@@ -7,11 +7,11 @@ import HookManager from '../HookManager';
 import { executeMorphdom } from '../morphdom';
 import ExternalMutationTracker from '../Rendering/ExternalMutationTracker';
 import { normalizeModelName } from '../string_utils';
+import { HistoryStrategy, UrlUtils } from "../url_utils";
 import type { ElementDriver } from './ElementDriver';
 import type { PluginInterface } from './plugins/PluginInterface';
 import UnsyncedInputsTracker from './UnsyncedInputsTracker';
 import ValueStore from './ValueStore';
-import {HistoryStrategy, UrlUtils} from "../url_utils";
 
 declare const Turbo: any;
 

src/LiveComponent/assets/src/Component/index.ts

@@ -8,7 +8,6 @@ import LoadingPlugin from './Component/plugins/LoadingPlugin';
 import PageUnloadingPlugin from './Component/plugins/PageUnloadingPlugin';
 import type { PluginInterface } from './Component/plugins/PluginInterface';
 import PollingPlugin from './Component/plugins/PollingPlugin';
-import QueryStringPlugin from './Component/plugins/QueryStringPlugin';
 import SetValueOntoModelFieldsPlugin from './Component/plugins/SetValueOntoModelFieldsPlugin';
 import ValidatedFieldsPlugin from './Component/plugins/ValidatedFieldsPlugin';
 import { type DirectiveModifier, parseDirectives } from './Directive/directives_parser';
@@ -50,7 +49,6 @@ export default class LiveControllerDefault extends Controller<HTMLElement> imple
         debounce: { type: Number, default: 150 },
         fingerprint: { type: String, default: '' },
         requestMethod: { type: String, default: 'post' },
-        queryMapping: { type: Object, default: {} },
     };
 
     declare readonly nameValue: string;
@@ -69,7 +67,6 @@ export default class LiveControllerDefault extends Controller<HTMLElement> imple
     declare readonly debounceValue: number;
     declare readonly fingerprintValue: string;
     declare readonly requestMethodValue: 'get' | 'post';
-    declare readonly queryMappingValue: { [p: string]: { name: string } };
 
     /** The component, wrapped in the convenience Proxy */
     private proxiedComponent: Component;
@@ -309,7 +306,6 @@ export default class LiveControllerDefault extends Controller<HTMLElement> imple
             new PageUnloadingPlugin(),
             new PollingPlugin(),
             new SetValueOntoModelFieldsPlugin(),
-            new QueryStringPlugin(this.queryMappingValue),
             new ChildComponentPlugin(this.component),
         ];
         plugins.forEach((plugin) => {