@webbycrown/webbycommerce 1.2.1 → 2.0.0

package/admin/src/pages/ApiCollections.jsx

@@ -0,0 +1,169 @@
+'use strict';
+
+import React from 'react';
+import { useIntl } from 'react-intl';
+import { Box, Flex, Typography } from '@strapi/design-system';
+
+import { PLUGIN_ID } from '../pluginId';
+
+const ApiCollections = () => {
+  const { formatMessage } = useIntl();
+
+  const title = formatMessage({
+    id: `${PLUGIN_ID}.settings.apiCollections.title`,
+    defaultMessage: 'API Collections',
+  });
+
+  const description = formatMessage({
+    id: `${PLUGIN_ID}.settings.apiCollections.description`,
+    defaultMessage:
+      'Reference for the public endpoints exposed by the Strapi Advanced Ecommerce plugin.',
+  });
+
+  return (
+    <Box padding={6}>
+      <Typography variant="alpha" textColor="neutral800">
+        {title}
+      </Typography>
+
+      <Box
+        background="neutral0"
+        padding={6}
+        shadow="filterShadow"
+        hasRadius
+        marginTop={4}
+      >
+        <Typography variant="epsilon" textColor="neutral800">
+          {description}
+        </Typography>
+
+        <Box marginTop={6}>
+          <Typography variant="delta" textColor="neutral800">
+            {formatMessage({
+              id: `${PLUGIN_ID}.settings.apiCollections.health.title`,
+              defaultMessage: 'Health Check',
+            })}
+          </Typography>
+
+          <Box marginTop={2}>
+            <Typography variant="pi" textColor="neutral600">
+              {formatMessage({
+                id: `${PLUGIN_ID}.settings.apiCollections.health.summary`,
+                defaultMessage:
+                  'Simple endpoint to verify that the ecommerce plugin is installed and running.',
+              })}
+            </Typography>
+          </Box>
+
+          <Box marginTop={4}>
+            <Flex gap={3} direction="column" alignItems="flex-start">
+              <Box>
+                <Typography variant="pi" fontWeight="bold">
+                  GET
+                </Typography>{' '}
+                <Typography variant="pi" textColor="neutral800">
+                  /webbycommerce/health
+                </Typography>
+              </Box>
+
+              <Typography variant="pi" textColor="neutral600">
+                {formatMessage({
+                  id: `${PLUGIN_ID}.settings.apiCollections.health.auth`,
+                  defaultMessage: 'Auth: public (no authentication required by default).',
+                })}
+              </Typography>
+
+              <Box>
+                <Typography variant="pi" textColor="neutral800" fontWeight="bold">
+                  {formatMessage({
+                    id: `${PLUGIN_ID}.settings.apiCollections.health.response.title`,
+                    defaultMessage: 'Successful response (200 OK)',
+                  })}
+                </Typography>
+                <Box
+                  marginTop={2}
+                  padding={4}
+                  background="neutral100"
+                  hasRadius
+                  style={{ fontFamily: 'monospace', fontSize: '12px' }}
+                >
+                  {`{
+  "status": "ok",
+  "plugin": "webbycommerce",
+  "message": "Ecommerce plugin is running"
+}`}
+                </Box>
+              </Box>
+
+              <Box marginTop={2}>
+                <Typography variant="pi" textColor="neutral800" fontWeight="bold">
+                  {formatMessage({
+                    id: `${PLUGIN_ID}.settings.apiCollections.health.usage.title`,
+                    defaultMessage: 'Typical usage',
+                  })}
+                </Typography>
+                <Box as="ul" marginTop={1} paddingLeft={4}>
+                  <li>
+                    <Typography variant="pi" textColor="neutral600">
+                      {formatMessage({
+                        id: `${PLUGIN_ID}.settings.apiCollections.health.usage.monitoring`,
+                        defaultMessage: 'Use in uptime monitors to check ecommerce availability.',
+                      })}
+                    </Typography>
+                  </li>
+                  <li>
+                    <Typography variant="pi" textColor="neutral600">
+                      {formatMessage({
+                        id: `${PLUGIN_ID}.settings.apiCollections.health.usage.deploy`,
+                        defaultMessage:
+                          'Use in deployment or CI pipelines to validate the plugin is bootstrapped.',
+                      })}
+                    </Typography>
+                  </li>
+                  <li>
+                    <Typography variant="pi" textColor="neutral600">
+                      {formatMessage({
+                        id: `${PLUGIN_ID}.settings.apiCollections.health.usage.manual`,
+                        defaultMessage:
+                          'Quick manual verification from a browser or API client (Postman, Insomnia, curl).',
+                      })}
+                    </Typography>
+                  </li>
+                </Box>
+              </Box>
+
+              <Box marginTop={2}>
+                <Typography variant="pi" textColor="neutral800" fontWeight="bold">
+                  curl
+                </Typography>
+                <Box
+                  marginTop={2}
+                  padding={4}
+                  background="neutral100"
+                  hasRadius
+                  style={{ fontFamily: 'monospace', fontSize: '12px' }}
+                >
+                  {`curl http://localhost:1337/webbycommerce/health`}
+                </Box>
+              </Box>
+            </Flex>
+          </Box>
+
+          <Box marginTop={8}>
+            <Typography variant="pi" textColor="neutral500">
+              {formatMessage({
+                id: `${PLUGIN_ID}.settings.apiCollections.footer`,
+                defaultMessage:
+                  'As you add more ecommerce endpoints (products, cart, orders, etc.), they can be documented here for your team.',
+              })}
+            </Typography>
+          </Box>
+        </Box>
+      </Box>
+    </Box>
+  );
+};
+
+export default ApiCollections;
+
+

