Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Make useSetting return value and setter

Browse Source 
[MAILPOET-2677]
This commit is contained in:
Amine Ben hammou
2020-03-11 15:22:01 +01:00
committed by Veljko V
parent f8d88c70a4
commit 6cdb029465
5 changed files with 21 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
assets/js/src/settings/pages/basics/default_sender.tsx
View File

@@ -1,19 +1,15 @@
import React from 'react';
import MailPoet from 'mailpoet';
import { Label, Inputs } from 'settings/components';
import { useSetting, useSettingSetter, useSelector } from 'settings/store/hooks';
import { useSetting, useSelector } from 'settings/store/hooks';
import SenderEmailAddressWarning from 'common/sender_email_address_warning.jsx';
export default function DefaultSender() {
const isMssActive = useSelector('isMssActive')();
const senderName = useSetting('sender', 'name');
const setSenderName = useSettingSetter('sender', 'name');
const senderEmail = useSetting('sender', 'address');
const setSenderEmail = useSettingSetter('sender', 'address');
const replyToName = useSetting('reply_to', 'name');
const setReplyToName = useSettingSetter('reply_to', 'name');
const replyToEmail = useSetting('reply_to', 'address');
const setReplyToEmail = useSettingSetter('reply_to', 'address');
const [senderName, setSenderName] = useSetting('sender', 'name');
const [senderEmail, setSenderEmail] = useSetting('sender', 'address');
const [replyToName, setReplyToName] = useSetting('reply_to', 'name');
const [replyToEmail, setReplyToEmail] = useSetting('reply_to', 'address');
return (
<>
<Label

1
assets/js/src/settings/store/hooks/index.ts
View File

@@ -1,4 +1,3 @@
export * from './useActions';
export * from './useSetting';
export * from './useSettingSetter';
export { default as useSelector } from './useSelector';

3
assets/js/src/settings/store/hooks/types.ts
View File

@@ -13,3 +13,6 @@ export type Tail<T extends any[]> =
*/
export type ExcludeFirstParam<F extends ((...args: any[]) => any)> =
(...args: Tail<Parameters<F>>) => ReturnType<F>
export type ValueAndSetter<T> = [T, (value: T) => any]

19
assets/js/src/settings/store/hooks/useSetting.ts
View File

@@ -1,7 +1,10 @@
import { Settings } from '../types';
import useSelector from './useSelector';
import { ValueAndSetter } from './types';
import { useAction } from './useActions';
/**
* Takes the path of a setting (ie. key1, key2, key3,...) and returns its value.
* Takes the path of a setting (ie. key1, key2, key3,...) and returns an array with two items:
* the first is the setting value and the second is a setter for that setting.
* Here we are declaring the signatures in case it takes 1, 2, and 3 keys.
* Additional overloaded signatures can be added to go as deep as we want.
* See:
@@ -9,16 +12,20 @@ import useSelector from './useSelector';
* overloading functions: http://www.typescriptlang.org/docs/handbook/declaration-files/do-s-and-don-ts.html#function-overloads
*/
export function useSetting<Key1 extends keyof Settings>
(key1: Key1): Settings[Key1];
(key1: Key1): ValueAndSetter<Settings[Key1]>;
export function useSetting<Key1 extends keyof Settings, Key2 extends keyof Settings[Key1]>
(key1: Key1, key2: Key2): Settings[Key1][Key2];
(key1: Key1, key2: Key2): ValueAndSetter<Settings[Key1][Key2]>;
export function useSetting<
Key1 extends keyof Settings,
Key2 extends keyof Settings[Key1],
Key3 extends keyof Settings[Key1][Key2]>
(key1: Key1, key2: Key2, key3: Key3): Settings[Key1][Key2][Key3];
(key1: Key1, key2: Key2, key3: Key3): ValueAndSetter<Settings[Key1][Key2][Key3]>;
export function useSetting(...path: string[]): any {
export function useSetting(...path: string[]): [any, (value: any) => any] {
const getValue = useSelector('getSetting');
return getValue(path);
const setValue = useAction('setSetting');
return [
getValue(path),
(value) => setValue(path, value),
];
}

29
assets/js/src/settings/store/hooks/useSettingSetter.ts
View File

@@ -1,29 +0,0 @@
import { Settings, Action } from '../types';
import { useAction } from './useActions';
/**
* Takes the path of a setting (ie. key1, key2, key3,...) and returns its setter.
* Here we are declaring the signatures in case it takes 1, 2, and 3 keys.
* Additional overloaded signatures can be added to go as deep as we want.
* See:
* keyof: http://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-1.html#keyof-and-lookup-types
* overloading functions: http://www.typescriptlang.org/docs/handbook/declaration-files/do-s-and-don-ts.html#function-overloads
*/
export function useSettingSetter<Key1 extends keyof Settings, Value extends Settings[Key1]>
(key1: Key1): ((value: Value) => Promise<Action>);
export function useSettingSetter<
Key1 extends keyof Settings,
Key2 extends keyof Settings[Key1],
Value extends Settings[Key1][Key2]>
(key1: Key1, key2: Key2): ((value: Value) => Promise<Action>);
export function useSettingSetter<
Key1 extends keyof Settings,
Key2 extends keyof Settings[Key1],
Key3 extends keyof Settings[Key1][Key2],
Value extends Settings[Key1][Key2][Key3]>
(key1: Key1, key2: Key2, key3: Key3): ((value: Value) => Promise<Action>);
export function useSettingSetter(...path: string[]) {
const setValue = useAction('setSetting');
return async (value) => setValue(path, value);
}