@anas_hameed/edly-saas-widget 0.1.0

package/README.rst

@@ -0,0 +1,196 @@
+frontend-template-application
+#############################
+
+|license-badge| |status-badge| |ci-badge| |codecov-badge|
+
+
+Purpose
+*******
+
+This repository is a template for Open edX micro-frontend applications. It is
+flagged as a Template Repository, meaning it can be used as a basis for new
+GitHub repositories by clicking the green "Use this template" button above.
+The rest of this document describes how to work with your new micro-frontend
+**after you've created a new repository from the template.**
+
+Getting Started
+***************
+
+After copying the template repository, you'll want to do a find-and-replace to
+replace all instances of ``frontend-template-application`` with the name of
+your new repository.  Also edit index.html to replace "Application Template"
+with a friendly name for this application that users will see in their browser
+tab.
+
+Prerequisites
+=============
+
+The `devstack`_ is currently recommended as a development environment for your
+new MFE.  If you start it with ``make dev.up.lms`` that should give you
+everything you need as a companion to this frontend.
+
+Note that it is also possible to use `Tutor`_ to develop an MFE.  You can refer
+to the `relevant tutor-mfe documentation`_ to get started using it.
+
+.. _Devstack: https://github.com/openedx/devstack
+
+.. _Tutor: https://github.com/overhangio/tutor
+
+.. _relevant tutor-mfe documentation: https://github.com/overhangio/tutor-mfe#mfe-development
+
+Cloning and Startup
+===================
+
+In the following steps, replace "[PLACEHOLDER]" with the name of the repo you
+created when copying this template above.
+
+1. Clone your new repo:
+
+  ``git clone https://github.com/openedx/frontend-app-[PLACEHOLDER].git``
+
+2. Use node v18.x.
+
+   The current version of the micro-frontend build scripts support node 18.
+   Using other major versions of node *may* work, but this is unsupported.  For
+   convenience, this repository includes an .nvmrc file to help in setting the
+   correct node version via `nvm <https://github.com/nvm-sh/nvm>`_.
+
+3. Install npm dependencies:
+
+  ``cd frontend-app-[PLACEHOLDER] && npm install``
+
+4. Update the application port to use for local development:
+
+   Default port is 8080. If this does not work for you, update the line
+   `PORT=8080` to your port in all .env.* files
+
+5. Start the dev server:
+
+  ``npm start``
+
+The dev server is running at `http://localhost:8080 <http://localhost:8080>`_
+or whatever port you setup.
+
+Making Your New Project's README File
+=====================================
+
+Move ``README-template-frontend-app.rst`` to your project's ``README.rst``
+file. Please fill out all the sections - this helps out all developers
+understand your MFE, how to install it, and how to use it.
+
+Developing
+**********
+
+This section concerns development of ``frontend-template-application`` itself,
+not the templated copy.
+
+It should be noted that one of the goals of this repository is for it to
+function correctly as an MFE (as in ``npm install && npm start``) even if no
+modifications are made.  This ensures that developers get a *practical* working
+example, not just a theoretical one.
+
+This also means, of course, that any committed code should be tested and
+subject to both CI and branch protection rules.
+
+Project Structure
+=================
+
+The source for this project is organized into nested submodules according to
+the `Feature-based Application Organization ADR`_.
+
+.. _Feature-based Application Organization ADR: https://github.com/openedx/frontend-template-application/blob/master/docs/decisions/0002-feature-based-application-organization.rst
+
+Build Process Notes
+===================
+
+**Production Build**
+
+The production build is created with ``npm run build``.
+
+Internationalization
+====================
+
+Please see refer to the `frontend-platform i18n howto`_ for documentation on
+internationalization.
+
+.. _frontend-platform i18n howto: https://github.com/openedx/frontend-platform/blob/master/docs/how_tos/i18n.rst
+
+Getting Help
+************
+
+If you're having trouble, we have discussion forums at
+https://discuss.openedx.org where you can connect with others in the community.
+
+Our real-time conversations are on Slack. You can request a `Slack
+invitation`_, then join our `community Slack workspace`_.  Because this is a
+frontend repository, the best place to discuss it would be in the `#wg-frontend
+channel`_.
+
+For anything non-trivial, the best path is to open an issue in this repository
+with as many details about the issue you are facing as you can provide.
+
+https://github.com/openedx/frontend-template-application/issues
+
+For more information about these options, see the `Getting Help`_ page.
+
+.. _Slack invitation: https://openedx.org/slack
+.. _community Slack workspace: https://openedx.slack.com/
+.. _#wg-frontend channel: https://openedx.slack.com/archives/C04BM6YC7A6
+.. _Getting Help: https://openedx.org/getting-help
+
+License
+*******
+
+The code in this repository is licensed under the AGPLv3 unless otherwise
+noted.
+
+Please see `LICENSE <LICENSE>`_ for details.
+
+Contributing
+************
+
+Contributions are very welcome.  Please read `How To Contribute`_ for details.
+
+.. _How To Contribute: https://openedx.org/r/how-to-contribute
+
+This project is currently accepting all types of contributions, bug fixes,
+security fixes, maintenance work, or new features.  However, please make sure
+to have a discussion about your new feature idea with the maintainers prior to
+beginning development to maximize the chances of your change being accepted.
+You can start a conversation by creating a new issue on this repo summarizing
+your idea.
+
+The Open edX Code of Conduct
+****************************
+
+All community members are expected to follow the `Open edX Code of Conduct`_.
+
+.. _Open edX Code of Conduct: https://openedx.org/code-of-conduct/
+
+People
+******
+
+The assigned maintainers for this component and other project details may be
+found in `Backstage`_. Backstage pulls this data from the ``catalog-info.yaml``
+file in this repo.
+
+.. _Backstage: https://open-edx-backstage.herokuapp.com/catalog/default/component/frontend-template-application
+
+Reporting Security Issues
+*************************
+
+Please do not report security issues in public, and email security@openedx.org instead.
+
+.. |license-badge| image:: https://img.shields.io/github/license/openedx/frontend-template-application.svg
+    :target: https://github.com/openedx/frontend-template-application/blob/main/LICENSE
+    :alt: License
+
+.. |status-badge| image:: https://img.shields.io/badge/Status-Maintained-brightgreen
+
+.. |ci-badge| image:: https://github.com/openedx/frontend-template-application/actions/workflows/ci.yml/badge.svg
+    :target: https://github.com/openedx/frontend-template-application/actions/workflows/ci.yml
+    :alt: Continuous Integration
+
+.. |codecov-badge| image:: https://codecov.io/github/openedx/frontend-template-application/coverage.svg?branch=main
+    :target: https://codecov.io/github/openedx/frontend-template-application?branch=main
+    :alt: Codecov

