@kookaat/strapi-plugin-tinymce 2.0.0 → 2.0.2

package/admin/src/components/Wysiwyg/index.js

@@ -1,122 +0,0 @@
-import React, { useState } from "react";
-import PropTypes from "prop-types";
-import { Stack } from "@strapi/design-system/Stack";
-import { Box } from "@strapi/design-system/Box";
-import { Button } from "@strapi/design-system/Button";
-import { Typography } from "@strapi/design-system/Typography";
-import Landscape from "@strapi/icons/Landscape";
-import MediaLib from "../MediaLib";
-import Editor from "../Editor";
-import { useIntl } from "react-intl";
-
-const Wysiwyg = ({
-    name,
-    onChange,
-    value,
-    intlLabel,
-    disabled,
-    error,
-    description,
-    required,
-}) => {
-    const { formatMessage } = useIntl();
-    const [mediaLibVisible, setMediaLibVisible] = useState(false);
-
-    const handleToggleMediaLib = () => setMediaLibVisible((prev) => !prev);
-
-    const handleChangeAssets = (assets) => {
-        let newValue = value ? value : "";
-
-        assets.map((asset) => {
-            if (asset.mime.includes("image")) {
-                const imgTag = `<p><img src="${asset.url}" alt="${asset.alt}"></img></p>`;
-                newValue = `${newValue}${imgTag}`;
-            }
-            if (asset.mime.includes("video")) {
-                const videoTag = `<video><source src="${asset.url}" alt="${asset.alt}"</source></video>`;
-                newValue = `${newValue}${videoTag}`;
-            }
-        });
-
-        onChange({ target: { name, value: newValue } });
-        handleToggleMediaLib();
-    };
-
-    return (
-        <>
-            <Stack size={1}>
-                <Box>
-                    <Typography variant="pi" fontWeight="bold">
-                        {formatMessage(intlLabel)}
-                    </Typography>
-                    {required && (
-                        <Typography
-                            variant="pi"
-                            fontWeight="bold"
-                            textColor="danger600"
-                        >
-                            *
-                        </Typography>
-                    )}
-                </Box>
-                <Button
-                    startIcon={<Landscape />}
-                    variant="secondary"
-                    fullWidth
-                    onClick={handleToggleMediaLib}
-                >
-                    Media library
-                </Button>
-                <Editor
-                    disabled={disabled}
-                    name={name}
-                    onChange={onChange}
-                    value={value}
-                />
-                {error && (
-                    <Typography variant="pi" textColor="danger600">
-                        {formatMessage({ id: error, defaultMessage: error })}
-                    </Typography>
-                )}
-                {description && (
-                    <Typography variant="pi">
-                        {formatMessage(description)}
-                    </Typography>
-                )}
-            </Stack>
-            <MediaLib
-                isOpen={mediaLibVisible}
-                onChange={handleChangeAssets}
-                onToggle={handleToggleMediaLib}
-            />
-        </>
-    );
-};
-
-Wysiwyg.defaultProps = {
-    description: "",
-    disabled: false,
-    error: undefined,
-    intlLabel: "",
-    required: false,
-    value: "",
-};
-
-Wysiwyg.propTypes = {
-    description: PropTypes.shape({
-        id: PropTypes.string,
-        defaultMessage: PropTypes.string,
-    }),
-    disabled: PropTypes.bool,
-    error: PropTypes.string,
-    intlLabel: PropTypes.shape({
-        id: PropTypes.string,
-        defaultMessage: PropTypes.string,
-    }),
-    name: PropTypes.string.isRequired,
-    onChange: PropTypes.func.isRequired,
-    required: PropTypes.bool,
-    value: PropTypes.string,
-};
-
-export default Wysiwyg;

package/admin/src/index.js