package/admin/src/pages/Configure.jsx

@@ -0,0 +1,55 @@
+'use strict';
+
+import React from 'react';
+import { useIntl } from 'react-intl';
+import { Box, Flex, Typography } from '@strapi/design-system';
+
+import { PLUGIN_ID } from '../pluginId';
+
+const Configure = () => {
+  const { formatMessage } = useIntl();
+
+  const title = formatMessage({
+    id: `${PLUGIN_ID}.settings.configure.title`,
+    defaultMessage: 'Configure',
+  });
+
+  const description = formatMessage({
+    id: `${PLUGIN_ID}.settings.configure.description`,
+    defaultMessage:
+      'Global settings for the Strapi Advanced Ecommerce plugin. Use this page to control ecommerce-wide behavior.',
+  });
+
+  return (
+    <Box padding={6}>
+      <Typography variant="alpha" textColor="neutral800">
+        {formatMessage({
+          id: `${PLUGIN_ID}.settings.section`,
+          defaultMessage: 'Advanced Ecommerce',
+        })}
+      </Typography>
+
+      <Box
+        background="neutral0"
+        padding={6}
+        shadow="filterShadow"
+        hasRadius
+        marginTop={4}
+      >
+        <Typography variant="beta" textColor="neutral800">
+          {title}
+        </Typography>
+
+        <Box marginTop={2}>
+          <Typography variant="pi" textColor="neutral600">
+            {description}
+          </Typography>
+        </Box>
+      </Box>
+    </Box>
+  );
+};
+
+export default Configure;
+
+

package/admin/src/pages/Settings.jsx

@@ -0,0 +1,93 @@
+'use strict';
+
+import React, { useState } from 'react';
+import { useIntl } from 'react-intl';
+import { Main, Box, Flex, Typography, Button } from '@strapi/design-system';
+
+import { PLUGIN_ID } from '../pluginId';
+import ConfigureContent from '../components/ConfigureContent';
+import ApiCollectionsContent from '../components/ApiCollectionsContent';
+import LoginRegisterContent from '../components/LoginRegisterContent';
+import ShippingTypeContent from '../components/ShippingTypeContent';
+import SmtpContent from '../components/SmtpContent';
+
+const Settings = () => {
+  const { formatMessage } = useIntl();
+  const [activeView, setActiveView] = useState('configure');
+
+  const titleId = `${PLUGIN_ID}-settings-title`;
+
+  return (
+    <Main labelledBy={titleId}>
+      <Box padding={8} background="neutral100">
+        <Box paddingBottom={4}>
+          <Typography id={titleId} variant="alpha" as="h1">
+            {formatMessage({
+              id: `${PLUGIN_ID}.settings.section`,
+              defaultMessage: 'Advanced Ecommerce',
+            })}
+          </Typography>
+        </Box>
+
+        <Box background="neutral0" padding={6} shadow="filterShadow" hasRadius>
+          <Flex gap={2} marginBottom={6} wrap="wrap">
+            <Button
+              variant={activeView === 'configure' ? 'default' : 'tertiary'}
+              onClick={() => setActiveView('configure')}
+            >
+              {formatMessage({
+                id: `${PLUGIN_ID}.settings.configure.title`,
+                defaultMessage: 'Configure',
+              })}
+            </Button>
+            <Button
+              variant={activeView === 'login-register' ? 'default' : 'tertiary'}
+              onClick={() => setActiveView('login-register')}
+            >
+              {formatMessage({
+                id: `${PLUGIN_ID}.settings.loginRegister.title`,
+                defaultMessage: 'Login/Register',
+              })}
+            </Button>
+            <Button
+              variant={activeView === 'shipping-type' ? 'default' : 'tertiary'}
+              onClick={() => setActiveView('shipping-type')}
+            >
+              {formatMessage({
+                id: `${PLUGIN_ID}.settings.shippingType.title`,
+                defaultMessage: 'Shipping Type',
+              })}
+            </Button>
+            <Button
+              variant={activeView === 'smtp' ? 'default' : 'tertiary'}
+              onClick={() => setActiveView('smtp')}
+            >
+              {formatMessage({
+                id: `${PLUGIN_ID}.settings.smtp.title`,
+                defaultMessage: 'SMTP',
+              })}
+            </Button>
+            <Button
+              variant={activeView === 'api-collections' ? 'default' : 'tertiary'}
+              onClick={() => setActiveView('api-collections')}
+            >
+              {formatMessage({
+                id: `${PLUGIN_ID}.settings.apiCollections.title`,
+                defaultMessage: 'API Collections',
+              })}
+            </Button>
+          </Flex>
+
+          {activeView === 'configure' && <ConfigureContent />}
+          {activeView === 'login-register' && <LoginRegisterContent />}
+          {activeView === 'shipping-type' && <ShippingTypeContent />}
+          {activeView === 'smtp' && <SmtpContent />}
+          {activeView === 'api-collections' && <ApiCollectionsContent />}
+        </Box>
+      </Box>
+    </Main>
+  );
+};
+
+export default Settings;
+

package/admin/src/pluginId.js

@@ -0,0 +1,4 @@
+'use strict';
+
+export const PLUGIN_ID = 'webbycommerce';
+