package/dist/HeaderWidget/index.js

@@ -0,0 +1,93 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _frontendPlatform = require("@edx/frontend-platform");
+var _react = require("react");
+require("./main.css");
+var _jsxRuntime = require("react/jsx-runtime");
+const HeaderWidget = () => {
+  const [headerData, setHeaderData] = (0, _react.useState)("");
+  const [isOpen, setIsOpen] = (0, _react.useState)(false);
+  const WIDTH = 1230;
+  const [isMobile, setIsMobile] = (0, _react.useState)(window.innerWidth < WIDTH);
+  const [isLoading, setIsLoading] = (0, _react.useState)(true);
+  const config = (0, _frontendPlatform.getConfig)();
+  (0, _react.useEffect)(() => {
+    const handleResize = () => {
+      setIsMobile(window.innerWidth < WIDTH);
+      if (window.innerWidth >= WIDTH) {
+        setIsOpen(false);
+      }
+    };
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+  (0, _react.useEffect)(() => {
+    const fetchData = async () => {
+      if (!config?.DISCOVERY_URL) {
+        console.error("No url found for discovery", config);
+        return;
+      }
+      try {
+        const response = await fetch(config.DISCOVERY_URL);
+        if (!response.ok) {
+          throw new Error(`HTTP error! status: ${response.status}`);
+        }
+        const jsonData = await response.json();
+
+        // Handle potential data structures (object)
+        if (typeof jsonData === "object") {
+          setHeaderData(jsonData.primary);
+        } else {
+          console.error("Data object is not json");
+        }
+      } catch (error) {
+        console.error(error);
+      } finally {
+        setIsLoading(false);
+      }
+    };
+    fetchData();
+  }, []);
+  const toggleMenu = () => {
+    setIsOpen(!isOpen);
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: `shadow-lg ${isMobile ? "header-frame" : ""}`,
+    children: [isMobile && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+      className: "menuOpner",
+      onClick: toggleMenu,
+      style: {
+        background: "none",
+        border: "none",
+        cursor: "pointer",
+        fontSize: "24px"
+      },
+      children: isOpen ? "✖" : "☰"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `header-holder ${isMobile ? "mobile-menu" : ""} ${isOpen ? "" : "mobile-hide"}`,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
+        href: "/",
+        className: "custom-logo-link",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+          width: "216",
+          height: "140",
+          src: config.LOGO_URL,
+          className: "custom-logo",
+          alt: "Venus",
+          decoding: "async"
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("header", {
+        className: "site-header",
+        dangerouslySetInnerHTML: {
+          __html: headerData
+        }
+      })]
+    })]
+  });
+};
+var _default = exports.default = HeaderWidget;
+//# sourceMappingURL=index.js.map