@@ -1,78 +0,0 @@
-import pluginPkg from "../../package.json";
-import pluginId from "./pluginId";
-import Initializer from "./components/Initializer";
-import Wysiwyg from "./components/Wysiwyg";
-import { getTrad } from "./utils";
-import pluginPermissions from "./permissions";
-
-const prefixPluginTranslations = (trad, pluginId) => {
-    if (!pluginId) {
-        throw new TypeError("pluginId can't be empty");
-    }
-    return Object.keys(trad).reduce((acc, current) => {
-        acc[`${pluginId}.${current}`] = trad[current];
-        return acc;
-    }, {});
-};
-
-const name = pluginPkg.strapi.name;
-
-export default {
-    register(app) {
-        app.addFields({ type: "wysiwyg", Component: Wysiwyg });
-        app.createSettingSection(
-            {
-                id: pluginId,
-                intlLabel: {
-                    id: `${pluginId}.plugin.name`,
-                    defaultMessage: "TinyMCE",
-                },
-            },
-            [
-                {
-                    intlLabel: {
-                        id: getTrad("settings.page-title"),
-                        defaultMessage: "Configuration",
-                    },
-                    id: "settings",
-                    to: `/settings/${pluginId}`,
-                    Component: async () => {
-                        return import("./pages/Settings");
-                    },
-                    permissions: pluginPermissions["settings"],
-                },
-            ]
-        );
-        app.registerPlugin({
-            id: pluginId,
-            initializer: Initializer,
-            isReady: false,
-            name,
-        });
-    },
-
-    bootstrap(app) {},
-    async registerTrads({ locales }) {
-        const importedTrads = await Promise.all(
-            locales.map((locale) => {
-                return import(
-                    /* webpackChunkName: "translation-[request]" */ `./translations/${locale}.json`
-                )
-                    .then(({ default: data }) => {
-                        return {
-                            data: prefixPluginTranslations(data, pluginId),
-                            locale,
-                        };
-                    })
-                    .catch(() => {
-                        return {
-                            data: {},
-                            locale,
-                        };
-                    });
-            })
-        );
-
-        return Promise.resolve(importedTrads);
-    },
-};

package/admin/src/pages/App/index.js

@@ -1,25 +0,0 @@
-/**
- *
- * This component is the skeleton around the actual pages, and should only
- * contain code that should be seen on all pages. (e.g. navigation bar)
- *
- */
-
-import React from 'react';
-import { Switch, Route } from 'react-router-dom';
-import { NotFound } from '@strapi/helper-plugin';
-import pluginId from '../../pluginId';
-import HomePage from '../HomePage';
-
-const App = () => {
-  return (
-    <div>
-      <Switch>
-        <Route path={`/plugins/${pluginId}`} component={HomePage} exact />
-        <Route component={NotFound} />
-      </Switch>
-    </div>
-  );
-};
-
-export default App;

package/admin/src/pages/HomePage/index.js

@@ -1,7 +0,0 @@
-import React, { memo } from "react";
-
-const HomePage = () => {
-    return <></>;
-};
-
-export default memo(HomePage);

package/admin/src/pages/Settings/index.js

