@vonaffenfels/contentful-teasermanager 1.2.22 → 1.2.23

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@vonaffenfels/contentful-teasermanager",
-    "version": "1.2.22",
+    "version": "1.2.23",
     "main": "dist/index.js",
     "scripts": {
         "prepublish": "yarn run build",
@@ -98,11 +98,11 @@
         "webpack-dev-server": "^4.0.0-beta.2"
     },
     "dependencies": {
-        "@vonaffenfels/slate-editor": "^1.2.19",
+        "@vonaffenfels/slate-editor": "^1.2.23",
         "contentful-resolve-response": "^1.9.2",
         "webpack": "5.88.2"
     },
-    "gitHead": "1914d362b401e249ed1c116aef8e12d94311b4c7",
+    "gitHead": "f655174e66d666f29f698c19fa9f32984c1408c3",
     "publishConfig": {
         "access": "public"
     }

package/postcss.config.js

@@ -1,7 +1,7 @@
-module.exports = {
-    plugins: {
-        'postcss-import': {},
-        tailwindcss: {},
-        autoprefixer: {},
-    },
+module.exports = {
+    plugins: {
+        'postcss-import': {},
+        tailwindcss: {},
+        autoprefixer: {},
+    },
 };

package/src/components/Contentful/ConfigScreen.js

@@ -1,155 +1,155 @@
-import React, {
-    useEffect, useState,
-} from 'react';
-import {
-    Form, Workbench,
-} from '@contentful/forma-36-react-components';
-import {
-    Button, Flex,
-    FormControl, Subheading, TextInput,
-} from '@contentful/f36-components';
-import {Multiselect} from '@contentful/f36-multiselect';
-import {css} from 'emotion';
-
-const Config = ({sdk}) => {
-    const [params, setParams] = useState({
-        usersWithAccess: {},
-        portalsWithAccess: [],
-    });
-    const [spaceUsers, setSpaceUsers] = useState([]);
-
-    const onConfigure = async () => {
-        const currentState = await sdk.app.getCurrentState();
-
-        return {
-            parameters: params,
-            targetState: currentState,
-        };
-    };
-
-    useEffect(() => {
-        if (sdk) {
-            sdk.app.getParameters().then(params => {
-                if (!params) {
-                    return;
-                }
-
-                if (Array.isArray(params?.usersWithAccess)) {
-                    params.usersWithAccess = {};
-                }
-
-                setParams(params);
-                sdk.app.setReady();
-            });
-            sdk.space.getUsers().then(users => {
-                setSpaceUsers(users.items.map(v => v.email));
-            });
-        }
-    }, [sdk]);
-
-    useEffect(() => {
-        if (sdk) {
-            sdk.app.onConfigure(() => onConfigure());
-        }
-    }, [sdk, params]);
-
-    const handleSelectItem = (event, portal) => {
-        const {
-            checked,
-            value,
-        } = event.target;
-
-        let newValue = params?.usersWithAccess?.[portal] || [];
-        if (checked) {
-            newValue = [...newValue, value];
-        } else {
-            newValue = newValue.filter((email) => email !== value);
-        }
-
-        setParams({
-            ...params,
-            usersWithAccess: {
-                ...(params.usersWithAccess || {}),
-                [portal]: newValue,
-            },
-        });
-    };
-
-    const addPortal = () => {
-        const newPortal = document.getElementsByName("newPortal")[0].value;
-        const portals = params.portalsWithAccess || [];
-
-        if (!newPortal || portals.includes(newPortal)) {
-            return;
-        }
-
-        setParams({
-            ...params,
-            portalsWithAccess: [...portals, newPortal.trim()].filter(Boolean),
-        });
-    };
-
-    const removePortal = (portal) => {
-        const portals = params.portalsWithAccess || [];
-
-        setParams({
-            ...params,
-            portalsWithAccess: portals.filter(v => v !== portal),
-        });
-    };
-
-    return (
-        <Workbench className={css({
-            padding: '80px',
-            backgroundColor: "#FFF",
-        })}>
-            <Form>
-                <FormControl>
-                    <FormControl.Label>Teasermanager Portale mit Zugriffsbeschränkung</FormControl.Label>
-                    <Flex flexDirection="column" gap={"spacingM"}>
-                        <Flex flexDirection="row" gap={"spacingM"}>
-                            <TextInput name="newPortal"/>
-                            <Button onClick={addPortal} variant="positive">Portal hinzufügen</Button>
-                        </Flex>
-                        <Flex flexDirection="column" gap={"spacingM"}>
-                            {params.portalsWithAccess?.map((portal) => {
-                                return <Flex flexDirection="row" gap={"spacingM"} key={portal}>
-                                    <Subheading style={{width: "200px"}}>{portal}</Subheading>
-                                    <Button
-                                        variant="negative"
-                                        key={portal}
-                                        onClick={e => removePortal(portal)}>Löschen</Button>
-                                </Flex>;
-                            })}
-                        </Flex>
-                    </Flex>
-                </FormControl>
-                {params.portalsWithAccess?.map((portal) => {
-                    return <FormControl key={portal}>
-                        <FormControl.Label>{portal} Teasermanager Benutzer</FormControl.Label>
-                        <Multiselect
-                            currentSelection={params.usersWithAccess?.[portal]}
-                            popoverProps={{isFullWidth: true}}
-                        >
-                            {spaceUsers.map((userEmail) => {
-                                const val = userEmail.toLowerCase().replace(/\s/g, '-');
-                                return (
-                                    <Multiselect.Option
-                                        key={`user-${val}}`}
-                                        itemId={`user-${portal}-${val}}`}
-                                        value={userEmail}
-                                        label={userEmail}
-                                        onSelectItem={e => handleSelectItem(e, portal)}
-                                        isChecked={params.usersWithAccess?.[portal]?.includes(userEmail)}
-                                    />
-                                );
-                            })}
-                        </Multiselect>
-                    </FormControl>;
-                })}
-            </Form>
-        </Workbench>
-    );
-};
-
+import React, {
+    useEffect, useState,
+} from 'react';
+import {
+    Form, Workbench,
+} from '@contentful/forma-36-react-components';
+import {
+    Button, Flex,
+    FormControl, Subheading, TextInput,
+} from '@contentful/f36-components';
+import {Multiselect} from '@contentful/f36-multiselect';
+import {css} from 'emotion';
+
+const Config = ({sdk}) => {
+    const [params, setParams] = useState({
+        usersWithAccess: {},
+        portalsWithAccess: [],
+    });
+    const [spaceUsers, setSpaceUsers] = useState([]);
+
+    const onConfigure = async () => {
+        const currentState = await sdk.app.getCurrentState();
+
+        return {
+            parameters: params,
+            targetState: currentState,
+        };
+    };
+
+    useEffect(() => {
+        if (sdk) {
+            sdk.app.getParameters().then(params => {
+                if (!params) {
+                    return;
+                }
+
+                if (Array.isArray(params?.usersWithAccess)) {
+                    params.usersWithAccess = {};
+                }
+
+                setParams(params);
+                sdk.app.setReady();
+            });
+            sdk.space.getUsers().then(users => {
+                setSpaceUsers(users.items.map(v => v.email));
+            });
+        }
+    }, [sdk]);
+
+    useEffect(() => {
+        if (sdk) {
+            sdk.app.onConfigure(() => onConfigure());
+        }
+    }, [sdk, params]);
+
+    const handleSelectItem = (event, portal) => {
+        const {
+            checked,
+            value,
+        } = event.target;
+
+        let newValue = params?.usersWithAccess?.[portal] || [];
+        if (checked) {
+            newValue = [...newValue, value];
+        } else {
+            newValue = newValue.filter((email) => email !== value);
+        }
+
+        setParams({
+            ...params,
+            usersWithAccess: {
+                ...(params.usersWithAccess || {}),
+                [portal]: newValue,
+            },
+        });
+    };
+
+    const addPortal = () => {
+        const newPortal = document.getElementsByName("newPortal")[0].value;
+        const portals = params.portalsWithAccess || [];
+
+        if (!newPortal || portals.includes(newPortal)) {
+            return;
+        }
+
+        setParams({
+            ...params,
+            portalsWithAccess: [...portals, newPortal.trim()].filter(Boolean),
+        });
+    };
+
+    const removePortal = (portal) => {
+        const portals = params.portalsWithAccess || [];
+
+        setParams({
+            ...params,
+            portalsWithAccess: portals.filter(v => v !== portal),
+        });
+    };
+
+    return (
+        <Workbench className={css({
+            padding: '80px',
+            backgroundColor: "#FFF",
+        })}>
+            <Form>
+                <FormControl>
+                    <FormControl.Label>Teasermanager Portale mit Zugriffsbeschränkung</FormControl.Label>
+                    <Flex flexDirection="column" gap={"spacingM"}>
+                        <Flex flexDirection="row" gap={"spacingM"}>
+                            <TextInput name="newPortal"/>
+                            <Button onClick={addPortal} variant="positive">Portal hinzufügen</Button>
+                        </Flex>
+                        <Flex flexDirection="column" gap={"spacingM"}>
+                            {params.portalsWithAccess?.map((portal) => {
+                                return <Flex flexDirection="row" gap={"spacingM"} key={portal}>
+                                    <Subheading style={{width: "200px"}}>{portal}</Subheading>
+                                    <Button
+                                        variant="negative"
+                                        key={portal}
+                                        onClick={e => removePortal(portal)}>Löschen</Button>
+                                </Flex>;
+                            })}
+                        </Flex>
+                    </Flex>
+                </FormControl>
+                {params.portalsWithAccess?.map((portal) => {
+                    return <FormControl key={portal}>
+                        <FormControl.Label>{portal} Teasermanager Benutzer</FormControl.Label>
+                        <Multiselect
+                            currentSelection={params.usersWithAccess?.[portal]}
+                            popoverProps={{isFullWidth: true}}
+                        >
+                            {spaceUsers.map((userEmail) => {
+                                const val = userEmail.toLowerCase().replace(/\s/g, '-');
+                                return (
+                                    <Multiselect.Option
+                                        key={`user-${val}}`}
+                                        itemId={`user-${portal}-${val}}`}
+                                        value={userEmail}
+                                        label={userEmail}
+                                        onSelectItem={e => handleSelectItem(e, portal)}
+                                        isChecked={params.usersWithAccess?.[portal]?.includes(userEmail)}
+                                    />
+                                );
+                            })}
+                        </Multiselect>
+                    </FormControl>;
+                })}
+            </Form>
+        </Workbench>
+    );
+};
+
 export default Config;