package/dist/HeaderWidget/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_frontendPlatform","require","_react","_jsxRuntime","HeaderWidget","headerData","setHeaderData","useState","isOpen","setIsOpen","WIDTH","isMobile","setIsMobile","window","innerWidth","isLoading","setIsLoading","config","getConfig","useEffect","handleResize","addEventListener","removeEventListener","fetchData","DISCOVERY_URL","console","error","response","fetch","ok","Error","status","jsonData","json","primary","toggleMenu","jsxs","className","children","jsx","onClick","style","background","border","cursor","fontSize","href","width","height","src","LOGO_URL","alt","decoding","dangerouslySetInnerHTML","__html","_default","exports","default"],"sources":["../../src/HeaderWidget/index.js"],"sourcesContent":["import { getConfig } from \"@edx/frontend-platform\";\nimport { useEffect, useState } from \"react\";\nimport \"./main.css\";\n\nconst HeaderWidget = () => {\n  const [headerData, setHeaderData] = useState(\"\");\n  const [isOpen, setIsOpen] = useState(false);\n  const WIDTH = 1230;\n  const [isMobile, setIsMobile] = useState(window.innerWidth < WIDTH);\n  const [isLoading, setIsLoading] = useState(true);\n  const config = getConfig();\n\n  useEffect(() => {\n    const handleResize = () => {\n      setIsMobile(window.innerWidth < WIDTH);\n      if (window.innerWidth >= WIDTH) {\n        setIsOpen(false);\n      }\n    };\n\n    window.addEventListener(\"resize\", handleResize);\n    return () => window.removeEventListener(\"resize\", handleResize);\n  }, []);\n\n  useEffect(() => {\n    const fetchData = async () => {\n      if (!config?.DISCOVERY_URL) {\n        console.error(\"No url found for discovery\", config);\n        return;\n      }\n      try {\n        const response = await fetch(config.DISCOVERY_URL);\n        if (!response.ok) {\n          throw new Error(`HTTP error! status: ${response.status}`);\n        }\n\n        const jsonData = await response.json();\n\n        // Handle potential data structures (object)\n        if (typeof jsonData === \"object\") {\n          setHeaderData(jsonData.primary);\n        } else {\n          console.error(\"Data object is not json\");\n        }\n      } catch (error) {\n        console.error(error);\n      } finally {\n        setIsLoading(false);\n      }\n    };\n\n    fetchData();\n  }, []);\n\n  const toggleMenu = () => {\n    setIsOpen(!isOpen);\n  };\n\n  return (\n    <div className={`shadow-lg ${isMobile ? \"header-frame\" : \"\"}`}>\n      {isMobile && (\n        <button\n          className=\"menuOpner\"\n          onClick={toggleMenu}\n          style={{\n            background: \"none\",\n            border: \"none\",\n            cursor: \"pointer\",\n            fontSize: \"24px\",\n          }}\n        >\n          {isOpen ? \"✖\" : \"☰\"}\n        </button>\n      )}\n      <div\n        className={`header-holder ${isMobile ? \"mobile-menu\" : \"\"} ${\n          isOpen ? \"\" : \"mobile-hide\"\n        }`}\n      >\n        <a href=\"/\" className=\"custom-logo-link\">\n          <img\n            width=\"216\"\n            height=\"140\"\n            src={config.LOGO_URL}\n            className=\"custom-logo\"\n            alt=\"Venus\"\n            decoding=\"async\"\n          />\n        </a>\n        <header\n          className=\"site-header\"\n          dangerouslySetInnerHTML={{ __html: headerData }}\n        />\n      </div>\n    </div>\n  );\n};\n\nexport default HeaderWidget;\n"],"mappings":"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","ignoreList":[]}