@@ -1,134 +0,0 @@
-import React, { useEffect, useState } from "react";
-import { useNotification, Page } from "@strapi/strapi/admin";
-import { Box } from "@strapi/design-system/Box";
-import { Stack } from "@strapi/design-system/Stack";
-import { Button } from "@strapi/design-system/Button";
-import { Grid, GridItem } from "@strapi/design-system/Grid";
-import { HeaderLayout } from "@strapi/design-system/Layout";
-import { ContentLayout } from "@strapi/design-system/Layout";
-import { Typography } from "@strapi/design-system/Typography";
-import { useIntl } from "react-intl";
-import { getTrad } from "../../utils";
-import { TextInput } from "@strapi/design-system/TextInput";
-import Check from "@strapi/icons/Check";
-import taskRequests from "../../api/settings";
-
-const Settings = () => {
-    const toggleNotification = useNotification();
-    const { formatMessage } = useIntl();
-    const [isLoading, setIsLoading] = useState(false);
-    const [isSaving, setIsSaving] = useState(false);
-    const [currentApiKey, setCurrentApiKey] = useState("");
-
-    useEffect(() => {
-        setIsLoading(true);
-        const getApiKey = async () => {
-            const data = await taskRequests.getSettings();
-            if (data) {
-                setIsLoading(false);
-                return setCurrentApiKey(data.data.apiKey);
-            }
-        };
-        getApiKey();
-    }, [setCurrentApiKey]);
-
-    const handleSubmit = async () => {
-        setIsSaving(true);
-        await taskRequests.setSettings(currentApiKey);
-        setIsSaving(false);
-        toggleNotification({
-            type: "success",
-            message: formatMessage({
-                id: getTrad("settings.success-message"),
-                defaultMessage: "Settings successfully updated",
-            }),
-        });
-    };
-
-    const handleChange = (e) => {
-        setCurrentApiKey(() => e.target.value);
-    };
-
-    return (
-        <>
-            <HeaderLayout
-                id="title"
-                title={formatMessage({
-                    id: getTrad("settings.title"),
-                    defaultMessage: "TinyMCE",
-                })}
-                subtitle={formatMessage({
-                    id: getTrad("settings.subtitle"),
-                    defaultMessage:
-                        "Manage the settings of your TinyMCE plugin",
-                })}
-                primaryAction={
-                    isLoading ? (
-                        <></>
-                    ) : (
-                        <Button
-                            onClick={handleSubmit}
-                            startIcon={<Check />}
-                            size="L"
-                            disabled={isSaving}
-                            loading={isSaving}
-                        >
-                            {formatMessage({
-                                id: getTrad("settings.save-button"),
-                                defaultMessage: "Save",
-                            })}
-                        </Button>
-                    )
-                }
-            ></HeaderLayout>
-            {isLoading ? (
-                <Page.Loading />
-            ) : (
-                <ContentLayout>
-                    <Box
-                        background="neutral0"
-                        hasRadius
-                        shadow="filterShadow"
-                        paddingTop={6}
-                        paddingBottom={6}
-                        paddingLeft={7}
-                        paddingRight={7}
-                    >
-                        <Stack size={3}>
-                            <Typography>
-                                {formatMessage({
-                                    id: getTrad("settings.content-title"),
-                                    defaultMessage:
-                                        "Set your API key for TinyMCE editor.",
-                                })}
-                            </Typography>
-                            <Grid gap={6}>
-                                <GridItem col={8} s={18}>
-                                    <TextInput
-                                        id="api-key"
-                                        name="key"
-                                        onChange={handleChange}
-                                        label={formatMessage({
-                                            id: getTrad("settings.input-title"),
-                                            defaultMessage: "API key",
-                                        })}
-                                        value={currentApiKey}
-                                        placeholder={formatMessage({
-                                            id: getTrad(
-                                                "settings.input-placeholder"
-                                            ),
-                                            defaultMessage:
-                                                "ex: ADASFNASF46564SAD",
-                                        })}
-                                    />
-                                </GridItem>
-                            </Grid>
-                        </Stack>
-                    </Box>
-                </ContentLayout>
-            )}
-        </>
-    );
-};
-
-export default Settings;

package/admin/src/permissions.js

@@ -1,11 +0,0 @@
-const pluginPermissions = {
-    // This permission regards the main component (App) and is used to tell
-    // If the plugin link should be displayed in the menu
-    // And also if the plugin is accessible. This use case is found when a user types the url of the
-    // plugin directly in the browser
-    'menu-link': [{ action: 'plugin::tinymce.menu-link', subject: null }],
-    settings: [{ action: 'plugin::tinymce.settings.read', subject: null }],
-  };
-  
-  export default pluginPermissions;
-  

package/admin/src/pluginId.js

