-
Notifications
You must be signed in to change notification settings - Fork 84
/
history.ts
88 lines (82 loc) 路 2.71 KB
/
history.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
import { createBrowserHistory } from "history";
import queryString from "query-string";
import type { GlobalState } from "../../shared/types";
import { ControlType } from "../../shared/types";
import config from "./get-config";
import debug from "./debug";
export const history = createBrowserHistory();
export { Action } from "history";
export const resetParams = () => {
history.push(getHref({}));
};
const removeDefaultValues = (params: Partial<GlobalState>) => {
Object.keys(params).forEach((key) => {
const val = params[key as keyof GlobalState];
const defaultVal = (config.addons as any)[key]
? (config.addons as any)[key].defaultState
: "$$LADLE_unknown";
if (val === defaultVal) {
//@ts-ignore
delete params[key];
}
});
};
export const modifyParams = (globalState: GlobalState) => {
if (!globalState.controlInitialized) return;
const queryParams = queryString.parse(location.search);
const userQueryParams: { [key: string]: string } = {};
Object.keys(queryParams).forEach((key) => {
if (!key.startsWith("arg-")) {
userQueryParams[key] = queryParams[key] as string;
}
});
const params = {
...userQueryParams,
mode: globalState.mode,
rtl: globalState.rtl,
source: globalState.source,
story: globalState.story,
theme: globalState.theme,
width: globalState.width,
control: globalState.control,
};
removeDefaultValues(params);
if (location.search !== getHref(params)) {
debug(`Updating URL to ${getHref(params)}`);
history.push(getHref(params));
}
};
export const getHref = (params: Partial<GlobalState>) => {
removeDefaultValues(params);
const encodedParams: { [key: string]: any } = {};
Object.keys(params).forEach((key: string) => {
if (key === "control") {
// for controls we are spreading individual args into URL
Object.keys(params[key] as any).forEach((argKey) => {
const arg = (params[key] as any)[argKey];
if (arg.type === ControlType.Action) {
// a special case, actions are handled by the addon-action
return;
}
let value = arg.value;
let isValueDefault = false;
value = encodeURI(
typeof arg.value === "string" ? arg.value : JSON.stringify(arg.value),
);
try {
isValueDefault =
JSON.stringify(arg.value) === JSON.stringify(arg.defaultValue);
if (
!isValueDefault &&
JSON.stringify(value) !== JSON.stringify(arg.defaultValue)
) {
encodedParams[`arg-${argKey}`] = value;
}
} catch (e) {}
});
} else {
encodedParams[key] = (params as any)[key];
}
});
return `?${queryString.stringify(encodedParams)}`;
};