package/dist/HeaderWidget/main.css

@@ -0,0 +1,289 @@
+@charset "UTF-8";
+/* Header and logo */
+.header-holder {
+  padding: 15px 20px 14px;
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+}
+
+.site-header {
+  width: 100%;
+  flex: inherit !important;
+}
+
+.custom-logo-link img {
+  margin: auto;
+  max-width: 200px;
+  max-height: 70px;
+  height: auto;
+  width: auto;
+}
+
+/* Desktop Menu */
+#menu-primary-menu {
+  display: flex;
+  align-items: center;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+#menu-primary-menu > li {
+  position: relative;
+  padding: 10px;
+}
+#menu-primary-menu > li a {
+  color: #0d1321;
+  text-decoration: none;
+  font-weight: 600;
+  display: block;
+  border-bottom: 1px solid transparent;
+  transition: color 0.25s ease, border-color 0.25s ease;
+  position: relative;
+  display: block;
+  padding-bottom: 0px;
+  border: 0px;
+  text-decoration: none;
+}
+#menu-primary-menu > li a:before {
+  content: "";
+  background-color: #de2025;
+  width: auto;
+  height: 1px;
+  position: absolute;
+  bottom: -5px;
+  left: 0;
+  right: 0;
+  opacity: 0;
+}
+#menu-primary-menu > li:hover > a, #menu-primary-menu > li.menu-active > a {
+  color: #de2025;
+}
+@media (min-width: 1231px) {
+  #menu-primary-menu > li:hover > a:before, #menu-primary-menu > li.menu-active > a:before {
+    opacity: 1;
+  }
+}
+#menu-primary-menu > li.menu-item-has-children > a::after, #menu-primary-menu > li.menu-item-object-custom_link_filter > a::after, #menu-primary-menu > li.submenu-item-class > a::after {
+  content: "›";
+  font-size: 0.95em;
+  margin-left: 0.4em;
+  display: inline-block;
+  transform: rotate(90deg);
+  transition: transform 0.25s ease;
+}
+#menu-primary-menu > li:hover > a::after {
+  transform: rotate(90deg) translateX(2px);
+}
+#menu-primary-menu > li > .sub-menu {
+  display: none;
+  position: absolute;
+  top: 100%;
+  left: 0;
+  background: #ffffff;
+  border: 1px solid #d1d5db;
+  border-radius: 6px;
+  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
+  list-style: none;
+  min-width: 230px;
+  padding: 0.5rem 0;
+  z-index: 10;
+}
+#menu-primary-menu > li > .sub-menu > li {
+  position: relative;
+  list-style: none;
+}
+#menu-primary-menu > li > .sub-menu > li a {
+  display: block;
+  padding: 0.6rem 1rem;
+  color: #0d1321;
+  transition: background 0.25s ease, color 0.25s ease;
+}
+#menu-primary-menu > li > .sub-menu > li a:hover {
+  background: rgb(251.6614173228, 231.8385826772, 232.3602362205);
+  color: #de2025;
+}
+@media (max-width: 1230px) {
+  #menu-primary-menu > li > .sub-menu > li a:hover {
+    background: transparent;
+  }
+}
+#menu-primary-menu > li > .sub-menu > li.submenu-item-class > a::after {
+  content: "›";
+  float: right;
+  font-size: 0.95em;
+}
+#menu-primary-menu > li > .sub-menu > li .sub-menu {
+  display: none;
+  position: absolute;
+  top: -5px;
+  left: 94%;
+  margin-left: 0.5rem;
+  border: 1px solid #d1d5db;
+  border-radius: 6px;
+  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
+  background: #ffffff;
+  min-width: 200px;
+  padding: 0.5rem 0;
+  list-style: none;
+}
+#menu-primary-menu > li > .sub-menu > li:hover > .sub-menu {
+  display: block;
+}
+#menu-primary-menu > li:hover > .sub-menu {
+  display: block;
+}
+
+.mobile-menu .site-header {
+  background: white;
+  flex: inherit;
+  position: absolute;
+  top: 100px;
+  left: 0;
+  box-sizing: border-box;
+}
+.mobile-menu .site-header #menu-primary-menu {
+  flex-direction: column;
+  text-align: left;
+}
+.mobile-menu .site-header {
+  opacity: 1;
+  visibility: visible;
+  max-height: 4000px;
+  transition: all 0.3s ease;
+  max-height: 200px;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+.mobile-menu.mobile-hide .site-header {
+  opacity: 0;
+  visibility: hidden;
+  max-height: 0;
+}
+
+.menuOpner {
+  position: absolute;
+  top: 50%;
+  right: 20px;
+  transform: translateY(-50%);
+}
+
+.header-frame {
+  z-index: 9;
+  position: relative;
+}
+
+/* Desktop: Keep Sign In button on the right */
+@media (min-width: 1231px) {
+  #menu-primary-menu {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
+  #menu-primary-menu > li.menu-item-object-signin_openedx {
+    margin-left: auto;
+    order: 999;
+    padding-right: 10px !important;
+  }
+  #menu-primary-menu > li.menu-item-object-signin_openedx a {
+    color: #fff;
+    background: #de2025;
+    padding: 8px 16px;
+    border-radius: 6px;
+  }
+  #menu-primary-menu > li.menu-item-object-signin_openedx a:before {
+    display: none;
+  }
+}
+/* Mobile Menu */
+@media (max-width: 1230px) {
+  .custom-logo-link img {
+    max-width: 160px;
+    max-height: 50px;
+  }
+  .mobile-menu .site-header {
+    top: 70px;
+    padding: 0 30px;
+  }
+  #menu-primary-menu > li {
+    display: block;
+    width: 100%;
+    border-top: 1px solid #ccc;
+  }
+  #menu-primary-menu > li:first-child {
+    border-top: none;
+  }
+  #menu-primary-menu > li > .sub-menu {
+    position: static;
+    display: block;
+    padding: 0 0 0 10px;
+    border-radius: 0;
+    border: 0;
+    box-shadow: none;
+  }
+  #menu-primary-menu > li > .sub-menu li a {
+    font-size: 12px;
+  }
+  #menu-primary-menu > li > .sub-menu > li .sub-menu {
+    position: static;
+    display: block;
+    padding: 0 0 0 20px;
+    border-radius: 0;
+    border: 0;
+    box-shadow: none;
+  }
+  .main-navigation .menu-toggle {
+    display: flex;
+  }
+  .main-navigation #menu-primary-menu {
+    flex-direction: column;
+    width: 100%;
+    background: #ffffff;
+    position: absolute;
+    top: 100%;
+    left: 0;
+    padding: 1rem 0;
+    display: none;
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
+    border-top: 1px solid #d1d5db;
+  }
+  .main-navigation #menu-primary-menu.open {
+    display: flex;
+  }
+  .main-navigation #menu-primary-menu > li {
+    width: 100%;
+    padding: 0.75rem 1rem;
+    border-bottom: 1px solid #d1d5db;
+  }
+  .main-navigation #menu-primary-menu > li a {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+  .main-navigation #menu-primary-menu > li .sub-menu {
+    position: relative;
+    top: 0;
+    left: 0;
+    margin: 0;
+    border: none;
+    border-radius: 0;
+    box-shadow: none;
+    background: #ffffff;
+    padding-left: 1rem;
+    display: none;
+    list-style: none;
+  }
+  .main-navigation #menu-primary-menu > li .sub-menu li a {
+    padding: 0.5rem 1rem;
+    transition: background 0.25s ease, color 0.25s ease;
+  }
+  .main-navigation #menu-primary-menu > li .sub-menu li a:hover {
+    background: rgb(251.6614173228, 231.8385826772, 232.3602362205);
+    color: #de2025;
+  }
+  .main-navigation #menu-primary-menu > li:hover > .sub-menu {
+    display: block;
+  }
+}
+
+/*# sourceMappingURL=main.css.map */