@@ -1,5 +0,0 @@
-const pluginPkg = require("../../package.json");
-
-const pluginId = pluginPkg.name.replace(/^(@kookaat\/strapi-)plugin-/i, "");
-
-module.exports = pluginId;

package/admin/src/translations/cs.json

@@ -1,10 +0,0 @@
-{
-    "settings.title": "TinyMCE",
-    "settings.subtitle": "Úprava nastavení pluginu TinyMCE",
-    "settings.content-title": "Nastavení klíče API pro editor TinyMCE.",
-    "settings.save-button": "Uložit",
-    "settings.input-title": "API klíč",
-    "settings.input-placeholder": "např. eegrtg8464asnbvvvfasd46486asldaeerer45888areettzh",
-    "settings.success-message": "Nastavení bylo úspěšně uloženo.",
-    "settings.page-title": "Konfigurace"
-}

package/admin/src/translations/en.json

@@ -1,10 +0,0 @@
-{
-    "settings.title": "TinyMCE",
-    "settings.subtitle": "Edit settings of your TinyMCE plugin",
-    "settings.content-title": "Set API key for TinyMCE editor.",
-    "settings.save-button": "Save",
-    "settings.input-title": "API key",
-    "settings.input-placeholder": "ex. eegrtg8464asnbvvvfasd46486asldaeerer45888areettzh",
-    "settings.success-message": "Settings successfully updated",
-    "settings.page-title": "Configuration"
-}

package/admin/src/translations/sk.json

@@ -1,10 +0,0 @@
-{
-    "settings.title": "TinyMCE",
-    "settings.subtitle": "Upravte nastavenia vášho TinyMCE pluginu",
-    "settings.content-title": "Nastavte API kľúč pre TinyMCE editor.",
-    "settings.save-button": "Uložiť",
-    "settings.input-title": "API kľúč",
-    "settings.input-placeholder": "napr. eegrtg8464asnbvvvfasd46486asldaeerer45888areettzh",
-    "settings.success-message": "Nastavenia boli úspešne uložené.",
-    "settings.page-title": "Konfigurácia"
-}

package/admin/src/utils/axiosInstance.js

@@ -1,40 +0,0 @@
-/**
- * axios with a custom config.
- */
-
-import axios from 'axios';
-import { auth } from '@strapi/helper-plugin';
-
-const instance = axios.create({
-  baseURL: process.env.STRAPI_ADMIN_BACKEND_URL,
-});
-
-instance.interceptors.request.use(
-  async config => {
-    config.headers = {
-      Authorization: `Bearer ${auth.getToken()}`,
-      Accept: 'application/json',
-      'Content-Type': 'application/json',
-    };
-
-    return config;
-  },
-  error => {
-    Promise.reject(error);
-  }
-);
-
-instance.interceptors.response.use(
-  response => response,
-  error => {
-    // whatever you want to do with the error
-    if (error.response?.status === 401) {
-      auth.clearAppStorage();
-      window.location.reload();
-    }
-
-    throw error;
-  }
-);
-
-export default instance;

package/admin/src/utils/get-trad.js

@@ -1,5 +0,0 @@
-import pluginId from '../pluginId';
-
-const getTrad = id => `${pluginId}.${id}`;
-
-export default getTrad;

package/admin/src/utils/index.js

@@ -1,2 +0,0 @@
-export { default as getTrad } from "./get-trad";
-export { default as axiosInstance } from "./axiosInstance";

package/server/bootstrap.js

@@ -1,19 +0,0 @@
-"use strict";
-
-module.exports = async ({ strapi }) => {
-    const actions = [
-        {
-            section: "plugins",
-            displayName: "Access the plugin settings",
-            uid: "settings.read",
-            pluginName: "tinymce",
-        },
-        {
-            section: "plugins",
-            displayName: "Menu link to plugin settings",
-            uid: "menu-link",
-            pluginName: "tinymce",
-        },
-    ];
-    await strapi.admin.services.permission.actionProvider.registerMany(actions);
-};

package/server/config/index.js

@@ -1,6 +0,0 @@
-'use strict';
-
-module.exports = {
-  default: {},
-  validator() {},
-};

package/server/content-types/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-module.exports = {};

package/server/controllers/config.js

@@ -1,12 +0,0 @@
-"use strict";
-
-module.exports = {
-    getConfig: async (ctx) => {
-        const { configKey } = ctx.params;
-        const config = await strapi
-            .plugin("tinymce")
-            .service("config")
-            .getConfig(configKey);
-        ctx.send(config);
-    },
-};

package/server/controllers/index.js

@@ -1,9 +0,0 @@
-"use strict";
-
-const config = require("./config");
-const settings = require("./settings");
-
-module.exports = {
-    config,
-    settings,
-};

package/server/controllers/settings.js

@@ -1,30 +0,0 @@
-"use strict";
-
-module.exports = {
-    getSettings: async (ctx) => {
-        try {
-            ctx.body = await strapi
-                .plugin("tinymce")
-                .service("settings")
-                .getSettings();
-        } catch (err) {
-            ctx.body = err;
-            ctx.throw(500, err);
-        }
-    },
-    setSettings: async (ctx) => {
-        const { body } = ctx.request;
-        try {
-            await strapi
-                .plugin("tinymce")
-                .service("settings")
-                .setSettings(body);
-            ctx.body = await strapi
-                .plugin("tinymce")
-                .service("settings")
-                .getSettings();
-        } catch (err) {
-            ctx.throw(500, err);
-        }
-    },
-};

package/server/destroy.js

@@ -1,5 +0,0 @@
-'use strict';
-
-module.exports = ({ strapi }) => {
-  // destroy phase
-};

package/server/index.js

@@ -1,25 +0,0 @@
-'use strict';
-
-const register = require('./register');
-const bootstrap = require('./bootstrap');
-const destroy = require('./destroy');
-const config = require('./config');
-const contentTypes = require('./content-types');
-const controllers = require('./controllers');
-const routes = require('./routes');
-const middlewares = require('./middlewares');
-const policies = require('./policies');
-const services = require('./services');
-
-module.exports = {
-  register,
-  bootstrap,
-  destroy,
-  config,
-  controllers,
-  routes,
-  services,
-  contentTypes,
-  policies,
-  middlewares,
-};

package/server/middlewares/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-module.exports = {};

package/server/policies/index.js

@@ -1,3 +0,0 @@
-'use strict';
-
-module.exports = {};

package/server/register.js

@@ -1,5 +0,0 @@
-'use strict';
-
-module.exports = ({ strapi }) => {
-  // registeration phase
-};

package/server/routes/config.js

@@ -1,13 +0,0 @@
-"use strict";
-
-module.exports = {
-    type: "admin",
-    routes: [
-        {
-            method: "GET",
-            path: "/config/:configKey",
-            handler: "config.getConfig",
-            config: { policies: [] },
-        },
-    ],
-};

package/server/routes/index.js

@@ -1,7 +0,0 @@
-const config = require("./config");
-const settings = require("./settings");
-
-module.exports = {
-    config,
-    settings,
-};

package/server/routes/settings.js

@@ -1,23 +0,0 @@
-module.exports = {
-    type: "admin",
-    routes: [
-        {
-            method: "GET",
-            path: "/settings",
-            handler: "settings.getSettings",
-            config: {
-                policies: [],
-                auth: false,
-            },
-        },
-        {
-            method: "POST",
-            path: "/settings",
-            handler: "settings.setSettings",
-            config: {
-                policies: [],
-                auth: false,
-            },
-        },
-    ],
-};

package/server/services/config.js

@@ -1,9 +0,0 @@
-"use strict";
-
-module.exports = ({ strapi }) => {
-    return {
-        getConfig(key = "editor") {
-            return strapi.plugin("tinymce").config(key) ?? {};
-        },
-    };
-};