Merge pull request #1240 from pateljannat/fix-onboarding-data

fix: onboarding data update

.github/helper/install_dependencies.sh

@@ -5,7 +5,7 @@ echo "Setting Up System Dependencies..."
 
 sudo apt update
 sudo apt remove mysql-server mysql-client
-sudo apt-get install libcups2-dev redis-server mariadb-client
+sudo apt install libcups2-dev redis-server mariadb-client-10.6
 
 install_wkhtmltopdf() {
   wget -q https://github.com/wkhtmltopdf/packaging/releases/download/0.12.6-1/wkhtmltox_0.12.6-1.focal_amd64.deb

.github/helper/update_pot_file.sh

@@ -1,40 +0,0 @@
-#!/bin/bash
-set -e
-cd ~ || exit
-
-echo "Setting Up Bench..."
-
-pip install frappe-bench
-bench -v init frappe-bench --skip-assets --skip-redis-config-generation --python "$(which python)" --frappe-branch "${BASE_BRANCH}"
-cd ./frappe-bench || exit
-
-echo "Get LMS..."
-bench get-app --skip-assets lms "${GITHUB_WORKSPACE}"
-
-echo "Generating POT file..."
-bench generate-pot-file --app lms
-
-cd ./apps/lms || exit
-
-echo "Configuring git user..."
-git config user.email "developers@erpnext.com"
-git config user.name "frappe-pr-bot"
-
-echo "Setting the correct git remote..."
-# Here, the git remote is a local file path by default. Let's change it to the upstream repo.
-git remote set-url upstream https://github.com/frappe/lms.git
-
-echo "Creating a new branch..."
-isodate=$(date -u +"%Y-%m-%d")
-branch_name="pot_${BASE_BRANCH}_${isodate}"
-git checkout -b "${branch_name}"
-
-echo "Commiting changes..."
-git add lms/locale/main.pot
-git commit -m "chore: update POT file"
-
-gh auth setup-git
-git push -u upstream "${branch_name}"
-
-echo "Creating a PR..."
-gh pr create --fill --base "${BASE_BRANCH}" --head "${branch_name}" -R frappe/lms

.github/workflows/build.yml

@@ -1,64 +0,0 @@
-name: Build Container Image
-on:
-  workflow_dispatch:
-  push:
-    branches:
-      - main
-    tags:
-      - "*"
-jobs:
-  build:
-    name: Build
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        arch: [amd64, arm64]
-
-    permissions:
-      packages: write
-
-    steps:
-      - name: Checkout Entire Repository
-        uses: actions/checkout@v4
-
-      - name: Set up QEMU
-        uses: docker/setup-qemu-action@v3
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
-        with:
-          platforms: linux/${{ matrix.arch }}
-      - name: Login to GitHub Container Registry
-        uses: docker/login-action@v2
-        with:
-          registry: ghcr.io
-          username: ${{ github.actor }}
-          password: ${{ secrets.GITHUB_TOKEN }}
-          
-      - name: Set Branch
-        run: |
-          export APPS_JSON='[{"url": "https://github.com/frappe/lms","branch": "main"}]'
-          echo "APPS_JSON_BASE64=$(echo $APPS_JSON | base64 -w 0)" >> $GITHUB_ENV
-          echo "FRAPPE_BRANCH=version-15" >> $GITHUB_ENV
-
-      - name: Set Image Tag
-        run: |
-          echo "IMAGE_TAG=stable" >> $GITHUB_ENV
-      - uses: actions/checkout@v4
-        with:
-          repository: frappe/frappe_docker
-          path: builds
-
-      - name: Build and push
-        uses: docker/build-push-action@v6
-        with:
-          push: true
-          context: builds
-          file: builds/images/layered/Containerfile
-          tags: >
-            ghcr.io/${{ github.repository }}:${{ github.ref_name }},
-            ghcr.io/${{ github.repository }}:${{ env.IMAGE_TAG }}
-          build-args: |
-            "FRAPPE_BRANCH=${{ env.FRAPPE_BRANCH }}"
-            "APPS_JSON_BASE64=${{ env.APPS_JSON_BASE64 }}"

.github/workflows/ci.yml

@@ -39,7 +39,7 @@ jobs:
         node-version: '18'
         check-latest: true
     - name: setup cache for bench
-      uses: actions/cache@v4
+      uses: actions/cache@v2
       with:
         path: ~/bench-cache
         key: ${{ runner.os }}

.github/workflows/generate-pot-file.yml

@@ -1,34 +0,0 @@
-name: Regenerate POT file (translatable strings)
-on:
-  schedule:
-    - cron: "00 16 * * 5"
-  workflow_dispatch:
-
-jobs:
-  regenerate-pot-file:
-    name: Release
-    runs-on: ubuntu-latest
-    strategy:
-      fail-fast: false
-      matrix:
-        branch: ["develop"]
-    permissions:
-      contents: write
-
-    steps:
-        - name: Checkout
-          uses: actions/checkout@v4
-          with:
-            ref: ${{ matrix.branch }}
-
-        - name: Setup Python
-          uses: actions/setup-python@v5
-          with:
-            python-version: "3.12"
-
-        - name: Run script to update POT file
-          run: |
-            bash ${GITHUB_WORKSPACE}/.github/helper/update_pot_file.sh
-          env:
-            GH_TOKEN: ${{ secrets.RELEASE_TOKEN }}
-            BASE_BRANCH: ${{ matrix.branch }}

.github/workflows/linters.yml

@@ -7,27 +7,8 @@ on:
     branches: [ main ]
 
 jobs:
-  commit-lint:
-    name: 'Semantic Commits'
-    runs-on: ubuntu-latest
-    if: github.event_name == 'pull_request'
-
-    steps:
-      - uses: actions/checkout@v4
-        with:
-          fetch-depth: 200
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-          check-latest: true
-
-      - name: Check commit titles
-        run: |
-          npm install @commitlint/cli @commitlint/config-conventional
-          npx commitlint --verbose --from ${{ github.event.pull_request.base.sha }} --to ${{ github.event.pull_request.head.sha }}
-
   linters:
-    name: Semgrep Rules
+    name: Semantic Commits
     runs-on: ubuntu-latest
     if: github.event_name == 'pull_request'
 
@@ -39,17 +20,8 @@ jobs:
         with:
           python-version: '3.10'
 
-      - name: Cache pip
-        uses: actions/cache@v4
-        with:
-          path: ~/.cache/pip
-          key: ${{ runner.os }}-pip-${{ hashFiles('**/*requirements.txt', '**/pyproject.toml', '**/setup.py') }}
-          restore-keys: |
-            ${{ runner.os }}-pip-
-            ${{ runner.os }}-
-
       - name: Install and Run Pre-commit
-        uses: pre-commit/action@v3.0.1
+        uses: pre-commit/action@v2.0.3
 
       - name: Download Semgrep rules
         run: git clone --depth 1 https://github.com/frappe/semgrep-rules.git frappe-semgrep-rules

.github/workflows/make_release_pr.yml

@@ -1,26 +0,0 @@
-name: Create weekly release
-on:
-  schedule:
-    - cron: '30 4 15 * *'
-  workflow_dispatch:
-
-jobs:
-  release:
-    name: Release
-    runs-on: ubuntu-latest
-    strategy:
-      fail-fast: false
-
-    steps:
-      - uses: octokit/request-action@v2.x
-        with:
-          route: POST /repos/{owner}/{repo}/pulls
-          owner: frappe
-          repo: lms
-          title: |-
-            "chore: merge 'develop' into 'main'"
-          body: "Automated weekly release"
-          base: main
-          head: develop
-        env:
-          GITHUB_TOKEN: ${{ secrets.RELEASE_TOKEN }}

.github/workflows/on_release.yml

@@ -1,32 +0,0 @@
-name: Generate Semantic Release
-on:
-  workflow_dispatch:
-  push:
-    branches:
-      - main
-jobs:
-  release:
-    name: Release
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout Entire Repository
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-          persist-credentials: false
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: 20
-      - name: Setup dependencies
-        run: |
-          npm install @semantic-release/git @semantic-release/exec --no-save
-      - name: Create Release
-        env:
-          GH_TOKEN: ${{ secrets.RELEASE_TOKEN }}
-          GITHUB_TOKEN: ${{ secrets.RELEASE_TOKEN }}
-          GIT_AUTHOR_NAME: "Frappe PR Bot"
-          GIT_AUTHOR_EMAIL: "developers@frappe.io"
-          GIT_COMMITTER_NAME: "Frappe PR Bot"
-          GIT_COMMITTER_EMAIL: "developers@frappe.io"
-        run: npx semantic-release

.github/workflows/release_notes.yml

@@ -1,39 +0,0 @@
-# This action:
-#
-# 1. Generates release notes using github API.
-# 2. Strips unnecessary info like chore/style etc from notes.
-# 3. Updates release info.
-
-name: 'Release Notes'
-
-on:
-  workflow_dispatch:
-    inputs:
-      tag_name:
-        description: 'Tag of release like v2.0.0'
-        required: true
-        type: string
-  release:
-    types: [released]
-
-permissions:
-  contents: read
-
-jobs:
-  regen-notes:
-    name: 'Regenerate release notes'
-    runs-on: ubuntu-latest
-
-    steps:
-    - name: Update notes
-      run: |
-        NEW_NOTES=$(gh api --method POST -H "Accept: application/vnd.github+json"  /repos/frappe/lms/releases/generate-notes  -f tag_name=$RELEASE_TAG \
-          | jq -r '.body' \
-          | sed -E '/^\* (chore|ci|test|docs|style)/d' \
-          | sed -E 's/by @mergify //'
-        )
-        RELEASE_ID=$(gh api -H "Accept: application/vnd.github+json" /repos/frappe/lms/releases/tags/$RELEASE_TAG | jq -r '.id')
-        gh api --method PATCH -H "Accept: application/vnd.github+json" /repos/frappe/lms/releases/$RELEASE_ID -f body="$NEW_NOTES"
-      env:
-        GH_TOKEN: ${{ secrets.RELEASE_TOKEN }}
-        RELEASE_TAG: ${{ github.event.inputs.tag_name || github.event.release.tag_name }}

.github/workflows/ui-tests.yml

@@ -24,7 +24,7 @@ jobs:
 
     services:
       mariadb:
-        image: mariadb:10.8
+        image: mariadb:10.6
         env:
           MARIADB_ROOT_PASSWORD: 123
         ports:
@@ -58,7 +58,7 @@ jobs:
           echo "127.0.0.1 lms.test" | sudo tee -a /etc/hosts
 
       - name: Cache pip
-        uses: actions/cache@v4
+        uses: actions/cache@v3
         with:
           path: ~/.cache/pip
           key: ${{ runner.os }}-pip-${{ hashFiles('**/*requirements.txt', '**/pyproject.toml', '**/setup.py') }}
@@ -70,7 +70,7 @@ jobs:
         id: yarn-cache-dir-path
         run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
 
-      - uses: actions/cache@v4
+      - uses: actions/cache@v3
         id: yarn-cache
         with:
           path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
@@ -79,7 +79,7 @@ jobs:
             ${{ runner.os }}-yarn-ui-
 
       - name: Cache cypress binary
-        uses: actions/cache@v4
+        uses: actions/cache@v3
         with:
           path: ~/.cache/Cypress
           key: ${{ runner.os }}-cypress
@@ -99,8 +99,6 @@ jobs:
           cd ~/frappe-bench/
           bench --site lms.test execute frappe.utils.install.complete_setup_wizard
           bench --site lms.test execute frappe.tests.ui_test_helpers.create_test_user
-          bench --site lms.test set-password frappe@example.com admin
-          bench --site lms.test execute lms.lms.utils.persona_captured
 
       - name: cypress pre-requisites
         run: |

.gitignore

@@ -10,6 +10,3 @@ __pycache__/
 *$py.class
 node_modules
 package-lock.json
-lms/public/frontend
-lms/www/lms.html
-frappe-ui

.gitmodules

@@ -1,3 +0,0 @@
-[submodule "frappe-ui"]
-	path = frappe-ui
-	url = https://github.com/frappe/frappe-ui

.pre-commit-config.yaml

@@ -32,7 +32,7 @@ repos:
     rev: v2.7.1
     hooks:
       - id: prettier
-        types_or: [javascript, vue]
+        types_or: [javascript]
         # Ignore any files that might contain jinja / bundles
         exclude: |
             (?x)^(

.releaserc

@@ -1,21 +0,0 @@
-{
-	"branches": ["develop"],
-	"plugins": [
-		"@semantic-release/commit-analyzer", {
-			"preset": "angular"
-		},
-		"@semantic-release/release-notes-generator",
-		[
-			"@semantic-release/exec", {
-				"prepareCmd": 'sed -ir "s/[0-9]*\.[0-9]*\.[0-9]*/${nextRelease.version}/" lms/__init__.py'
-			}
-		],
-		[
-			"@semantic-release/git", {
-				"assets": ["lms/__init__.py"],
-				"message": "chore(release): Bumped to Version ${nextRelease.version}"
-			}
-		],
-		"@semantic-release/github"
-	]
-}

README.md

@@ -1,174 +1,109 @@
-<div align="center" markdown="1">
+<p align="center">
+  <a href="https://www.frappelms.com/">
+    <img src="https://frappe.io/files/lms.png" alt="Frappe LMS" width="50px" height="50px">
+  </a>
+  <p align="center">Easy to use, open source, learning management system.</p>
+</p>
 
-<img src=".github/lms-logo.png" alt="Frappe Learning logo" width="80" height="80"/>
-<h1>Frappe Learning</h1>
 
-**Easy to use, open source, Learning Management System**
+&nbsp;
 
-![Tests](https://img.shields.io/endpoint?url=https://dashboard.cypress.io/badge/simple/vandxn/main&style=flat&logo=cypress)
+<p align="center">
+    <a href="https://www.producthunt.com/posts/frappe-lms?utm_source=badge-top-post-topic-badge&utm_medium=badge&utm_souce=badge-frappe&#0045;lms" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/top-post-topic-badge.svg?post_id=396079&theme=dark&period=weekly&topic_id=204" alt="Frappe&#0032;LMS - Easy&#0032;to&#0032;use&#0044;&#0032;100&#0037;&#0032;open&#0032;source&#0032;learning&#0032;management&#0032;system | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
+</p>
 
+
+<div align="center" style="max-height: 40px;">
+    <a href="https://frappecloud.com/lms/signup">
+        <img src=".github/try-on-f-cloud.svg" height="40">
+    </a>
 </div>
 
+&nbsp;
 
-<div align="center">
-	<img src=".github/hero.png?v=5" alt="Hero Image" width="72%" />
-</div>
-<br />
-<div align="center">
-	<a href="https://frappe.io/learning">Website</a>
-	-
-	<a href="https://docs.frappe.io/learning">Documentation</a>
-</div>
+<p align="center">
+	<a href="https://dashboard.cypress.io/projects/vandxn/runs">
+    <img alt="cypress" src="https://img.shields.io/endpoint?url=https://dashboard.cypress.io/badge/simple/vandxn/main&style=flat&logo=cypress">
+  </a>
+  <a href="https://github.com/frappe/lms/blob/main/LICENSE">
+    <img alt="license" src="https://img.shields.io/badge/license-AGPLv3-blue">
+  </a>
+</p>
 
-## Frappe Learning
-Frappe Learning is an easy-to-use learning system that helps you bring structure to your content.
-
-### Motivation
-In 2021, we were looking for a Learning Management System to launch [Mon.School](https://mon.school) for FOSS United. We checked out Moodle, but it didn’t feel right. The forms were unnecessarily lengthy and the UI was confusing. It shouldn't be this hard to create a course right? So I started making a learning system for Mon.School which soon became a product in itself. The aim is to have a simple platform that anyone can use to launch a course of their own and make knowledge sharing easier.
-
-### Key Features
-
-- **Structured Learning**: Design a course with a 3-level hierarchy, where your courses have chapters and you can group your lessons within these chapters. This ensures that the context of the lesson is set by the chapter.
-
-- **Live Classes**: Group learners into batches based on courses and duration. You can then create Zoom live class for these batches right from the app. Learners get to see the list of live classes they have to take as a part of this batch.
-
-- **Quizzes and Assignments**: Create quizzes where questions can have single-choice, multiple-choice options, or can be open ended. Instructors can also add assignments which learners can submit as PDF's or Documents.
-
-- **Getting Certified**: Once a learner has completed the course or batch, you can grant them a certificate. The app provides an inbuilt certificate template. You can use this or else create a template of your own and use that instead.
+<img width="1402" alt="Lesson" src="https://frappelms.com/files/banner.png">
 
 <details>
-<summary>View Screenshots</summary>
-
-
-![Batch](.github/batch.png)
-<div align="center">
-	<sub>
-		Create batches to group your learners
-	</sub>
-</div>
-<br>
-
-
-![Quiz](.github/quiz.png)
-<div align="center">
-	<sub>
-		Evaluate their knowledge by quizzes
-	</sub>
-</div>
-<br>
-
-
-![Cerficicate](.github/certificate.png)
-<div align="center">
-	<sub>
-		Autenticate their work with certification
-	</sub>
-</div>
+	<summary>Show more screenshots</summary>
+	<img width="1520" alt="ss1" src="https://user-images.githubusercontent.com/31363128/210056046-584bc8aa-d28c-4514-b031-73817012837d.png">
+	<img width="830" alt="ss2" src="https://user-images.githubusercontent.com/31363128/210056097-36849182-6db0-43a2-8c62-5333cd2aedf4.png">
+	<img width="941" alt="ss3" src="https://user-images.githubusercontent.com/31363128/210056134-01a7c429-1ef4-434e-9d43-128dda35d7e5.png">
 </details>
 
+Frappe LMS is an easy-to-use, open-source learning management system. You can use it to create and share online courses. The app has a clear UI that helps students focus only on what's important and assists in distraction-free learning.
 
-### Under the Hood
+You can create courses and lessons through simple forms. Lessons can be in the form of text, videos, quizzes or a combination of all these. You can keep your students engaged with quizzes to help revise and test the concepts learned. Course Instructors and Students can reach out to each other through the discussions section available for each lesson and get queries resolved.
 
-- [**Frappe Framework**](https://github.com/frappe/frappe): A full-stack web application framework.
+## Features
+- Create online courses. 📚
+- Add detailed descriptions and preview videos to the course. 🎬
+- Add videos, quizzes, and assignments to your lessons and make them interesting and interactive 📝
+- Discussions section below each lesson where instructors and students can interact with each other. 💬
+- Create batches to group your students based on courses and track their progress 🏛
+- Statistics dashboard that provides all important numbers at a glimpse. 📈
+- Job Board where users can post and look for jobs. 💼
+- People directory with each person's profile page 👨‍👩‍👧‍👦
+- Set cover image, profile photo, short bio, and other professional information. 🦹🏼‍♀️
+- Simple layout that optimizes readability 🤓
+- Delightful user experience in overall usage ✨
 
-- [**Frappe UI**](https://github.com/frappe/frappe-ui): A Vue-based UI library, to provide a modern user interface.
+## Tech Stack
 
-## Production Setup
+Frappe LMS is built on [Frappe Framework](https://frappeframework.com) which is a batteries-included python web framework.
+These are some of the tools it's built on:
+- [Python](https://www.python.org)
+- [Redis](https://redis.io/)
+- [MariaDB](https://mariadb.org/)
+- [Socket.io](https://socket.io/)
 
-### Managed Hosting
-
-You can try [Frappe Cloud](https://frappecloud.com), a simple, user-friendly and sophisticated [open-source](https://github.com/frappe/press) platform to host Frappe applications with peace of mind.
-
-It takes care of installation, setup, upgrades, monitoring, maintenance and support of your Frappe deployments. It is a fully featured developer platform with an ability to manage and control multiple Frappe deployments.
-
-<div>
-	<a href="https://frappecloud.com/lms/signup" target="_blank">
-		<picture>
-			<source media="(prefers-color-scheme: dark)" srcset="https://frappe.io/files/try-on-fc-white.png">
-			<img src="https://frappe.io/files/try-on-fc-black.png" alt="Try on Frappe Cloud" height="28" />
-		</picture>
-	</a>
-</div>
-
-### Self Hosting
-
-Follow these steps to set up Frappe Learning in production:
-
-**Step 1**: Download the easy install script
-
-```bash
-wget https://frappe.io/easy-install.py
-```
-
-**Step 2**: Run the deployment command
-
-```bash
-python3 ./easy-install.py deploy \
-    --project=learning_prod_setup \
-    --email=your_email.example.com \
-    --image=ghcr.io/frappe/lms \
-    --version=stable \
-    --app=lms \
-    --sitename subdomain.domain.tld
-```
-
-Replace the following parameters with your values:
-- `your_email.example.com`: Your email address
-- `subdomain.domain.tld`: Your domain name where Learning will be hosted
-
-The script will set up a production-ready instance of Frappe Learning with all the necessary configurations in about 5 minutes.
-
-## Development Setup
+## Local Setup
 
 ### Docker
+You need Docker, docker-compose, and git setup on your machine. Refer to [Docker documentation](https://docs.docker.com/). After that, run the following commands:
+```
+git clone https://github.com/frappe/lms
+cd apps/lms/docker
+docker-compose up
+```
 
-You need Docker, docker-compose and git setup on your machine. Refer [Docker documentation](https://docs.docker.com/). After that, follow below steps:
+Wait for some time until the setup script creates a site. After that, you can access `http://localhost:8000` in your browser and the app's login screen should show up.
 
-**Step 1**: Setup folder and download the required files
+### Frappe Bench
 
-    mkdir frappe-learning
-    cd frappe-learning
+Currently, this app depends on the `develop` branch of [frappe](https://github.com/frappe/frappe).
 
-    # Download the docker-compose file
-    wget -O docker-compose.yml https://raw.githubusercontent.com/frappe/lms/develop/docker/docker-compose.yml
+1. Setup frappe-bench by following [this guide](https://frappeframework.com/docs/v14/user/en/installation)
+1. In the frappe-bench directory, run `bench start` and keep it running. Open a new terminal session and cd into the `frappe-bench` directory.
+1. Run the following commands:
+    ```sh
+    bench new-site lms.test
+    bench get-app lms
+    bench --site lms.test install-app lms
+    bench --site lms.test add-to-hosts
 
-    # Download the setup script
-    wget -O init.sh https://raw.githubusercontent.com/frappe/lms/develop/docker/init.sh
+ 1. Now, you can access the site at `http://lms.test:8000`
 
-**Step 2**: Run the container and daemonize it
 
-    docker compose up -d
+## Deployment
+Frappe LMS is an app built on top of the Frappe Framework. So, you can follow any deployment guide for hosting a Frappe Framework-based site.
 
-**Step 3**: The site [http://lms.localhost:8000/lms](http://lms.localhost:8000/lms) should now be available. The default credentials are:
-- Username: Administrator
-- Password: admin
+### Managed Hosting
+Frappe LMS can be deployed in a few clicks on [Frappe Cloud](https://frappecloud.com/marketplace/apps/lms).
 
-### Local
+### Self-hosting
+If you want to self-host, you can follow official [Frappe Bench Installation](https://github.com/frappe/bench#installation) instructions.
 
-To setup the repository locally follow the steps mentioned below:
+## Bugs and Feature Requests
+If you find any bugs or have a feature idea for the app, feel free to report them here on [GitHub Issues](https://github.com/frappe/lms/issues). Make sure you share enough information (app screenshots, browser console screenshots, stack traces, etc) for project maintainers.
 
-1. Install bench and setup a `frappe-bench` directory by following the [Installation Steps](https://frappeframework.com/docs/user/en/installation)
-1. Start the server by running `bench start`
-1. In a separate terminal window, create a new site by running `bench new-site learning.test`
-1. Map your site to localhost with the command `bench --site learning.test add-to-hosts`
-1. Get the Learning app. Run `bench get-app https://github.com/frappe/lms`
-1. Run `bench --site learning.test install-app lms`.
-1. Now open the URL `http://learning.test:8000/lms` in your browser, you should see the app running
-
-## Learn and connect
-
-- [Telegram Public Group](https://t.me/frappelms)
-- [Discuss Forum](https://discuss.frappe.io/c/lms/70)
-- [Documentation](https://docs.frappe.io/learning)
-- [YouTube](https://www.youtube.com/channel/UCn3bV5kx77HsVwtnlCeEi_A)
-
-<br>
-<br>
-<div align="center" style="padding-top: 0.75rem;">
-	<a href="https://frappe.io" target="_blank">
-		<picture>
-			<source media="(prefers-color-scheme: dark)" srcset="https://frappe.io/files/Frappe-white.png">
-			<img src="https://frappe.io/files/Frappe-black.png" alt="Frappe Technologies" height="28"/>
-		</picture>
-	</a>
-</div>
+## License
+Distributed under [GNU AFFERO GENERAL PUBLIC LICENSE](license.txt)

commitlint.config.js

@@ -1,26 +0,0 @@
-module.exports = {
-	parserPreset: "conventional-changelog-conventionalcommits",
-	rules: {
-		"subject-empty": [2, "never"],
-		"type-case": [2, "always", "lower-case"],
-		"type-empty": [2, "never"],
-		"type-enum": [
-			2,
-			"always",
-			[
-				"build",
-				"chore",
-				"ci",
-				"docs",
-				"feat",
-				"fix",
-				"perf",
-				"refactor",
-				"revert",
-				"style",
-				"test",
-				"deprecate", // deprecation decision
-			],
-		],
-	},
-};

crowdin.yml

@@ -1,8 +0,0 @@
-files:
-  - source: /lms/locale/main.pot
-    translation: /lms/locale/%two_letters_code%.po
-pull_request_title: "chore: sync translations from crowdin"
-pull_request_labels:
-  - translation
-commit_message: "chore: %language% translations"
-append_commit_message: false

cypress.config.js

@@ -13,6 +13,6 @@ module.exports = defineConfig({
 		openMode: 0,
 	},
 	e2e: {
-		baseUrl: "http://pertest:8000",
+		baseUrl: "http://pyp:8000",
 	},
 });

cypress/e2e/course_creation.cy.js

@@ -1,162 +1,133 @@
 describe("Course Creation", () => {
 	it("creates a new course", () => {
 		cy.login();
-		cy.wait(1000);
-		cy.visit("/lms/courses");
-
+		cy.visit("/courses");
 		// Create a course
-		cy.get("button").contains("New").click();
+		cy.get("a.btn").contains("Create a Course").click();
+		cy.wait(1000);
+		cy.url().should("include", "/courses/new-course/edit");
+		cy.get("#title").type("Test Course");
+		cy.get("#intro").type("Test Course Short Introduction");
+		cy.get("#description").type("Test Course Description");
+		cy.get("#video-link").type("-LPmw2Znl2c");
+		cy.get("#tags-input").type("Test");
+		cy.get("#published").check();
 		cy.wait(1000);
-		cy.url().should("include", "/courses/new/edit");
-
-		cy.get("label").contains("Title").type("Test Course");
-		cy.get("label")
-			.contains("Short Introduction")
-			.type("Test Course Short Introduction to test the UI");
-		cy.get("div[contenteditable=true").invoke(
-			"text",
-			"Test Course Description. I need a very big description to test the UI. This is a very big description. It contains more than once sentence. Its meant to be this long as this is a UI test. Its unbearably long and I'm not sure why I'm typing this much. I'm just going to keep typing until I feel like its long enough. I think its long enough now. I'm going to stop typing now."
-		);
-
-		cy.fixture("profile.png", "base64").then((fileContent) => {
-			cy.get("div")
-				.contains("Course Image")
-				.siblings("div")
-				.children('input[type="file"]')
-				.attachFile({
-					fileContent,
-					fileName: "profile.png",
-					mimeType: "image/png",
-					encoding: "base64",
-				});
-		});
-
-		cy.get("label")
-			.contains("Preview Video")
-			.type("https://www.youtube.com/embed/-LPmw2Znl2c");
-		cy.get("[id=tags]").type("Learning{enter}Frappe{enter}ERPNext{enter}");
-		cy.get("label")
-			.contains("Category")
-			.parent()
-			.within(() => {
-				cy.get("button").click();
-			});
-		cy.get("[id^=headlessui-combobox-option-")
-			.should("be.visible")
-			.first()
-			.click();
-
-		/* Instructor */
-		cy.get("label")
-			.contains("Instructors")
-			.parent()
-			.within(() => {
-				cy.get("input").click().type("frappe");
-				cy.get("input")
-					.invoke("attr", "aria-controls")
-					.as("instructor_list_id");
-			});
-		cy.get("@instructor_list_id").then((instructor_list_id) => {
-			cy.get(`[id^=${instructor_list_id}`)
-				.should("be.visible")
-				.within(() => {
-					cy.get("[id^=headlessui-combobox-option-").first().click();
-				});
-		});
-
-		cy.get("label").contains("Published").click();
-		cy.get("label").contains("Published On").type("2021-01-01");
 		cy.button("Save").click();
 
 		// Add Chapter
 		cy.wait(1000);
-		cy.button("Add Chapter").click();
+		cy.link("Course Outline").click();
 
 		cy.wait(1000);
-		cy.get("[id^=headlessui-dialog-panel-")
-			.should("be.visible")
-			.within(() => {
-				cy.get("label").contains("Title").type("Test Chapter");
-				cy.button("Create").click();
-			});
+		cy.get(".edit-header .btn-add-chapter").click();
+		cy.wait(500);
+		cy.get("#chapter-title").type("Test Chapter");
+		cy.get("#chapter-description").type("Test Chapter Description");
+		cy.button("Save").click();
 
 		// Add Lesson
 		cy.wait(1000);
-		cy.button("Add Lesson").click();
-		cy.wait(1000);
-		cy.url().should("include", "/learn/1-1/edit");
+		cy.link("Add Lesson").click();
 		cy.wait(1000);
+		cy.get("#lesson-title").type("Test Lesson");
 
-		cy.get("label").contains("Title").type("Test Lesson");
-		cy.get("#content .ce-block").type(
-			"{enter}This is an extremely big paragraph that is meant to test the UI. This is a very long paragraph. It contains more than once sentence. Its meant to be this long as this is a UI test. Its unbearably long and I'm not sure why I'm typing this much. I'm just going to keep typing until I feel like its long enough. I think its long enough now. I'm going to stop typing now."
+		// Content
+		cy.get(".collapse-section.collapsed:first").click();
+		cy.get("#lesson-content .ce-block")
+			.click()
+			.type(
+				"This is an extremely big paragraph that is meant to test the UI. This is a very long paragraph. It contains more than once sentence. Its meant to be this long as this is a UI test. Its unbearably long and I'm not sure why I'm typing this much. I'm just going to keep typing until I feel like its long enough. I think its long enough now. I'm going to stop typing now. {enter}"
 			);
+		cy.get("#lesson-content .ce-toolbar__plus").click();
+		cy.get('#lesson-content [data-item-name="youtube"]').click();
+		cy.get('input[data-fieldname="youtube"]').type("GoDtyItReto");
+		cy.button("Insert").click();
+		cy.wait(1000);
 		cy.button("Save").click();
 
 		// View Course
 		cy.wait(1000);
-		cy.visit("/lms");
-		cy.wait(500);
-		cy.url().should("include", "/lms/courses");
-		cy.get(".grid a:first").within(() => {
-			cy.get("div").contains("Test Course");
-			cy.get("div").contains(
-				"Test Course Short Introduction to test the UI"
-			);
-			cy.get(".course-image")
-				.invoke("css", "background-image")
-				.should("include", "/files/profile");
-		});
-		cy.get(".grid a:first").click();
-		cy.url().should("include", "/lms/courses/test-course");
-		cy.get("div").contains("Test Course");
-		cy.get("div").contains("Test Course Short Introduction to test the UI");
-		cy.get("div").contains("Learning");
-		cy.get("div").contains("Frappe");
-		cy.get("div").contains("ERPNext");
-		cy.get("iframe").should(
+		cy.visit("/courses");
+		cy.get(".course-card-title:first").contains("Test Course");
+		cy.get(".course-card:first").click();
+		cy.url().should("include", "/courses/test-course");
+		cy.get("#title").contains("Test Course");
+		cy.get(".preview-video").should(
 			"have.attr",
 			"src",
 			"https://www.youtube.com/embed/-LPmw2Znl2c"
 		);
+		cy.get("#intro").contains("Test Course Short Introduction");
 
 		// View Chapter
-		cy.get("div").contains("Test Chapter");
-		cy.get("[id^=headlessui-disclosure-panel-").within(() => {
-			cy.get("div").contains("Test Lesson").click();
-		});
-		cy.wait(3000);
+		cy.get(".chapter-title-main:first").contains("Test Chapter");
+		cy.get(".chapter-description:first").contains(
+			"Test Chapter Description"
+		);
+		cy.get(".lesson-info:first").contains("Test Lesson");
+		cy.get(".lesson-info:first").click();
 
 		// View Lesson
-		cy.url().should("include", "/learn/1-1");
-		cy.get("div").contains("Test Lesson");
-
-		cy.get("div").contains(
+		cy.wait(1000);
+		cy.url().should("include", "learn/1.1");
+		cy.get("#title").contains("Test Lesson");
+		cy.get(".lesson-video iframe").should(
+			"have.attr",
+			"src",
+			"https://www.youtube.com/embed/GoDtyItReto"
+		);
+		cy.get(".lesson-content-card").contains(
 			"This is an extremely big paragraph that is meant to test the UI. This is a very long paragraph. It contains more than once sentence. Its meant to be this long as this is a UI test. Its unbearably long and I'm not sure why I'm typing this much. I'm just going to keep typing until I feel like its long enough. I think its long enough now. I'm going to stop typing now."
 		);
 
 		// Add Discussion
-		cy.button("New Question").click();
+		cy.get(".reply").click();
 		cy.wait(500);
-		cy.get("[id^=headlessui-dialog-panel-").within(() => {
-			cy.get("label").contains("Title").type("Test Discussion");
-			cy.get("div[contenteditable=true]").invoke(
-				"text",
-				"This is a test discussion. This will check if the UI is working properly."
-			);
-			cy.button("Post").click();
-		});
+		cy.get(".discussion-modal").should("be.visible");
 
-		// View Discussion
-		cy.wait(500);
-		cy.get("div").contains("Test Discussion").click();
-		cy.get("div[contenteditable=true").invoke(
-			"text",
-			"This is a test comment. This will check if the UI is working properly."
+		// Enter title
+		cy.get(".modal .topic-title")
+			.type("Discussion from tests")
+			.should("have.value", "Discussion from tests");
+
+		// Enter comment
+		cy.get(".modal .discussions-comment").type(
+			"This is a discussion from the cypress ui tests."
 		);
 
-		cy.get("div").contains(
-			"This is a test comment. This will check if the UI is working properly."
+		// Submit
+		cy.get(".modal .submit-discussion").click();
+		cy.wait(2000);
+
+		// Check if discussion is added to page and content is visible
+		cy.get(".sidebar-parent:first .discussion-topic-title").should(
+			"have.text",
+			"Discussion from tests"
+		);
+		cy.get(".sidebar-parent:first .discussion-topic-title").click();
+		cy.get(".discussion-on-page:visible").should("have.class", "show");
+		cy.get(
+			".discussion-on-page:visible .reply-card .reply-text .ql-editor p"
+		).should(
+			"have.text",
+			"This is a discussion from the cypress ui tests."
+		);
+
+		cy.get(".discussion-form:visible .discussions-comment").type(
+			"This is a discussion from the cypress ui tests. \n\nThis comment was entered through the commentbox on the page."
+		);
+
+		cy.get(".discussion-form:visible .submit-discussion").click();
+		cy.wait(3000);
+		cy.get(".discussion-on-page:visible").should("have.class", "show");
+		cy.get(".discussion-on-page:visible")
+			.children(".reply-card")
+			.eq(1)
+			.find(".reply-text")
+			.should(
+				"have.text",
+				"This is a discussion from the cypress ui tests. This comment was entered through the commentbox on the page.\n"
 			);
 	});
 });

cypress/support/commands.js

@@ -24,8 +24,6 @@
 // -- This will overwrite an existing command --
 // Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
 
-import "cypress-file-upload";
-
 Cypress.Commands.add("login", (email, password) => {
 	if (!email) {
 		email = Cypress.config("testUser") || "Administrator";
@@ -37,9 +35,6 @@ Cypress.Commands.add("login", (email, password) => {
 		url: "/api/method/login",
 		method: "POST",
 		body: { usr: email, pwd: password },
-		timeout: 60000,
-		retryOnStatusCodeFailure: true,
-		retryOnNetworkFailure: true,
 	});
 });
 
@@ -58,13 +53,3 @@ Cypress.Commands.add("iconButton", (text) => {
 Cypress.Commands.add("dialog", (selector) => {
 	return cy.get(`[role=dialog] ${selector}`);
 });
-
-Cypress.Commands.add("paste", { prevSubject: true }, (subject, text) => {
-	cy.wrap(subject).then(($element) => {
-		const element = $element[0];
-		element.focus();
-		element.textContent = text;
-		const event = new Event("paste", { bubbles: true });
-		element.dispatchEvent(event);
-	});
-});

docker/docker-compose.yml

@@ -2,7 +2,7 @@ version: "3.7"
 name: lms
 services:
   mariadb:
-    image: mariadb:10.8
+    image: mariadb:10.6
     command:
       - --character-set-server=utf8mb4
       - --collation-server=utf8mb4_unicode_ci

docker/init.sh

@@ -35,6 +35,7 @@ bench new-site lms.localhost \
 bench --site lms.localhost install-app lms
 bench --site lms.localhost set-config developer_mode 1
 bench --site lms.localhost clear-cache
+bench --site lms.localhost set-config mute_emails 1
 bench use lms.localhost
 
 bench start

frontend/.gitignore

@@ -1,5 +0,0 @@
-node_modules
-.DS_Store
-dist
-dist-ssr
-*.local

frontend/.prettierrc.json

@@ -1,4 +0,0 @@
-{
-  "semi": false,
-  "singleQuote": true
-}

frontend/README.md

@@ -1,42 +0,0 @@
-# Frappe UI Starter
-
-This template should help get you started developing custom frontend for Frappe
-apps with Vue 3 and the Frappe UI package.
-
-This boilerplate sets up Vue 3, Vue Router, TailwindCSS, and Frappe UI out of
-the box.
-
-## Usage
-
-This template is meant to be cloned inside an existing Frappe App. Assuming your
-apps name is `todo`. Clone this template in the root folder of your app using `degit`.
-
-```
-cd apps/todo
-npx degit netchampfaris/frappe-ui-starter frontend
-cd frontend
-yarn
-yarn dev
-```
-
-In a development environment, you need to put the below key-value pair in your `site_config.json` file:
-
-```
-"ignore_csrf": 1
-```
-
-This will prevent `CSRFToken` errors while using the vite dev server. In production environment, the `csrf_token` is attached to the `window` object in `index.html` for you.
-
-The Vite dev server will start on the port `8080`. This can be changed from `vite.config.js`.
-The development server is configured to proxy your frappe app (usually running on port `8000`). If you have a site named `todo.test`, open `http://todo.test:8080` in your browser. If you see a button named "Click to send 'ping' request", congratulations!
-
-If you notice the browser URL is `/frontend`, this is the base URL where your frontend app will run in production.
-To change this, open `src/router.js` and change the base URL passed to `createWebHistory`.
-
-## Resources
-
-- [Vue 3](https://v3.vuejs.org/guide/introduction.html)
-- [Vue Router](https://next.router.vuejs.org/guide/)
-- [Frappe UI](https://github.com/frappe/frappe-ui)
-- [TailwindCSS](https://tailwindcss.com/docs/utility-first)
-- [Vite](https://vitejs.dev/guide/)

frontend/components.d.ts

@@ -1,97 +0,0 @@
-/* eslint-disable */
-// @ts-nocheck
-// Generated by unplugin-vue-components
-// Read more: https://github.com/vuejs/core/pull/3399
-// biome-ignore lint: disable
-export {}
-
-/* prettier-ignore */
-declare module 'vue' {
-  export interface GlobalComponents {
-    Annoucements: typeof import('./src/components/Annoucements.vue')['default']
-    AnnouncementModal: typeof import('./src/components/Modals/AnnouncementModal.vue')['default']
-    Apps: typeof import('./src/components/Apps.vue')['default']
-    AppSidebar: typeof import('./src/components/AppSidebar.vue')['default']
-    AssessmentModal: typeof import('./src/components/Modals/AssessmentModal.vue')['default']
-    AssessmentPlugin: typeof import('./src/components/AssessmentPlugin.vue')['default']
-    Assessments: typeof import('./src/components/Assessments.vue')['default']
-    Assignment: typeof import('./src/components/Assignment.vue')['default']
-    AssignmentForm: typeof import('./src/components/Modals/AssignmentForm.vue')['default']
-    AudioBlock: typeof import('./src/components/AudioBlock.vue')['default']
-    Autocomplete: typeof import('./src/components/Controls/Autocomplete.vue')['default']
-    BatchCard: typeof import('./src/components/BatchCard.vue')['default']
-    BatchCourseModal: typeof import('./src/components/Modals/BatchCourseModal.vue')['default']
-    BatchCourses: typeof import('./src/components/BatchCourses.vue')['default']
-    BatchDashboard: typeof import('./src/components/BatchDashboard.vue')['default']
-    BatchFeedback: typeof import('./src/components/BatchFeedback.vue')['default']
-    BatchOverlay: typeof import('./src/components/BatchOverlay.vue')['default']
-    BatchStudentProgress: typeof import('./src/components/Modals/BatchStudentProgress.vue')['default']
-    BatchStudents: typeof import('./src/components/BatchStudents.vue')['default']
-    BrandSettings: typeof import('./src/components/BrandSettings.vue')['default']
-    BulkCertificates: typeof import('./src/components/Modals/BulkCertificates.vue')['default']
-    Categories: typeof import('./src/components/Categories.vue')['default']
-    CertificationLinks: typeof import('./src/components/CertificationLinks.vue')['default']
-    ChapterModal: typeof import('./src/components/Modals/ChapterModal.vue')['default']
-    CodeEditor: typeof import('./src/components/Controls/CodeEditor.vue')['default']
-    CollapseSidebar: typeof import('./src/components/Icons/CollapseSidebar.vue')['default']
-    CourseCard: typeof import('./src/components/CourseCard.vue')['default']
-    CourseCardOverlay: typeof import('./src/components/CourseCardOverlay.vue')['default']
-    CourseInstructors: typeof import('./src/components/CourseInstructors.vue')['default']
-    CourseOutline: typeof import('./src/components/CourseOutline.vue')['default']
-    CourseReviews: typeof import('./src/components/CourseReviews.vue')['default']
-    CreateOutline: typeof import('./src/components/CreateOutline.vue')['default']
-    DateRange: typeof import('./src/components/Common/DateRange.vue')['default']
-    DesktopLayout: typeof import('./src/components/DesktopLayout.vue')['default']
-    DiscussionModal: typeof import('./src/components/Modals/DiscussionModal.vue')['default']
-    DiscussionReplies: typeof import('./src/components/DiscussionReplies.vue')['default']
-    Discussions: typeof import('./src/components/Discussions.vue')['default']
-    EditCoverImage: typeof import('./src/components/Modals/EditCoverImage.vue')['default']
-    EditProfile: typeof import('./src/components/Modals/EditProfile.vue')['default']
-    EvaluationModal: typeof import('./src/components/Modals/EvaluationModal.vue')['default']
-    Evaluators: typeof import('./src/components/Evaluators.vue')['default']
-    Event: typeof import('./src/components/Modals/Event.vue')['default']
-    ExplanationVideos: typeof import('./src/components/Modals/ExplanationVideos.vue')['default']
-    FrappeCloudIcon: typeof import('./src/components/Icons/FrappeCloudIcon.vue')['default']
-    IconPicker: typeof import('./src/components/Controls/IconPicker.vue')['default']
-    IndicatorIcon: typeof import('./src/components/Icons/IndicatorIcon.vue')['default']
-    InviteIcon: typeof import('./src/components/Icons/InviteIcon.vue')['default']
-    JobApplicationModal: typeof import('./src/components/Modals/JobApplicationModal.vue')['default']
-    JobCard: typeof import('./src/components/JobCard.vue')['default']
-    LessonContent: typeof import('./src/components/LessonContent.vue')['default']
-    LessonHelp: typeof import('./src/components/LessonHelp.vue')['default']
-    Link: typeof import('./src/components/Controls/Link.vue')['default']
-    LiveClass: typeof import('./src/components/LiveClass.vue')['default']
-    LiveClassModal: typeof import('./src/components/Modals/LiveClassModal.vue')['default']
-    LMSLogo: typeof import('./src/components/Icons/LMSLogo.vue')['default']
-    Members: typeof import('./src/components/Members.vue')['default']
-    MobileLayout: typeof import('./src/components/MobileLayout.vue')['default']
-    MultiSelect: typeof import('./src/components/Controls/MultiSelect.vue')['default']
-    NoPermission: typeof import('./src/components/NoPermission.vue')['default']
-    NoSidebarLayout: typeof import('./src/components/NoSidebarLayout.vue')['default']
-    NotPermitted: typeof import('./src/components/NotPermitted.vue')['default']
-    PageModal: typeof import('./src/components/Modals/PageModal.vue')['default']
-    PaymentSettings: typeof import('./src/components/PaymentSettings.vue')['default']
-    Play: typeof import('./src/components/Icons/Play.vue')['default']
-    ProgressBar: typeof import('./src/components/ProgressBar.vue')['default']
-    Question: typeof import('./src/components/Modals/Question.vue')['default']
-    Quiz: typeof import('./src/components/Quiz.vue')['default']
-    QuizBlock: typeof import('./src/components/QuizBlock.vue')['default']
-    Rating: typeof import('./src/components/Controls/Rating.vue')['default']
-    ReviewModal: typeof import('./src/components/Modals/ReviewModal.vue')['default']
-    RouterLink: typeof import('vue-router')['RouterLink']
-    RouterView: typeof import('vue-router')['RouterView']
-    SettingDetails: typeof import('./src/components/SettingDetails.vue')['default']
-    SettingFields: typeof import('./src/components/SettingFields.vue')['default']
-    Settings: typeof import('./src/components/Modals/Settings.vue')['default']
-    SidebarLink: typeof import('./src/components/SidebarLink.vue')['default']
-    StudentHeatmap: typeof import('./src/components/StudentHeatmap.vue')['default']
-    StudentModal: typeof import('./src/components/Modals/StudentModal.vue')['default']
-    Tags: typeof import('./src/components/Tags.vue')['default']
-    UnsplashImageBrowser: typeof import('./src/components/UnsplashImageBrowser.vue')['default']
-    UpcomingEvaluations: typeof import('./src/components/UpcomingEvaluations.vue')['default']
-    UploadPlugin: typeof import('./src/components/UploadPlugin.vue')['default']
-    UserAvatar: typeof import('./src/components/UserAvatar.vue')['default']
-    UserDropdown: typeof import('./src/components/UserDropdown.vue')['default']
-    VideoBlock: typeof import('./src/components/VideoBlock.vue')['default']
-  }
-}

frontend/index.html

@@ -1,34 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<meta charset="UTF-8" />
-		<link rel="icon" href="{{ favicon }}" />
-		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-		<title>{{ title }}</title>
-		<meta name="title" content="{{ meta.title }}" />
-		<meta name="image" content="{{ meta.image }}" />
-		<meta name="description" content="{{ meta.description }}" />
-		<meta name="keywords" content="{{ meta.keywords }}" />
-		<meta property="og:title" content="{{ meta.title }}" />
-		<meta property="og:image" content="{{ meta.image }}" />
-		<meta property="og:description" content="{{ meta.description }}" />
-		<meta name="twitter:title" content="{{ meta.title }}" />
-		<meta name="twitter:image" content="{{ meta.image }}" />
-		<meta name="twitter:description" content="{{ meta.description }}" />
-	</head>
-	<body>
-		<div id="app">
-			<div id="seo-content">
-				<h1>{{ meta.title }}</h1>
-				<p>
-					{{ meta.description }}
-				</p>
-				<a href="{{ meta.link }}">Know More</a>
-			</div>
-		</div>
-		<script>
-			document.getElementById('seo-content').style.display = 'none';
-		</script>
-		<script type="module" src="/src/main.js"></script>
-	</body>
-</html>

frontend/package.json

@@ -1,51 +0,0 @@
-{
-  "name": "frappe-ui-frontend",
-  "private": true,
-  "version": "0.0.0",
-  "scripts": {
-    "dev": "vite",
-    "serve": "vite preview",
-    "build": "vite build --base=/assets/lms/frontend/ && yarn copy-html-entry",
-    "copy-html-entry": "cp ../lms/public/frontend/index.html ../lms/www/lms.html"
-  },
-  "dependencies": {
-    "@editorjs/checklist": "^1.6.0",
-    "@editorjs/code": "^2.9.0",
-    "@editorjs/editorjs": "^2.29.0",
-    "@editorjs/embed": "^2.7.0",
-    "@editorjs/header": "^2.8.1",
-    "@editorjs/inline-code": "^1.5.0",
-    "@editorjs/nested-list": "^1.4.2",
-    "@editorjs/paragraph": "^2.11.3",
-    "@editorjs/simple-image": "^1.6.0",
-    "@editorjs/table": "^2.4.2",
-    "@vueuse/router": "^12.7.0",
-    "ace-builds": "^1.36.2",
-    "apexcharts": "^4.3.0",
-    "chart.js": "^4.4.1",
-    "codemirror-editor-vue3": "^2.8.0",
-    "dayjs": "^1.11.6",
-    "feather-icons": "^4.28.0",
-    "frappe-ui": "^0.1.134",
-    "highlight.js": "^11.11.1",
-    "lucide-vue-next": "^0.383.0",
-    "markdown-it": "^14.0.0",
-    "pinia": "^2.0.33",
-    "plyr": "^3.7.8",
-    "socket.io-client": "^4.7.2",
-    "tailwindcss": "3.4.15",
-    "typescript": "^5.7.2",
-    "vue": "^3.4.23",
-    "vue-chartjs": "^5.3.0",
-    "vue-draggable-next": "^2.2.1",
-    "vue-router": "^4.0.12",
-    "vue3-apexcharts": "^1.8.0",
-    "vuedraggable": "4.1.0"
-  },
-  "devDependencies": {
-    "@vitejs/plugin-vue": "^5.0.3",
-    "autoprefixer": "^10.4.2",
-    "postcss": "^8.4.5",
-    "vite": "^5.0.11"
-  }
-}

frontend/postcss.config.js

@@ -1,6 +0,0 @@
-module.exports = {
-	plugins: {
-		tailwindcss: {},
-		autoprefixer: {},
-	},
-}

frontend/public/learning.svg

@@ -1,4 +0,0 @@
-<svg width="80" height="79" viewBox="0 0 80 79" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M57.1285 0.580383H22.8514C10.2309 0.580383 0 10.5649 0 22.8815V56.3332C0 68.6497 10.2309 78.6343 22.8514 78.6343H57.1285C69.749 78.6343 79.9799 68.6497 79.9799 56.3332V22.8815C79.9799 10.5649 69.749 0.580383 57.1285 0.580383Z" fill="#0E7159"/>
-<path d="M62.8434 23.6906L60.7869 23.1052C53.6744 21.0702 45.9048 22.4641 39.992 26.8128C35.8502 23.7742 30.7943 22.1854 25.7099 22.2133H17.1406V27.8163H25.7099C29.6232 27.8163 33.508 29.015 36.6787 31.3845L39.992 33.8377L43.3056 31.3845C47.2475 28.4575 52.3032 27.2588 57.1306 28.0393V50.647C51.1035 49.9223 44.9051 51.4834 39.992 55.0795C35.8502 52.0688 30.8515 50.4798 25.7671 50.4798C24.7959 50.4798 23.8247 50.5355 22.8535 50.647V35.0642H17.1406V57.0588H62.8434V23.7185V23.6906Z" fill="white"/>
-</svg>

frontend/src/App.vue

@@ -1,54 +0,0 @@
-<template>
-	<Layout>
-		<router-view />
-	</Layout>
-	<Dialogs />
-	<Toasts />
-</template>
-<script setup>
-import { Toasts } from 'frappe-ui'
-import { Dialogs } from '@/utils/dialogs'
-import { computed, onMounted, onUnmounted, ref } from 'vue'
-import { useScreenSize } from './utils/composables'
-import DesktopLayout from './components/DesktopLayout.vue'
-import MobileLayout from './components/MobileLayout.vue'
-import NoSidebarLayout from './components/NoSidebarLayout.vue'
-import { stopSession } from '@/telemetry'
-import { init as initTelemetry } from '@/telemetry'
-import { usersStore } from '@/stores/user'
-import { useRouter } from 'vue-router'
-
-const screenSize = useScreenSize()
-let { userResource } = usersStore()
-const router = useRouter()
-const noSidebar = ref(false)
-
-router.beforeEach((to, from, next) => {
-	if (to.query.fromLesson || to.path === '/persona') {
-		noSidebar.value = true
-	} else {
-		noSidebar.value = false
-	}
-	next()
-})
-
-const Layout = computed(() => {
-	if (noSidebar.value) {
-		return NoSidebarLayout
-	}
-	if (screenSize.width < 640) {
-		return MobileLayout
-	} else {
-		return DesktopLayout
-	}
-})
-
-onMounted(async () => {
-	if (userResource.data) await initTelemetry()
-})
-
-onUnmounted(() => {
-	noSidebar.value = false
-	stopSession()
-})
-</script>

frontend/src/assets/Inter/inter.css

@@ -1,152 +0,0 @@
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 100;
-  font-display: swap;
-  src: url("Inter-Thin.woff2?v=3.12") format("woff2"),
-       url("Inter-Thin.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 100;
-  font-display: swap;
-  src: url("Inter-ThinItalic.woff2?v=3.12") format("woff2"),
-       url("Inter-ThinItalic.woff?v=3.12") format("woff");
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url("Inter-ExtraLight.woff2?v=3.12") format("woff2"),
-       url("Inter-ExtraLight.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 200;
-  font-display: swap;
-  src: url("Inter-ExtraLightItalic.woff2?v=3.12") format("woff2"),
-       url("Inter-ExtraLightItalic.woff?v=3.12") format("woff");
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 300;
-  font-display: swap;
-  src: url("Inter-Light.woff2?v=3.12") format("woff2"),
-       url("Inter-Light.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 300;
-  font-display: swap;
-  src: url("Inter-LightItalic.woff2?v=3.12") format("woff2"),
-       url("Inter-LightItalic.woff?v=3.12") format("woff");
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 400;
-  font-display: swap;
-  src: url("Inter-Regular.woff2?v=3.12") format("woff2"),
-       url("Inter-Regular.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 400;
-  font-display: swap;
-  src: url("Inter-Italic.woff2?v=3.12") format("woff2"),
-       url("Inter-Italic.woff?v=3.12") format("woff");
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 500;
-  font-display: swap;
-  src: url("Inter-Medium.woff2?v=3.12") format("woff2"),
-       url("Inter-Medium.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 500;
-  font-display: swap;
-  src: url("Inter-MediumItalic.woff2?v=3.12") format("woff2"),
-       url("Inter-MediumItalic.woff?v=3.12") format("woff");
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 600;
-  font-display: swap;
-  src: url("Inter-SemiBold.woff2?v=3.12") format("woff2"),
-       url("Inter-SemiBold.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 600;
-  font-display: swap;
-  src: url("Inter-SemiBoldItalic.woff2?v=3.12") format("woff2"),
-       url("Inter-SemiBoldItalic.woff?v=3.12") format("woff");
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 700;
-  font-display: swap;
-  src: url("Inter-Bold.woff2?v=3.12") format("woff2"),
-       url("Inter-Bold.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 700;
-  font-display: swap;
-  src: url("Inter-BoldItalic.woff2?v=3.12") format("woff2"),
-       url("Inter-BoldItalic.woff?v=3.12") format("woff");
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 800;
-  font-display: swap;
-  src: url("Inter-ExtraBold.woff2?v=3.12") format("woff2"),
-       url("Inter-ExtraBold.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 800;
-  font-display: swap;
-  src: url("Inter-ExtraBoldItalic.woff2?v=3.12") format("woff2"),
-       url("Inter-ExtraBoldItalic.woff?v=3.12") format("woff");
-}
-
-@font-face {
-  font-family: 'Inter';
-  font-style:  normal;
-  font-weight: 900;
-  font-display: swap;
-  src: url("Inter-Black.woff2?v=3.12") format("woff2"),
-       url("Inter-Black.woff?v=3.12") format("woff");
-}
-@font-face {
-  font-family: 'Inter';
-  font-style:  italic;
-  font-weight: 900;
-  font-display: swap;
-  src: url("Inter-BlackItalic.woff2?v=3.12") format("woff2"),
-       url("Inter-BlackItalic.woff?v=3.12") format("woff");
-}

frontend/src/components/Annoucements.vue

@@ -1,53 +0,0 @@
-<template>
-	<div v-if="communications.data?.length">
-		<div v-for="comm in communications.data">
-			<div class="mb-8">
-				<div class="flex items-center justify-between mb-2">
-					<div class="flex items-center">
-						<Avatar :label="comm.sender_full_name" size="lg" />
-						<div class="ml-2 text-ink-gray-7">
-							{{ comm.sender_full_name }}
-						</div>
-					</div>
-					<div class="text-sm">
-						{{ timeAgo(comm.communication_date) }}
-					</div>
-				</div>
-				<div
-					class="prose prose-sm bg-surface-menu-bar !min-w-full px-4 py-2 rounded-md"
-					v-html="comm.content"
-				></div>
-			</div>
-		</div>
-	</div>
-	<div v-else class="text-sm italic text-ink-gray-5">
-		{{ __('No announcements') }}
-	</div>
-</template>
-<script setup>
-import { createResource, Avatar } from 'frappe-ui'
-import { timeAgo } from '@/utils'
-
-const props = defineProps({
-	batch: {
-		type: String,
-		required: true,
-	},
-})
-
-const communications = createResource({
-	url: 'lms.lms.api.get_announcements',
-	makeParams(value) {
-		return {
-			batch: props.batch,
-		}
-	},
-	auto: true,
-	cache: ['announcement', props.batch],
-})
-</script>
-<style>
-.prose-sm p {
-	margin: 0 0 0.5rem;
-}
-</style>

frontend/src/components/AppSidebar.vue

@@ -1,628 +0,0 @@
-<template>
-	<div
-		class="flex h-full flex-col justify-between transition-all duration-300 ease-in-out border-r bg-surface-menu-bar"
-		:class="sidebarStore.isSidebarCollapsed ? 'w-14' : 'w-56'"
-	>
-		<div
-			class="flex flex-col overflow-hidden"
-			:class="sidebarStore.isSidebarCollapsed ? 'items-center' : ''"
-		>
-			<UserDropdown :isCollapsed="sidebarStore.isSidebarCollapsed" />
-			<div class="flex flex-col" v-if="sidebarSettings.data">
-				<SidebarLink
-					v-for="link in sidebarLinks"
-					:link="link"
-					:isCollapsed="sidebarStore.isSidebarCollapsed"
-					class="mx-2 my-0.5"
-				/>
-			</div>
-			<div
-				v-if="sidebarSettings.data?.web_pages?.length || isModerator"
-				class="mt-4"
-			>
-				<div
-					class="flex items-center justify-between pr-2 cursor-pointer"
-					:class="sidebarStore.isSidebarCollapsed ? 'pl-3' : 'pl-4'"
-					@click="toggleWebPages"
-				>
-					<div
-						v-if="!sidebarStore.isSidebarCollapsed"
-						class="flex items-center text-sm text-ink-gray-5 my-1"
-					>
-						<span class="grid h-5 w-6 flex-shrink-0 place-items-center">
-							<ChevronRight
-								class="h-4 w-4 stroke-1.5 text-ink-gray-9 transition-all duration-300 ease-in-out"
-								:class="{ 'rotate-90': !sidebarStore.isWebpagesCollapsed }"
-							/>
-						</span>
-						<span class="ml-2">
-							{{ __('More') }}
-						</span>
-					</div>
-					<Button
-						v-if="isModerator && !readOnlyMode"
-						variant="ghost"
-						@click="openPageModal()"
-					>
-						<template #icon>
-							<Plus class="h-4 w-4 text-ink-gray-7 stroke-1.5" />
-						</template>
-					</Button>
-				</div>
-				<div
-					v-if="sidebarSettings.data?.web_pages?.length"
-					class="flex flex-col transition-all duration-300 ease-in-out"
-					:class="!sidebarStore.isWebpagesCollapsed ? 'block' : 'hidden'"
-				>
-					<SidebarLink
-						v-for="link in sidebarSettings.data.web_pages"
-						:link="link"
-						:isCollapsed="sidebarStore.isSidebarCollapsed"
-						class="mx-2 my-0.5"
-						:showControls="isModerator ? true : false"
-						@openModal="openPageModal"
-						@deletePage="deletePage"
-					/>
-				</div>
-			</div>
-		</div>
-		<div class="m-2 flex flex-col gap-1">
-			<div
-				v-if="readOnlyMode && !sidebarStore.isSidebarCollapsed"
-				class="z-10 m-2 bg-surface-modal py-2.5 px-3 text-xs text-ink-gray-7 leading-5 rounded-md"
-			>
-				{{
-					__(
-						'This site is being updated. You will not be able to make any changes. Full access will be restored shortly.'
-					)
-				}}
-			</div>
-			<TrialBanner
-				v-if="
-					userResource.data?.is_system_manager && userResource.data?.is_fc_site
-				"
-				:isSidebarCollapsed="sidebarStore.isSidebarCollapsed"
-			/>
-			<GettingStartedBanner
-				v-if="showOnboarding && !isOnboardingStepsCompleted"
-				:isSidebarCollapsed="sidebarStore.isSidebarCollapsed"
-				appName="learning"
-			/>
-
-			<div
-				class="flex items-center mt-4"
-				:class="
-					sidebarStore.isSidebarCollapsed ? 'flex-col space-y-3' : 'flex-row'
-				"
-			>
-				<div
-					class="flex items-center flex-1"
-					:class="
-						sidebarStore.isSidebarCollapsed
-							? 'flex-col space-y-3'
-							: 'flex-row space-x-3'
-					"
-				>
-					<Tooltip v-if="readOnlyMode && sidebarStore.isSidebarCollapsed">
-						<CircleAlert
-							class="size-4 stroke-1.5 text-ink-gray-7 cursor-pointer"
-						/>
-						<template #body>
-							<div
-								class="max-w-[30ch] rounded bg-surface-gray-7 px-2 py-1 text-center text-p-xs text-ink-white shadow-xl"
-							>
-								{{
-									__(
-										'This site is being updated. You will not be able to make any changes. Full access will be restored shortly.'
-									)
-								}}
-							</div>
-						</template>
-					</Tooltip>
-					<Tooltip :text="__('Powered by Learning')">
-						<Zap
-							class="size-4 stroke-1.5 text-ink-gray-7 cursor-pointer"
-							@click="redirectToWebsite()"
-						/>
-					</Tooltip>
-					<Tooltip :text="__('Help')">
-						<CircleHelp
-							class="size-4 stroke-1.5 text-ink-gray-7 cursor-pointer"
-							@click="
-								() => {
-									showHelpModal = minimize ? true : !showHelpModal
-									minimize = !showHelpModal
-								}
-							"
-						/>
-					</Tooltip>
-				</div>
-				<Tooltip
-					:text="
-						sidebarStore.isSidebarCollapsed ? __('Expand') : __('Collapse')
-					"
-				>
-					<CollapseSidebar
-						class="size-4 text-ink-gray-7 duration-300 stroke-1.5 ease-in-out cursor-pointer"
-						:class="{
-							'[transform:rotateY(180deg)]': sidebarStore.isSidebarCollapsed,
-						}"
-						@click="toggleSidebar()"
-					/>
-				</Tooltip>
-			</div>
-		</div>
-		<HelpModal
-			v-if="showOnboarding && showHelpModal"
-			v-model="showHelpModal"
-			v-model:articles="articles"
-			appName="learning"
-			title="Frappe Learning"
-			:logo="LMSLogo"
-			:afterSkip="(step) => capture('onboarding_step_skipped_' + step)"
-			:afterSkipAll="() => capture('onboarding_steps_skipped')"
-			:afterReset="(step) => capture('onboarding_step_reset_' + step)"
-			:afterResetAll="() => capture('onboarding_steps_reset')"
-			docsLink="https://docs.frappe.io/learning"
-		/>
-		<IntermediateStepModal
-			v-model="showIntermediateModal"
-			:currentStep="currentStep"
-		/>
-	</div>
-	<PageModal
-		v-model="showPageModal"
-		v-model:reloadSidebar="sidebarSettings"
-		:page="pageToEdit"
-	/>
-</template>
-
-<script setup>
-import UserDropdown from '@/components/UserDropdown.vue'
-import CollapseSidebar from '@/components/Icons/CollapseSidebar.vue'
-import SidebarLink from '@/components/SidebarLink.vue'
-import { useStorage } from '@vueuse/core'
-import { ref, onMounted, inject, watch, reactive, markRaw, h } from 'vue'
-import { getSidebarLinks } from '../utils'
-import { usersStore } from '@/stores/user'
-import { sessionStore } from '@/stores/session'
-import { useSidebar } from '@/stores/sidebar'
-import { useSettings } from '@/stores/settings'
-import { Button, createResource, Tooltip } from 'frappe-ui'
-import PageModal from '@/components/Modals/PageModal.vue'
-import { capture } from '@/telemetry'
-import LMSLogo from '@/components/Icons/LMSLogo.vue'
-import { useRouter } from 'vue-router'
-import InviteIcon from './Icons/InviteIcon.vue'
-import {
-	BookOpen,
-	CircleAlert,
-	ChevronRight,
-	Plus,
-	CircleHelp,
-	FolderTree,
-	FileText,
-	UserPlus,
-	Users,
-	BookText,
-	Zap,
-} from 'lucide-vue-next'
-import {
-	TrialBanner,
-	HelpModal,
-	GettingStartedBanner,
-	useOnboarding,
-	showHelpModal,
-	minimize,
-	IntermediateStepModal,
-} from 'frappe-ui/frappe'
-
-const { user, sidebarSettings } = sessionStore()
-const { userResource } = usersStore()
-let sidebarStore = useSidebar()
-const socket = inject('$socket')
-const unreadCount = ref(0)
-const sidebarLinks = ref(getSidebarLinks())
-const showPageModal = ref(false)
-const isModerator = ref(false)
-const isInstructor = ref(false)
-const pageToEdit = ref(null)
-const settingsStore = useSettings()
-const showOnboarding = ref(false)
-const showIntermediateModal = ref(false)
-const currentStep = ref({})
-const router = useRouter()
-let onboardingDetails
-let isOnboardingStepsCompleted = false
-const readOnlyMode = window.read_only_mode
-const iconProps = {
-	strokeWidth: 1.5,
-	width: 16,
-	height: 16,
-}
-
-onMounted(() => {
-	addNotifications()
-	setSidebarLinks()
-	socket.on('publish_lms_notifications', (data) => {
-		unreadNotifications.reload()
-	})
-})
-
-const setSidebarLinks = () => {
-	sidebarSettings.reload(
-		{},
-		{
-			onSuccess(data) {
-				Object.keys(data).forEach((key) => {
-					if (!parseInt(data[key])) {
-						sidebarLinks.value = sidebarLinks.value.filter(
-							(link) => link.label.toLowerCase().split(' ').join('_') !== key
-						)
-					}
-				})
-			},
-		}
-	)
-}
-
-const unreadNotifications = createResource({
-	cache: 'Unread Notifications Count',
-	url: 'frappe.client.get_count',
-	makeParams(values) {
-		return {
-			doctype: 'Notification Log',
-			filters: {
-				for_user: user,
-				read: 0,
-			},
-		}
-	},
-	onSuccess(data) {
-		unreadCount.value = data
-		sidebarLinks.value = sidebarLinks.value.map((link) => {
-			if (link.label === 'Notifications') {
-				link.count = data
-			}
-			return link
-		})
-	},
-	auto: user ? true : false,
-})
-
-const addNotifications = () => {
-	if (user) {
-		sidebarLinks.value.push({
-			label: 'Notifications',
-			icon: 'Bell',
-			to: 'Notifications',
-			activeFor: ['Notifications'],
-			count: unreadCount.value,
-		})
-	}
-}
-
-const addQuizzes = () => {
-	if (isInstructor.value || isModerator.value) {
-		sidebarLinks.value.push({
-			label: 'Quizzes',
-			icon: 'CircleHelp',
-			to: 'Quizzes',
-			activeFor: [
-				'Quizzes',
-				'QuizForm',
-				'QuizSubmissionList',
-				'QuizSubmission',
-			],
-		})
-	}
-}
-
-const addAssignments = () => {
-	if (isInstructor.value || isModerator.value) {
-		sidebarLinks.value.push({
-			label: 'Assignments',
-			icon: 'Pencil',
-			to: 'Assignments',
-			activeFor: [
-				'Assignments',
-				'AssignmentForm',
-				'AssignmentSubmissionList',
-				'AssignmentSubmission',
-			],
-		})
-	}
-}
-
-const addPrograms = () => {
-	let activeFor = ['Programs', 'ProgramForm']
-	let index = 1
-	let canAddProgram = false
-
-	if (
-		!isInstructor.value &&
-		!isModerator.value &&
-		settingsStore.learningPaths.data
-	) {
-		sidebarLinks.value = sidebarLinks.value.filter(
-			(link) => link.label !== 'Courses'
-		)
-		activeFor.push('CourseDetail')
-		activeFor.push('Lesson')
-		index = 0
-		canAddProgram = true
-	} else if (isInstructor.value || isModerator.value) {
-		canAddProgram = true
-	}
-
-	if (canAddProgram) {
-		sidebarLinks.value.splice(index, 0, {
-			label: 'Programs',
-			icon: 'Route',
-			to: 'Programs',
-			activeFor: activeFor,
-		})
-	}
-}
-
-const openPageModal = (link) => {
-	showPageModal.value = true
-	pageToEdit.value = link
-}
-
-const deletePage = (link) => {
-	createResource({
-		url: 'lms.lms.api.delete_sidebar_item',
-		makeParams(values) {
-			return {
-				webpage: link.web_page,
-			}
-		},
-	}).submit(
-		{},
-		{
-			onSuccess() {
-				sidebarSettings.reload()
-			},
-		}
-	)
-}
-
-const getSidebarFromStorage = () => {
-	return useStorage('sidebar_is_collapsed', false)
-}
-
-const toggleSidebar = () => {
-	sidebarStore.isSidebarCollapsed = !sidebarStore.isSidebarCollapsed
-	localStorage.setItem(
-		'isSidebarCollapsed',
-		JSON.stringify(sidebarStore.isSidebarCollapsed)
-	)
-}
-
-const toggleWebPages = () => {
-	sidebarStore.isWebpagesCollapsed = !sidebarStore.isWebpagesCollapsed
-	localStorage.setItem(
-		'isWebpagesCollapsed',
-		JSON.stringify(sidebarStore.isWebpagesCollapsed)
-	)
-}
-
-const getFirstCourse = async () => {
-	let firstCourse = localStorage.getItem('firstCourse')
-	if (firstCourse) return firstCourse
-	return await call('lms.lms.onboarding.get_first_course')
-}
-
-const getFirstBatch = async () => {
-	let firstBatch = localStorage.getItem('firstBatch')
-	if (firstBatch) return firstBatch
-	return await call('lms.lms.onboarding.get_first_batch')
-}
-
-const steps = reactive([
-	{
-		name: 'create_first_course',
-		title: __('Create your first course'),
-		icon: markRaw(h(BookOpen, iconProps)),
-		completed: false,
-		onClick: () => {
-			minimize.value = true
-			router.push({
-				name: 'Courses',
-			})
-		},
-	},
-	{
-		name: 'create_first_chapter',
-		title: __('Add your first chapter'),
-		icon: markRaw(h(FolderTree, iconProps)),
-		completed: false,
-		onClick: async () => {
-			minimize.value = true
-			let course = await getFirstCourse()
-			if (course) {
-				router.push({ name: 'CourseForm', params: { courseName: course } })
-			} else {
-				router.push({ name: 'CourseForm' })
-			}
-		},
-	},
-	{
-		name: 'create_first_lesson',
-		title: __('Add your first lesson'),
-		icon: markRaw(h(FileText, iconProps)),
-		completed: false,
-		onClick: async () => {
-			minimize.value = true
-			let course = await getFirstCourse()
-			if (course) {
-				router.push({
-					name: 'CourseForm',
-					params: { courseName: course },
-				})
-			} else {
-				router.push({ name: 'Courses' })
-			}
-		},
-	},
-	{
-		name: 'create_first_quiz',
-		title: __('Create your first quiz'),
-		icon: markRaw(h(CircleHelp, iconProps)),
-		completed: false,
-		onClick: () => {
-			minimize.value = true
-			router.push({ name: 'Quizzes' })
-		},
-	},
-	{
-		name: 'invite_students',
-		title: __('Invite your team and students'),
-		icon: markRaw(h(InviteIcon, iconProps)),
-		completed: false,
-		onClick: () => {
-			minimize.value = true
-			settingsStore.activeTab = 'Members'
-			settingsStore.isSettingsOpen = true
-		},
-	},
-	{
-		name: 'create_first_batch',
-		title: __('Create your first batch'),
-		icon: markRaw(h(Users, iconProps)),
-		completed: false,
-		onClick: () => {
-			minimize.value = true
-			router.push({ name: 'Batches' })
-		},
-	},
-	{
-		name: 'add_batch_student',
-		title: __('Add students to your batch'),
-		icon: markRaw(h(UserPlus, iconProps)),
-		completed: false,
-		onClick: async () => {
-			minimize.value = true
-			let batch = await getFirstBatch()
-			if (batch) {
-				router.push({
-					name: 'Batch',
-					params: {
-						batchName: batch,
-					},
-				})
-			} else {
-				router.push({ name: 'Batch' })
-			}
-		},
-	},
-	{
-		name: 'add_batch_course',
-		title: __('Add courses to your batch'),
-		icon: markRaw(h(BookText, iconProps)),
-		completed: false,
-		onClick: async () => {
-			minimize.value = true
-			let batch = await getFirstBatch()
-			if (batch) {
-				router.push({
-					name: 'Batch',
-					params: {
-						batchName: batch,
-					},
-					hash: '#courses',
-				})
-			} else {
-				router.push({ name: 'Batch' })
-			}
-		},
-	},
-])
-
-const articles = ref([
-	{
-		title: __('Introduction'),
-		opened: false,
-		subArticles: [
-			{ name: 'introduction', title: __('Introduction') },
-			{ name: 'setting-up', title: __('Setting up') },
-		],
-	},
-	{
-		title: __('Creating a course'),
-		opened: false,
-		subArticles: [
-			{ name: 'create-a-course', title: __('Create a course') },
-			{ name: 'add-a-chapter', title: __('Add a chapter') },
-			{ name: 'add-a-lesson', title: __('Add a lesson') },
-		],
-	},
-	{
-		title: __('Creating a batch'),
-		opened: false,
-		subArticles: [
-			{ name: 'create-a-batch', title: __('Create a batch') },
-			{ name: 'create-a-live-class', title: __('Create a live class') },
-		],
-	},
-	{
-		title: __('Assessments'),
-		opened: false,
-		subArticles: [
-			{ name: 'quizzes', title: __('Quizzes') },
-			{ name: 'assignments', title: __('Assignments') },
-		],
-	},
-	{
-		title: __('Certification'),
-		opened: false,
-		subArticles: [
-			{ name: 'issue-a-certificate', title: __('Issue a Certificate') },
-			{
-				name: 'custom-certificate-templates',
-				title: __('Custom Certificate Templates'),
-			},
-		],
-	},
-	{
-		title: __('Monetization'),
-		opened: false,
-		subArticles: [
-			{
-				name: 'setting-up-payment-gateway',
-				title: __('Setting up payment gateway'),
-			},
-		],
-	},
-	{
-		title: __('Settings'),
-		opened: false,
-		subArticles: [{ name: 'roles', title: __('Roles') }],
-	},
-])
-
-const setUpOnboarding = () => {
-	if (userResource.data?.is_system_manager) {
-		onboardingDetails = useOnboarding('learning')
-		onboardingDetails.setUp(steps)
-		isOnboardingStepsCompleted = onboardingDetails.isOnboardingStepsCompleted
-		showOnboarding.value = true
-	}
-}
-
-watch(userResource, () => {
-	if (userResource.data) {
-		isModerator.value = userResource.data.is_moderator
-		isInstructor.value = userResource.data.is_instructor
-		addPrograms()
-		addQuizzes()
-		addAssignments()
-		setUpOnboarding()
-	}
-})
-
-const redirectToWebsite = () => {
-	window.open('https://frappe.io/learning', '_blank')
-}
-</script>

frontend/src/components/Apps.vue

@@ -1,67 +0,0 @@
-<template>
-	<Popover placement="right-start" class="flex w-full">
-		<template #target="{ togglePopover }">
-			<button
-				:class="[
-					'group w-full flex h-7 items-center justify-between rounded px-2 text-base text-ink-gray-7 hover:bg-surface-gray-2',
-				]"
-				@click.prevent="togglePopover()"
-			>
-				<div class="flex gap-2">
-					<LayoutGrid class="size-4 stroke-1.5" />
-					<span class="whitespace-nowrap">
-						{{ __('Apps') }}
-					</span>
-				</div>
-				<ChevronRight class="h-4 w-4 stroke-1.5" />
-			</button>
-		</template>
-		<template #body>
-			<div
-				class="grid grid-cols-3 justify-between mx-3 p-2 rounded-lg border border-gray-100 bg-surface-white shadow-xl"
-			>
-				<div v-for="app in apps.data" key="name">
-					<a
-						:href="app.route"
-						class="flex flex-col gap-1.5 rounded justify-center items-center py-2 px-3 hover:bg-surface-gray-2"
-					>
-						<img class="size-8" :src="app.logo" />
-						<div class="text-sm text-ink-gray-7" @click="app.onClick">
-							{{ app.title }}
-						</div>
-					</a>
-				</div>
-			</div>
-		</template>
-	</Popover>
-</template>
-<script setup>
-import { Popover, createResource } from 'frappe-ui'
-import { LayoutGrid, ChevronRight } from 'lucide-vue-next'
-
-const apps = createResource({
-	url: 'frappe.apps.get_apps',
-	cache: 'apps',
-	auto: true,
-	transform: (data) => {
-		let _apps = [
-			{
-				name: 'frappe',
-				logo: '/assets/lms/images/desk.png',
-				title: __('Desk'),
-				route: '/app',
-			},
-		]
-		data.map((app) => {
-			if (app.name === 'lms') return
-			_apps.push({
-				name: app.name,
-				logo: app.logo,
-				title: __(app.title),
-				route: app.route,
-			})
-		})
-		return _apps
-	},
-})
-</script>

frontend/src/components/AssessmentPlugin.vue

@@ -1,75 +0,0 @@
-<template>
-	<Dialog
-		v-model="show"
-		:options="{
-			size: 'xl',
-		}"
-	>
-		<template #body>
-			<div class="p-5 space-y-4">
-				<div v-if="type == 'quiz'" class="text-lg font-semibold">
-					{{ __('Add a quiz to your lesson') }}
-				</div>
-				<div v-else class="text-lg font-semibold">
-					{{ __('Add an assignment to your lesson') }}
-				</div>
-				<div>
-					<Link
-						v-if="type == 'quiz'"
-						v-model="quiz"
-						doctype="LMS Quiz"
-						:label="__('Select a quiz')"
-						:onCreate="(value, close) => redirectToForm()"
-					/>
-					<Link
-						v-else
-						v-model="assignment"
-						doctype="LMS Assignment"
-						:label="__('Select an assignment')"
-						:onCreate="(value, close) => redirectToForm()"
-					/>
-				</div>
-				<div class="flex justify-end space-x-2">
-					<Button variant="solid" @click="addAssessment()">
-						{{ __('Save') }}
-					</Button>
-				</div>
-			</div>
-		</template>
-	</Dialog>
-</template>
-<script setup>
-import { Dialog, Button } from 'frappe-ui'
-import { onMounted, ref, nextTick } from 'vue'
-import Link from '@/components/Controls/Link.vue'
-
-const show = ref(false)
-const quiz = ref(null)
-const assignment = ref(null)
-
-const props = defineProps({
-	type: {
-		type: String,
-		required: true,
-	},
-	onAddition: {
-		type: Function,
-		required: true,
-	},
-})
-
-onMounted(async () => {
-	await nextTick()
-	show.value = true
-})
-
-const addAssessment = () => {
-	props.onAddition(props.type == 'quiz' ? quiz.value : assignment.value)
-	show.value = false
-}
-
-const redirectToForm = () => {
-	if (props.type == 'quiz') window.open('/lms/quizzes/new', '_blank')
-	else window.open('/lms/assignments/new', '_blank')
-}
-</script>

frontend/src/components/Assessments.vue

@@ -1,224 +0,0 @@
-<template>
-	<div>
-		<div class="flex items-center justify-between mb-4">
-			<div class="text-lg font-semibold text-ink-gray-9">
-				{{ __('Assessments') }}
-			</div>
-			<Button v-if="canAddAssessments()" @click="showModal = true">
-				<template #prefix>
-					<Plus class="h-4 w-4" />
-				</template>
-				{{ __('Add') }}
-			</Button>
-		</div>
-		<div v-if="assessments.data?.length" class="text-sm">
-			<ListView
-				:columns="getAssessmentColumns()"
-				:rows="assessments.data"
-				row-key="name"
-				:options="{
-					showTooltip: false,
-					getRowRoute: (row) => getRowRoute(row),
-					selectable: user.data?.is_student ? false : true,
-				}"
-			>
-				<ListHeader
-					class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
-				>
-					<ListHeaderItem :item="item" v-for="item in getAssessmentColumns()">
-						<template #prefix="{ item }">
-							<component
-								v-if="item.icon"
-								:is="item.icon"
-								class="h-4 w-4 stroke-1.5 ml-4"
-							/>
-						</template>
-					</ListHeaderItem>
-				</ListHeader>
-				<ListRows>
-					<ListRow :row="row" v-for="row in assessments.data">
-						<template #default="{ column, item }">
-							<ListRowItem :item="row[column.key]" :align="column.align">
-								<div v-if="column.key == 'assessment_type'">
-									{{ row[column.key] == 'LMS Quiz' ? 'Quiz' : 'Assignment' }}
-								</div>
-								<div v-else-if="column.key == 'title'">
-									{{ row[column.key] }}
-								</div>
-								<div v-else-if="isNaN(row[column.key])">
-									<Badge :theme="getStatusTheme(row[column.key])">
-										{{ row[column.key] }}
-									</Badge>
-								</div>
-								<div v-else>
-									{{ row[column.key] }}
-								</div>
-							</ListRowItem>
-						</template>
-					</ListRow>
-				</ListRows>
-				<ListSelectBanner>
-					<template #actions="{ unselectAll, selections }">
-						<div class="flex gap-2">
-							<Button
-								variant="ghost"
-								@click="removeAssessments(selections, unselectAll)"
-							>
-								<Trash2 class="h-4 w-4 stroke-1.5" />
-							</Button>
-						</div>
-					</template>
-				</ListSelectBanner>
-			</ListView>
-		</div>
-		<div v-else class="text-sm italic text-ink-gray-5">
-			{{ __('No Assessments') }}
-		</div>
-	</div>
-	<AssessmentModal
-		v-model="showModal"
-		v-model:assessments="assessments"
-		:batch="props.batch"
-	/>
-</template>
-<script setup>
-import {
-	ListView,
-	ListRow,
-	ListRows,
-	ListHeader,
-	ListHeaderItem,
-	ListRowItem,
-	ListSelectBanner,
-	createResource,
-	Button,
-	Badge,
-} from 'frappe-ui'
-import { inject, ref } from 'vue'
-import AssessmentModal from '@/components/Modals/AssessmentModal.vue'
-import { Plus, Trash2 } from 'lucide-vue-next'
-
-const user = inject('$user')
-const showModal = ref(false)
-const readOnlyMode = window.read_only_mode
-
-const props = defineProps({
-	batch: {
-		type: String,
-		required: true,
-	},
-	rows: {
-		type: Array,
-	},
-	columns: {
-		type: Array,
-	},
-	options: {
-		type: Object,
-		default: () => ({
-			selectable: true,
-			totalCount: 0,
-			rowCount: 0,
-		}),
-	},
-})
-
-const assessments = createResource({
-	url: 'lms.lms.utils.get_assessments',
-	params: {
-		batch: props.batch,
-	},
-	auto: true,
-})
-
-const deleteAssessments = createResource({
-	url: 'lms.lms.api.delete_documents',
-	makeParams(values) {
-		return {
-			doctype: 'LMS Assessment',
-			documents: values.assessments,
-		}
-	},
-})
-
-const removeAssessments = (selections, unselectAll) => {
-	deleteAssessments.submit(
-		{ assessments: Array.from(selections) },
-		{
-			onSuccess(data) {
-				assessments.reload()
-				unselectAll()
-			},
-		}
-	)
-}
-
-const getRowRoute = (row) => {
-	if (row.assessment_type == 'LMS Assignment') {
-		if (row.submission) {
-			return {
-				name: 'AssignmentSubmission',
-				params: {
-					assignmentID: row.assessment_name,
-					submissionName: row.submission.name,
-				},
-			}
-		} else {
-			return {
-				name: 'AssignmentSubmission',
-				params: {
-					assignmentID: row.assessment_name,
-					submissionName: 'new',
-				},
-			}
-		}
-	} else {
-		return {
-			name: 'QuizPage',
-			params: {
-				quizID: row.assessment_name,
-			},
-		}
-	}
-}
-
-const canAddAssessments = () => {
-	if (readOnlyMode) return false
-	return user.data?.is_moderator || user.data?.is_evaluator
-}
-
-const getAssessmentColumns = () => {
-	let columns = [
-		{
-			label: 'Assessment',
-			key: 'title',
-			width: '25rem',
-		},
-		{
-			label: 'Type',
-			key: 'assessment_type',
-			width: '15rem',
-		},
-	]
-
-	if (!user.data?.is_moderator) {
-		columns.push({
-			label: 'Status/Percentage',
-			key: 'status',
-			align: 'left',
-			width: '10rem',
-		})
-	}
-	return columns
-}
-
-const getStatusTheme = (status) => {
-	if (status === 'Pass') {
-		return 'green'
-	} else if (status === 'Not Graded') {
-		return 'orange'
-	} else {
-		return 'red'
-	}
-}
-</script>

frontend/src/components/Assignment.vue

@@ -1,476 +0,0 @@
-<template>
-	<div
-		v-if="assignment.data"
-		class="grid grid-cols-2 h-full"
-		:class="{ 'border rounded-lg overflow-auto': !showTitle }"
-	>
-		<div
-			class="border-r p-5 overflow-y-auto h-[calc(100vh-3.2rem)]"
-			:class="{ 'h-full': !showTitle }"
-		>
-			<div v-if="showTitle" class="text-lg font-semibold mb-5 text-ink-gray-9">
-				<div v-if="submissionName === 'new'">
-					{{ __('Submission by') }} {{ user.data?.full_name }}
-				</div>
-				<div v-else>
-					{{ __('Submission by') }} {{ submissionResource.doc?.member_name }}
-				</div>
-			</div>
-			<div class="text-sm text-ink-gray-7 font-medium mb-2">
-				{{ __('Question') }}:
-			</div>
-			<div
-				v-html="assignment.data.question"
-				class="ProseMirror prose prose-table:table-fixed prose-td:p-2 prose-th:p-2 prose-td:border prose-th:border prose-td:border-outline-gray-2 prose-th:border-outline-gray-2 prose-td:relative prose-th:relative prose-th:bg-surface-gray-2 prose-sm max-w-none !whitespace-normal"
-			></div>
-		</div>
-
-		<div class="flex flex-col">
-			<div class="p-5">
-				<div class="flex items-center justify-between mb-4">
-					<div class="font-semibold text-ink-gray-9">
-						{{ __('Submission') }}
-					</div>
-					<div class="flex items-center space-x-2">
-						<Badge v-if="isDirty" theme="orange">
-							{{ __('Not Saved') }}
-						</Badge>
-						<Badge
-							v-else-if="submissionResource.doc?.status"
-							:theme="statusTheme"
-							size="lg"
-						>
-							{{ submissionResource.doc?.status }}
-						</Badge>
-						<Button variant="solid" @click="submitAssignment()">
-							{{ __('Save') }}
-						</Button>
-					</div>
-				</div>
-				<div
-					v-if="
-						submissionName != 'new' &&
-						!['Pass', 'Fail'].includes(submissionResource.doc?.status) &&
-						submissionResource.doc?.owner == user.data?.name
-					"
-					class="bg-surface-blue-2 text-ink-blue-2 p-3 rounded-md leading-5 text-sm mb-4"
-				>
-					{{ __("You've successfully submitted the assignment.") }}
-					{{
-						__(
-							"Once the moderator grades your submission, you'll find the details here."
-						)
-					}}
-					{{ __('Feel free to make edits to your submission if needed.') }}
-				</div>
-				<div v-if="showUploader()">
-					<div class="text-xs text-ink-gray-5 mt-1 mb-2">
-						{{ __('Add your assignment as {0}').format(assignment.data.type) }}
-					</div>
-					<FileUploader
-						v-if="!submissionFile"
-						:fileTypes="getType()"
-						:validateFile="validateFile"
-						@success="(file) => saveSubmission(file)"
-					>
-						<template #default="{ uploading, progress, openFileSelector }">
-							<Button @click="openFileSelector" :loading="uploading">
-								{{
-									uploading
-										? __('Uploading {0}%').format(progress)
-										: __('Upload File')
-								}}
-							</Button>
-						</template>
-					</FileUploader>
-					<div v-else>
-						<div class="flex text-ink-gray-7">
-							<div class="border self-start rounded-md p-2 mr-2">
-								<FileText class="h-5 w-5 stroke-1.5" />
-							</div>
-							<a
-								:href="submissionFile.file_url"
-								target="_blank"
-								class="flex flex-col cursor-pointer !no-underline"
-							>
-								<span class="text-sm leading-5">
-									{{ submissionFile.file_name }}
-								</span>
-								<span class="text-sm text-ink-gray-5 mt-1">
-									{{ getFileSize(submissionFile.file_size) }}
-								</span>
-							</a>
-							<X
-								v-if="canModifyAssignment"
-								@click="removeSubmission()"
-								class="bg-surface-gray-3 rounded-md cursor-pointer stroke-1.5 w-5 h-5 p-1 ml-4"
-							/>
-						</div>
-					</div>
-				</div>
-				<div v-else-if="assignment.data.type == 'URL'">
-					<div class="text-xs text-ink-gray-5 mb-1">
-						{{ __('Enter a URL') }}
-					</div>
-					<FormControl
-						v-model="answer"
-						type="text"
-						:readonly="!canModifyAssignment"
-					/>
-				</div>
-				<div v-else>
-					<div class="text-sm mb-2 text-ink-gray-7">
-						{{ __('Write your answer here') }}
-					</div>
-					<TextEditor
-						:content="answer"
-						@change="(val) => (answer = val)"
-						:editable="true"
-						:fixedMenu="true"
-						editorClass="prose-sm max-w-none border-b border-x bg-surface-gray-2 rounded-b-md py-1 px-2 min-h-[7rem]"
-					/>
-				</div>
-
-				<div
-					v-if="
-						user.data?.name == submissionResource.doc?.owner &&
-						submissionResource.doc?.comments
-					"
-					class="mt-8 p-3 bg-surface-blue-2 rounded-md"
-				>
-					<div class="text-sm text-ink-gray-5 font-medium mb-2">
-						{{ __('Comments by Evaluator') }}:
-					</div>
-					<div
-						class="leading-5 text-ink-gray-9"
-						v-html="submissionResource.doc.comments"
-					></div>
-				</div>
-
-				<!-- Grading -->
-				<div v-if="canGradeSubmission" class="mt-8 space-y-4">
-					<div class="font-semibold mb-2 text-ink-gray-9">
-						{{ __('Grading') }}
-					</div>
-					<FormControl
-						v-if="submissionResource.doc"
-						v-model="submissionResource.doc.status"
-						:label="__('Grade')"
-						type="select"
-						:options="submissionStatusOptions"
-					/>
-					<div>
-						<div class="text-sm text-ink-gray-5 mb-1">
-							{{ __('Comments') }}
-						</div>
-						<TextEditor
-							:content="comments"
-							@change="
-								(val) => {
-									comments = val
-									isDirty = true
-								}
-							"
-							:editable="true"
-							:fixedMenu="true"
-							editorClass="prose-sm max-w-none border-b border-x bg-surface-gray-2 rounded-b-md py-1 px-2 min-h-[7rem]"
-						/>
-					</div>
-				</div>
-			</div>
-		</div>
-	</div>
-</template>
-<script setup>
-import {
-	Badge,
-	Button,
-	call,
-	createResource,
-	createDocumentResource,
-	FileUploader,
-	FormControl,
-	TextEditor,
-} from 'frappe-ui'
-import { computed, inject, onMounted, onBeforeUnmount, ref, watch } from 'vue'
-import { FileText, X } from 'lucide-vue-next'
-import { showToast, getFileSize } from '@/utils'
-import { useRouter } from 'vue-router'
-
-const submissionFile = ref(null)
-const answer = ref(null)
-const comments = ref(null)
-const router = useRouter()
-const user = inject('$user')
-const isDirty = ref(false)
-
-const props = defineProps({
-	assignmentID: {
-		type: String,
-		required: true,
-	},
-	submissionName: {
-		type: String,
-		default: 'new',
-	},
-	showTitle: {
-		type: Boolean,
-		default: true,
-	},
-})
-
-onMounted(() => {
-	window.addEventListener('keydown', keyboardShortcut)
-})
-
-const keyboardShortcut = (e) => {
-	if (e.key === 's' && (e.ctrlKey || e.metaKey)) {
-		submitAssignment()
-		e.preventDefault()
-	}
-}
-
-onBeforeUnmount(() => {
-	window.removeEventListener('keydown', keyboardShortcut)
-})
-
-const assignment = createResource({
-	url: 'frappe.client.get',
-	params: {
-		doctype: 'LMS Assignment',
-		name: props.assignmentID,
-	},
-	auto: true,
-	onSuccess(data) {
-		if (props.submissionName != 'new') {
-			submissionResource.reload()
-		}
-	},
-})
-
-const newSubmission = createResource({
-	url: 'frappe.client.insert',
-	makeParams(values) {
-		let doc = {
-			doctype: 'LMS Assignment Submission',
-			assignment: props.assignmentID,
-			member: user.data?.name,
-		}
-		if (showUploader()) {
-			doc.assignment_attachment = submissionFile.value.file_url
-		} else {
-			doc.answer = answer.value
-		}
-		return {
-			doc: doc,
-		}
-	},
-})
-
-const imageResource = createResource({
-	url: 'lms.lms.api.get_file_info',
-	makeParams(values) {
-		return {
-			file_url: values.image,
-		}
-	},
-	auto: false,
-	onSuccess(data) {
-		submissionFile.value = data
-	},
-})
-
-const submissionResource = createDocumentResource({
-	doctype: 'LMS Assignment Submission',
-	name: props.submissionName,
-	onError(err) {
-		showToast(__('Error'), __(err.messages?.[0] || err), 'x')
-	},
-	auto: false,
-	cache: [user.data?.name, props.assignmentID],
-})
-
-watch(submissionResource, () => {
-	if (submissionResource.doc) {
-		if (submissionResource.doc.assignment_attachment) {
-			imageResource.reload({
-				image: submissionResource.doc.assignment_attachment,
-			})
-		}
-		if (submissionResource.doc.answer) {
-			answer.value = submissionResource.doc.answer
-		}
-		if (submissionResource.doc.comments) {
-			comments.value = submissionResource.doc.comments
-		}
-		if (submissionResource.isDirty) {
-			isDirty.value = true
-		} else if (showUploader() && !submissionFile.value) {
-			isDirty.value = true
-		} else if (!showUploader() && !answer.value) {
-			isDirty.value = true
-		} else {
-			isDirty.value = false
-		}
-	}
-})
-
-watch(submissionFile, () => {
-	if (props.submissionName == 'new' && submissionFile.value) {
-		isDirty.value = true
-	}
-})
-
-const submitAssignment = () => {
-	if (props.submissionName != 'new') {
-		let evaluator =
-			submissionResource.doc && submissionResource.doc.owner != user.data?.name
-				? user.data?.name
-				: null
-
-		submissionResource.setValue.submit(
-			{
-				...submissionResource.doc,
-				assignment_attachment: submissionFile.value?.file_url,
-				evaluator: evaluator,
-				comments: comments.value,
-				answer: answer.value,
-			},
-			{
-				onSuccess(data) {
-					showToast(__('Success'), __('Changes saved successfully'), 'check')
-				},
-			}
-		)
-	} else {
-		addNewSubmission()
-	}
-}
-
-const addNewSubmission = () => {
-	newSubmission.submit(
-		{},
-		{
-			onSuccess(data) {
-				showToast('Success', 'Assignment submitted successfully.', 'check')
-				if (router.currentRoute.value.name == 'AssignmentSubmission') {
-					router.push({
-						name: 'AssignmentSubmission',
-						params: {
-							assignmentID: props.assignmentID,
-							submissionName: data.name,
-						},
-						query: { fromLesson: router.currentRoute.value.query.fromLesson },
-					})
-				} else {
-					markLessonProgress()
-					router.go()
-				}
-				submissionResource.name = data.name
-				submissionResource.reload()
-			},
-			onError(err) {
-				showToast('Error', err.messages?.[0] || err, 'x')
-			},
-		}
-	)
-}
-
-const saveSubmission = (file) => {
-	isDirty.value = true
-	submissionFile.value = file
-}
-
-const markLessonProgress = () => {
-	if (router.currentRoute.value.name == 'Lesson') {
-		let courseName = router.currentRoute.value.params.courseName
-		let chapterNumber = router.currentRoute.value.params.chapterNumber
-		let lessonNumber = router.currentRoute.value.params.lessonNumber
-
-		call('lms.lms.api.mark_lesson_progress', {
-			course: courseName,
-			chapter_number: chapterNumber,
-			lesson_number: lessonNumber,
-		})
-	}
-}
-
-const getType = () => {
-	const type = assignment.data?.type
-	if (type == 'Image') {
-		return ['image/*']
-	} else if (type == 'Document') {
-		return [
-			'.doc',
-			'.docx',
-			'.xml',
-			'application/msword',
-			'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
-		]
-	} else if (type == 'PDF') {
-		return ['.pdf']
-	}
-}
-
-const validateFile = (file) => {
-	let type = assignment.data?.type
-	let extension = file.name.split('.').pop().toLowerCase()
-	if (type == 'Image' && !['jpg', 'jpeg', 'png'].includes(extension)) {
-		return 'Only image file is allowed.'
-	} else if (
-		type == 'Document' &&
-		!['doc', 'docx', 'xml'].includes(extension)
-	) {
-		return 'Only document file is allowed.'
-	} else if (type == 'PDF' && !['pdf'].includes(extension)) {
-		return 'Only PDF file is allowed.'
-	}
-}
-
-const removeSubmission = () => {
-	isDirty.value = true
-	submissionFile.value = null
-}
-
-const canGradeSubmission = computed(() => {
-	return (
-		(user.data?.is_moderator ||
-			user.data?.is_evaluator ||
-			user.data?.is_instructor) &&
-		props.submissionName != 'new' &&
-		router.currentRoute.value.name == 'AssignmentSubmission'
-	)
-})
-
-const canModifyAssignment = computed(() => {
-	return (
-		!submissionResource.doc ||
-		(submissionResource.doc?.owner == user.data?.name &&
-			submissionResource.doc?.status == 'Not Graded')
-	)
-})
-
-const submissionStatusOptions = computed(() => {
-	return [
-		{ label: 'Not Graded', value: 'Not Graded' },
-		{ label: 'Pass', value: 'Pass' },
-		{ label: 'Fail', value: 'Fail' },
-	]
-})
-
-const statusTheme = computed(() => {
-	if (!submissionResource.doc) {
-		return 'orange'
-	} else if (submissionResource.doc.status == 'Pass') {
-		return 'green'
-	} else if (submissionResource.doc.status == 'Not Graded') {
-		return 'blue'
-	} else {
-		return 'red'
-	}
-})
-
-const showUploader = () => {
-	return ['PDF', 'Image', 'Document'].includes(assignment.data?.type)
-}
-</script>

frontend/src/components/AudioBlock.vue

@@ -1,134 +0,0 @@
-<template>
-	<div>
-		<!-- <audio width="100%" controls controlsList="nodownload" class="mb-4">
-			<source :src="encodeURI(file)" type="audio/mp3" />
-		</audio> -->
-		<audio @ended="handleAudioEnd" controlsList="nodownload" class="mb-4">
-			<source :src="encodeURI(file)" type="audio/mp3" />
-		</audio>
-		<div class="flex items-center space-x-2 shadow rounded-lg p-1 w-1/2">
-			<Button variant="ghost" @click="togglePlay">
-				<template #icon>
-					<Play v-if="!isPlaying" class="w-4 h-4 text-ink-gray-9" />
-					<Pause v-else class="w-4 h-4 text-ink-gray-9" />
-				</template>
-			</Button>
-			<input
-				type="range"
-				min="0"
-				:max="duration"
-				step="0.1"
-				v-model="currentTime"
-				@input="changeCurrentTime"
-				class="duration-slider w-full h-1"
-			/>
-			<span class="text-xs text-ink-gray-9 font-medium">
-				{{ formatTime(currentTime) }} / {{ formatTime(duration) }}
-			</span>
-			<Button variant="ghost" @click="toggleMute">
-				<template #icon>
-					<Volume2 v-if="!isMuted" class="w-4 h-4 text-ink-gray-9" />
-					<VolumeX v-else class="w-4 h-4 text-ink-gray-9" />
-				</template>
-			</Button>
-		</div>
-	</div>
-</template>
-
-<script setup>
-import { ref, onMounted, watch } from 'vue'
-import { Play, Pause, Volume2, VolumeX } from 'lucide-vue-next'
-import { Button } from 'frappe-ui'
-
-const isPlaying = ref(false)
-const audio = ref(null)
-let isMuted = ref(false)
-let currentTime = ref(0)
-let duration = ref(0)
-
-const props = defineProps({
-	file: {
-		type: String,
-		required: true,
-	},
-})
-
-onMounted(() => {
-	setTimeout(() => {
-		audio.value = document.querySelector('audio')
-		audio.value.onloadedmetadata = () => {
-			duration.value = audio.value.duration
-		}
-		audio.value.ontimeupdate = () => {
-			currentTime.value = audio.value.currentTime
-		}
-	}, 0)
-})
-
-const togglePlay = () => {
-	if (audio.value.paused) {
-		audio.value.play()
-		isPlaying.value = true
-	} else {
-		audio.value.pause()
-		isPlaying.value = false
-	}
-}
-
-const toggleMute = () => {
-	audio.value.muted = !audio.value.muted
-	isMuted.value = audio.value.muted
-}
-
-const changeCurrentTime = () => {
-	audio.value.currentTime = currentTime.value
-}
-
-const handleAudioEnd = () => {
-	isPlaying.value = false
-}
-
-const formatTime = (time) => {
-	const minutes = Math.floor(time / 60)
-	const seconds = Math.floor(time % 60)
-	return `${minutes}:${seconds < 10 ? '0' : ''}${seconds}`
-}
-
-watch(isPlaying, (newVal) => {
-	if (newVal) {
-		audio.value.play()
-	} else {
-		audio.value.pause()
-	}
-})
-</script>
-<style>
-.duration-slider {
-	flex: 1;
-	-webkit-appearance: none;
-	appearance: none;
-	background-color: theme('colors.gray.400');
-	cursor: pointer;
-}
-
-.duration-slider::-webkit-slider-thumb {
-	height: 10px;
-	width: 10px;
-	-webkit-appearance: none;
-	background-color: theme('colors.gray.900');
-}
-
-@media screen and (-webkit-min-device-pixel-ratio: 0) {
-	input[type='range'] {
-		overflow: hidden;
-		width: 150px;
-		-webkit-appearance: none;
-	}
-
-	input[type='range']::-webkit-slider-thumb {
-		-webkit-appearance: none;
-		cursor: pointer;
-		box-shadow: -150px 0 0 150px theme('colors.gray.900');
-	}
-}
-</style>

frontend/src/components/BatchCard.vue

@@ -1,111 +0,0 @@
-<template>
-	<div
-		class="flex flex-col border hover:border-outline-gray-4 rounded-md p-4 h-full"
-		style="min-height: 150px"
-	>
-		<div class="text-lg leading-5 font-semibold mb-2 text-ink-gray-9">
-			{{ batch.title }}
-		</div>
-		<div
-			v-if="batch.seat_count && batch.seats_left > 0"
-			class="text-xs bg-green-100 text-green-700 self-start px-2 py-0.5 rounded-md"
-		>
-			{{ batch.seats_left }}
-			<span v-if="batch.seats_left > 1">
-				{{ __('Seats Left') }}
-			</span>
-			<span v-else-if="batch.seats_left == 1">
-				{{ __('Seat Left') }}
-			</span>
-		</div>
-		<div
-			v-else-if="batch.seat_count && batch.seats_left <= 0"
-			class="text-xs bg-red-100 text-red-700 self-start px-2 py-0.5 rounded-md"
-		>
-			{{ __('Sold Out') }}
-		</div>
-		<div class="short-introduction text-sm text-ink-gray-7">
-			{{ batch.description }}
-		</div>
-		<div v-if="batch.amount" class="font-semibold text-ink-gray-9 mb-4">
-			{{ batch.price }}
-		</div>
-		<div class="flex flex-col space-y-2 mt-auto">
-			<DateRange
-				:startDate="batch.start_date"
-				:endDate="batch.end_date"
-				class="text-sm text-ink-gray-7"
-			/>
-			<div class="flex items-center text-sm text-ink-gray-7">
-				<Clock class="h-4 w-4 stroke-1.5 mr-2 text-ink-gray-7" />
-				<span>
-					{{ formatTime(batch.start_time) }} - {{ formatTime(batch.end_time) }}
-				</span>
-			</div>
-			<div
-				v-if="batch.timezone"
-				class="flex items-center text-sm text-ink-gray-7"
-			>
-				<Globe class="h-4 w-4 stroke-1.5 mr-2 text-ink-gray-5" />
-				<span>
-					{{ batch.timezone }}
-				</span>
-			</div>
-		</div>
-		<div
-			v-if="batch.instructors?.length"
-			class="flex avatar-group overlap mt-4"
-		>
-			<div
-				class="h-6 mr-1"
-				:class="{ 'avatar-group overlap': batch.instructors.length > 1 }"
-			>
-				<UserAvatar
-					v-for="instructor in batch.instructors"
-					:user="instructor"
-				/>
-			</div>
-			<CourseInstructors :instructors="batch.instructors" />
-		</div>
-	</div>
-</template>
-<script setup>
-import { Badge } from 'frappe-ui'
-import { formatTime } from '../utils'
-import { Clock, BookOpen, Globe } from 'lucide-vue-next'
-import DateRange from '@/components/Common/DateRange.vue'
-import CourseInstructors from '@/components/CourseInstructors.vue'
-import UserAvatar from '@/components/UserAvatar.vue'
-
-const props = defineProps({
-	batch: {
-		type: Object,
-		default: null,
-	},
-})
-</script>
-<style>
-.short-introduction {
-	display: -webkit-box;
-	-webkit-line-clamp: 2;
-	-webkit-box-orient: vertical;
-	text-overflow: ellipsis;
-	width: 100%;
-	overflow: hidden;
-	margin: 0.25rem 0 1rem;
-	line-height: 1.5;
-}
-
-.avatar-group {
-	display: inline-flex;
-	align-items: center;
-}
-
-.avatar-group .avatar {
-	transition: margin 0.1s ease-in-out;
-}
-
-.avatar-group.overlap .avatar + .avatar {
-	margin-left: calc(-8px);
-}
-</style>

frontend/src/components/BatchCourses.vue

@@ -1,168 +0,0 @@
-<template>
-	<div>
-		<div class="flex items-center justify-between mb-4">
-			<div class="text-lg font-semibold text-ink-gray-9">
-				{{ __('Courses') }}
-			</div>
-			<Button v-if="canSeeAddButton()" @click="openCourseModal()">
-				<template #prefix>
-					<Plus class="h-4 w-4" />
-				</template>
-				{{ __('Add') }}
-			</Button>
-		</div>
-		<div v-if="courses.data?.length">
-			<ListView
-				:columns="getCoursesColumns()"
-				:rows="courses.data"
-				row-key="batch_course"
-				:options="{
-					showTooltip: false,
-					selectable: user.data?.is_student ? false : true,
-					getRowRoute: (row) => ({
-						name: 'CourseDetail',
-						params: { courseName: row.name },
-					}),
-				}"
-			>
-				<ListHeader
-					class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
-				>
-					<ListHeaderItem :item="item" v-for="item in getCoursesColumns()">
-						<template #prefix="{ item }">
-							<component
-								v-if="item.icon"
-								:is="item.icon"
-								class="h-4 w-4 stroke-1.5 ml-4"
-							/>
-						</template>
-					</ListHeaderItem>
-				</ListHeader>
-				<ListRows>
-					<ListRow :row="row" v-for="row in courses.data">
-						<template #default="{ column, item }">
-							<ListRowItem :item="row[column.key]" :align="column.align">
-								<div>
-									{{ row[column.key] }}
-								</div>
-							</ListRowItem>
-						</template>
-					</ListRow>
-				</ListRows>
-				<ListSelectBanner>
-					<template #actions="{ unselectAll, selections }">
-						<div class="flex gap-2">
-							<Button
-								variant="ghost"
-								@click="removeCourses(selections, unselectAll)"
-							>
-								<Trash2 class="h-4 w-4 stroke-1.5" />
-							</Button>
-						</div>
-					</template>
-				</ListSelectBanner>
-			</ListView>
-		</div>
-		<div v-else class="text-sm italic text-ink-gray-5">
-			{{ __('No courses added') }}
-		</div>
-		<BatchCourseModal
-			v-model="showCourseModal"
-			:batch="batch"
-			v-model:courses="courses"
-		/>
-	</div>
-</template>
-<script setup>
-import { ref, inject } from 'vue'
-import BatchCourseModal from '@/components/Modals/BatchCourseModal.vue'
-import {
-	createResource,
-	Button,
-	ListHeader,
-	ListHeaderItem,
-	ListSelectBanner,
-	ListRow,
-	ListRows,
-	ListView,
-	ListRowItem,
-} from 'frappe-ui'
-import { Plus, Trash2 } from 'lucide-vue-next'
-import { showToast } from '@/utils'
-const readOnlyMode = window.read_only_mode
-
-const showCourseModal = ref(false)
-const user = inject('$user')
-
-const props = defineProps({
-	batch: {
-		type: String,
-		required: true,
-	},
-})
-
-const courses = createResource({
-	url: 'lms.lms.utils.get_batch_courses',
-	params: {
-		batch: props.batch,
-	},
-	cache: ['batchCourses', props.batchName],
-	auto: true,
-})
-
-const openCourseModal = () => {
-	showCourseModal.value = true
-}
-
-const getCoursesColumns = () => {
-	return [
-		{
-			label: 'Title',
-			key: 'title',
-			width: 2,
-		},
-		{
-			label: 'Lessons',
-			key: 'lessons',
-			align: 'right',
-		},
-		{
-			label: 'Enrollments',
-			align: 'right',
-			key: 'enrollments',
-		},
-	]
-}
-
-const deleteCourses = createResource({
-	url: 'lms.lms.api.delete_documents',
-	makeParams(values) {
-		return {
-			doctype: 'Batch Course',
-			documents: values.courses,
-		}
-	},
-})
-
-const removeCourses = (selections, unselectAll) => {
-	deleteCourses.submit(
-		{
-			courses: Array.from(selections),
-		},
-		{
-			onSuccess(data) {
-				courses.reload()
-				showToast(__('Success'), __('Courses deleted successfully'), 'check')
-				unselectAll()
-			},
-		}
-	)
-}
-
-const canSeeAddButton = () => {
-	if (readOnlyMode) {
-		return false
-	}
-	return user.data?.is_moderator || user.data?.is_evaluator
-}
-</script>

frontend/src/components/BatchDashboard.vue

@@ -1,27 +0,0 @@
-<template>
-	<div class="space-y-10">
-		<UpcomingEvaluations
-			:batch="batch.data.name"
-			:endDate="batch.data.evaluation_end_date"
-			:courses="batch.data.courses"
-		/>
-		<Assessments :batch="batch.data.name" />
-		<StudentHeatmap />
-	</div>
-</template>
-<script setup>
-import UpcomingEvaluations from '@/components/UpcomingEvaluations.vue'
-import Assessments from '@/components/Assessments.vue'
-import StudentHeatmap from '@/components/StudentHeatmap.vue'
-
-const props = defineProps({
-	batch: {
-		type: Object,
-		default: null,
-	},
-	isStudent: {
-		type: Boolean,
-		default: false,
-	},
-})
-</script>

frontend/src/components/BatchFeedback.vue

@@ -1,244 +0,0 @@
-<template>
-	<div v-if="user.data?.is_student">
-		<div
-			v-if="feedbackList.data?.length"
-			class="bg-surface-blue-2 text-blue-700 p-2 rounded-md mb-5"
-		>
-			{{ __('Thank you for providing your feedback!') }}
-		</div>
-		<div v-else class="flex justify-between items-center mb-5">
-			<div class="text-lg font-semibold">
-				{{ __('Help Us Improve') }}
-			</div>
-			<Button @click="submitFeedback()">
-				{{ __('Submit') }}
-			</Button>
-		</div>
-		<div class="space-y-8">
-			<div class="flex items-center justify-between">
-				<Rating
-					v-for="key in ratingKeys"
-					v-model="feedback[key]"
-					:label="__(convertToTitleCase(key))"
-					:readonly="readOnly"
-				/>
-			</div>
-			<FormControl
-				v-model="feedback.feedback"
-				type="textarea"
-				:label="__('Feedback')"
-				:rows="7"
-				:readonly="readOnly"
-			/>
-		</div>
-	</div>
-
-	<div v-else-if="feedbackList.data?.length">
-		<div class="text-lg font-semibold mb-5">
-			{{ __('Average of Feedback Received') }}
-		</div>
-
-		<div class="flex items-center justify-between mb-10">
-			<Rating
-				v-for="key in ratingKeys"
-				v-model="average[key]"
-				:label="__(convertToTitleCase(key))"
-				:readonly="true"
-			/>
-		</div>
-
-		<div class="text-lg font-semibold mb-5">
-			{{ __('All Feedback') }}
-		</div>
-		<ListView
-			:columns="feedbackColumns"
-			:rows="feedbackList.data"
-			row-key="name"
-			:options="{
-				showTooltip: false,
-				rowHeight: 'h-16',
-				selectable: false,
-			}"
-		>
-			<ListHeader
-				class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
-			></ListHeader>
-			<ListRows>
-				<ListRow
-					:row="row"
-					v-for="row in feedbackList.data"
-					class="group cursor-pointer feedback-list"
-				>
-					<template #default="{ column, item }">
-						<ListRowItem
-							:item="row[column.key]"
-							:align="column.align"
-							class="text-sm"
-						>
-							<template #prefix>
-								<div v-if="column.key == 'member_name'">
-									<Avatar
-										class="flex"
-										:image="row['member_image']"
-										:label="item"
-										size="sm"
-									/>
-								</div>
-							</template>
-							<div v-if="ratingKeys.includes(column.key)">
-								<Rating v-model="row[column.key]" :readonly="true" />
-							</div>
-							<div v-else class="leading-5">
-								{{ row[column.key] }}
-							</div>
-						</ListRowItem>
-					</template>
-				</ListRow>
-			</ListRows>
-		</ListView>
-	</div>
-	<div v-else class="text-sm italic text-center text-ink-gray-7 mt-5">
-		{{ __('No feedback received yet.') }}
-	</div>
-</template>
-<script setup>
-import { computed, inject, onMounted, reactive, ref, watch } from 'vue'
-import { convertToTitleCase } from '@/utils'
-import {
-	Avatar,
-	Button,
-	createListResource,
-	FormControl,
-	ListView,
-	ListHeader,
-	ListRows,
-	ListRow,
-	ListRowItem,
-	Rating,
-} from 'frappe-ui'
-
-const user = inject('$user')
-const ratingKeys = ['content', 'instructors', 'value']
-const readOnly = ref(false)
-const average = reactive({})
-const feedback = reactive({})
-
-const props = defineProps({
-	batch: {
-		type: String,
-		required: true,
-	},
-})
-
-onMounted(() => {
-	let filters = {
-		batch: props.batch,
-	}
-	if (user.data?.is_student) {
-		filters['member'] = user.data?.name
-	}
-	feedbackList.update({
-		filters: filters,
-	})
-	feedbackList.reload()
-})
-
-const feedbackList = createListResource({
-	doctype: 'LMS Batch Feedback',
-	filters: {
-		batch: props.batch,
-	},
-	fields: [
-		'content',
-		'instructors',
-		'value',
-		'feedback',
-		'name',
-		'member',
-		'member_name',
-		'member_image',
-	],
-	cache: ['feedbackList', props.batch, user.data?.name],
-})
-
-watch(
-	() => feedbackList.data,
-	() => {
-		if (feedbackList.data.length) {
-			let data = feedbackList.data
-			readOnly.value = true
-
-			ratingKeys.forEach((key) => {
-				average[key] = 0
-			})
-
-			data.forEach((row) => {
-				Object.keys(row).forEach((key) => {
-					if (ratingKeys.includes(key)) row[key] = row[key] * 5
-					feedback[key] = row[key]
-				})
-				ratingKeys.forEach((key) => {
-					average[key] += row[key]
-				})
-			})
-			Object.keys(average).forEach((key) => {
-				average[key] = average[key] / data.length
-			})
-		}
-	}
-)
-
-const submitFeedback = () => {
-	ratingKeys.forEach((key) => {
-		feedback[key] = feedback[key] / 5
-	})
-	feedbackList.insert.submit(
-		{
-			member: user.data?.name,
-			batch: props.batch,
-			...feedback,
-		},
-		{
-			onSuccess: () => {
-				feedbackList.reload()
-			},
-		}
-	)
-}
-
-const feedbackColumns = computed(() => {
-	return [
-		{
-			label: 'Member',
-			key: 'member_name',
-			width: '10rem',
-		},
-		{
-			label: 'Feedback',
-			key: 'feedback',
-			width: '15rem',
-		},
-		{
-			label: 'Content',
-			key: 'content',
-			width: '9rem',
-		},
-		{
-			label: 'Instructors',
-			key: 'instructors',
-			width: '9rem',
-		},
-		{
-			label: 'Value',
-			key: 'value',
-			width: '9rem',
-		},
-	]
-})
-</script>
-<style>
-.feedback-list > button > div {
-	align-items: start;
-	padding: 0.15rem 0;
-}
-</style>

frontend/src/components/BatchOverlay.vue

@@ -1,184 +0,0 @@
-<template>
-	<div v-if="batch.data" class="border-2 rounded-md p-5 lg:w-72">
-		<div
-			v-if="batch.data.seat_count && seats_left > 0"
-			class="text-xs bg-green-100 text-green-700 float-right px-2 py-0.5 rounded-md"
-		>
-			{{ seats_left }}
-			<span v-if="seats_left > 1">
-				{{ __('Seats Left') }}
-			</span>
-			<span v-else-if="seats_left == 1">
-				{{ __('Seat Left') }}
-			</span>
-		</div>
-		<div
-			v-else-if="batch.data.seat_count && seats_left <= 0"
-			class="text-xs bg-red-100 text-red-700 float-right px-2 py-0.5 rounded-md"
-		>
-			{{ __('Sold Out') }}
-		</div>
-		<div
-			v-if="batch.data.amount"
-			class="text-lg font-semibold mb-3 text-ink-gray-9"
-		>
-			{{ formatNumberIntoCurrency(batch.data.amount, batch.data.currency) }}
-		</div>
-		<div
-			v-if="batch.data.courses.length"
-			class="flex items-center mb-3 text-ink-gray-7"
-		>
-			<BookOpen class="h-4 w-4 stroke-1.5 mr-2" />
-			<span> {{ batch.data.courses.length }} {{ __('Courses') }} </span>
-		</div>
-		<DateRange
-			:startDate="batch.data.start_date"
-			:endDate="batch.data.end_date"
-			class="mb-3"
-		/>
-		<div class="flex items-center mb-3 text-ink-gray-7">
-			<Clock class="h-4 w-4 stroke-1.5 mr-2" />
-			<span>
-				{{ formatTime(batch.data.start_time) }} -
-				{{ formatTime(batch.data.end_time) }}
-			</span>
-		</div>
-		<div v-if="batch.data.timezone" class="flex items-center text-ink-gray-7">
-			<Globe class="h-4 w-4 stroke-1.5 mr-2" />
-			<span>
-				{{ batch.data.timezone }}
-			</span>
-		</div>
-		<div v-if="!readOnlyMode">
-			<router-link
-				v-if="isModerator || isStudent"
-				:to="{
-					name: 'Batch',
-					params: {
-						batchName: batch.data.name,
-					},
-				}"
-			>
-				<Button variant="solid" class="w-full mt-4">
-					<span>
-						{{ isModerator ? __('Manage Batch') : __('Visit Batch') }}
-					</span>
-				</Button>
-			</router-link>
-			<router-link
-				:to="{
-					name: 'Billing',
-					params: {
-						type: 'batch',
-						name: batch.data.name,
-					},
-				}"
-				v-else-if="
-					batch.data.paid_batch &&
-					batch.data.seats_left > 0 &&
-					batch.data.accept_enrollments
-				"
-			>
-				<Button v-if="!isStudent" class="w-full mt-4" variant="solid">
-					<span>
-						{{ __('Register Now') }}
-					</span>
-				</Button>
-			</router-link>
-			<Button
-				variant="solid"
-				class="w-full mt-2"
-				v-else-if="
-					batch.data.allow_self_enrollment &&
-					batch.data.seats_left &&
-					batch.data.accept_enrollments
-				"
-				@click="enrollInBatch()"
-			>
-				{{ __('Enroll Now') }}
-			</Button>
-			<router-link
-				v-if="isModerator"
-				:to="{
-					name: 'BatchForm',
-					params: {
-						batchName: batch.data.name,
-					},
-				}"
-			>
-				<Button class="w-full mt-2">
-					<span>
-						{{ __('Edit') }}
-					</span>
-				</Button>
-			</router-link>
-		</div>
-	</div>
-</template>
-<script setup>
-import { inject, computed } from 'vue'
-import { Badge, Button, createResource } from 'frappe-ui'
-import { BookOpen, Clock, Globe } from 'lucide-vue-next'
-import { formatNumberIntoCurrency, formatTime, showToast } from '@/utils'
-import DateRange from '@/components/Common/DateRange.vue'
-import { useRouter } from 'vue-router'
-
-const router = useRouter()
-const user = inject('$user')
-const readOnlyMode = window.read_only_mode
-
-const props = defineProps({
-	batch: {
-		type: Object,
-		default: null,
-	},
-})
-
-const enroll = createResource({
-	url: 'lms.lms.utils.enroll_in_batch',
-	makeParams(values) {
-		return {
-			batch: props.batch.data.name,
-		}
-	},
-})
-
-const enrollInBatch = () => {
-	if (!user.data) {
-		window.location.href = `/login?redirect-to=/batches/details/${props.batch.data.name}`
-	}
-	enroll.submit(
-		{},
-		{
-			onSuccess(data) {
-				showToast(
-					__('Success'),
-					__('You have been enrolled in this batch'),
-					'check'
-				)
-				router.push({
-					name: 'Batch',
-					params: {
-						batchName: props.batch.data.name,
-					},
-				})
-			},
-		}
-	)
-}
-
-const seats_left = computed(() => {
-	if (props.batch.data?.seat_count) {
-		return props.batch.data?.seat_count - props.batch.data?.students?.length
-	}
-	return null
-})
-
-const isStudent = computed(() => {
-	return props.batch.data?.students?.includes(user.data?.name)
-})
-
-const isModerator = computed(() => {
-	return user.data?.is_moderator
-})
-</script>

frontend/src/components/BatchStudents.vue

@@ -1,447 +0,0 @@
-<template>
-	<div class="">
-		<div class="w-full flex items-center justify-between pb-4">
-			<div class="font-medium text-ink-gray-7">
-				{{ __('Statistics') }}
-			</div>
-		</div>
-		<div class="grid grid-cols-4 gap-5 mb-8">
-			<div
-				class="flex items-center border py-2 px-3 rounded-md text-ink-gray-7"
-			>
-				<div class="p-2 rounded-md bg-surface-gray-2 mr-3">
-					<User class="w-5 h-5 stroke-1.5" />
-				</div>
-				<div class="flex items-center space-x-2">
-					<span class="font-semibold">
-						{{ students.data?.length }}
-					</span>
-					<span class="">
-						{{ __('Students') }}
-					</span>
-				</div>
-			</div>
-
-			<div
-				class="flex items-center border py-2 px-3 rounded-md text-ink-gray-7"
-			>
-				<div class="p-2 rounded-md bg-surface-gray-2 mr-3">
-					<GraduationCap class="w-5 h-5 stroke-1.5" />
-				</div>
-				<div class="flex items-center space-x-2">
-					<span class="font-semibold">
-						{{ certificationCount.data }}
-					</span>
-					<span class="">
-						{{ __('Certified') }}
-					</span>
-				</div>
-			</div>
-
-			<div
-				class="flex items-center border py-2 px-3 rounded-md text-ink-gray-7"
-			>
-				<div class="p-2 rounded-md bg-surface-gray-2 mr-3">
-					<BookOpen class="w-5 h-5 stroke-1.5" />
-				</div>
-				<div class="flex items-center space-x-2">
-					<span class="font-semibold">
-						{{ batch.courses?.length }}
-					</span>
-					<span>
-						{{ __('Courses') }}
-					</span>
-				</div>
-			</div>
-
-			<div
-				class="flex items-center border py-2 px-3 rounded-md text-ink-gray-7"
-			>
-				<div class="p-2 rounded-md bg-surface-gray-2 mr-3">
-					<ShieldCheck class="w-5 h-5 stroke-1.5" />
-				</div>
-				<div class="flex items-center space-x-2">
-					<span class="font-semibold">
-						{{ assessmentCount }}
-					</span>
-					<span>
-						{{ __('Assessments') }}
-					</span>
-				</div>
-			</div>
-		</div>
-		<div v-if="showProgressChart" class="mb-8">
-			<div class="text-ink-gray-7 font-medium">
-				{{ __('Progress') }}
-			</div>
-			<ApexChart
-				:options="chartOptions"
-				:series="chartData"
-				type="bar"
-				:height="chartData[0].data.length * 30 + 100"
-			/>
-			<div
-				class="flex items-center justify-center text-sm text-ink-gray-7 space-x-4"
-			>
-				<div class="flex items-center space-x-2">
-					<div
-						class="w-3 h-3 rounded-sm"
-						:style="{ 'background-color': theme.colors.green[600] }"
-					></div>
-					<div>
-						{{ __('Courses') }}
-					</div>
-				</div>
-				<div class="flex items-center space-x-2">
-					<div
-						class="w-3 h-3 rounded-sm"
-						:style="{ 'background-color': theme.colors.blue[600] }"
-					></div>
-					<div>
-						{{ __('Assessments') }}
-					</div>
-				</div>
-			</div>
-		</div>
-	</div>
-
-	<div>
-		<div class="flex items-center justify-between mb-4">
-			<div class="text-ink-gray-7 font-medium">
-				{{ __('Students') }}
-			</div>
-			<Button v-if="!readOnlyMode" @click="openStudentModal()">
-				<template #prefix>
-					<Plus class="h-4 w-4" />
-				</template>
-				{{ __('Add') }}
-			</Button>
-		</div>
-
-		<div v-if="students.data?.length">
-			<ListView
-				:columns="getStudentColumns()"
-				:rows="students.data"
-				row-key="name"
-				:options="{
-					showTooltip: false,
-				}"
-			>
-				<ListHeader
-					class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
-				>
-					<ListHeaderItem
-						:item="item"
-						v-for="item in getStudentColumns()"
-						:title="item.label"
-					>
-						<template #prefix="{ item }">
-							<FeatherIcon
-								v-if="item.icon"
-								:name="item.icon"
-								class="h-4 w-4 stroke-1.5"
-							/>
-						</template>
-					</ListHeaderItem>
-				</ListHeader>
-				<ListRows>
-					<ListRow
-						:row="row"
-						v-for="row in students.data"
-						class="group cursor-pointer"
-						@click="openStudentProgressModal(row)"
-					>
-						<template #default="{ column, item }">
-							<ListRowItem
-								:item="row[column.key]"
-								:align="column.align"
-								class="text-sm"
-							>
-								<template #prefix>
-									<div v-if="column.key == 'full_name'">
-										<Avatar
-											class="flex items-center"
-											:image="row['user_image']"
-											:label="item"
-											size="sm"
-										/>
-									</div>
-								</template>
-								<div
-									v-if="column.key == 'progress'"
-									class="flex items-center space-x-4 w-full"
-								>
-									<ProgressBar :progress="row[column.key]" size="sm" />
-									<div class="text-xs">{{ row[column.key] }}%</div>
-								</div>
-								<div v-else>
-									{{ row[column.key] }}
-								</div>
-							</ListRowItem>
-						</template>
-					</ListRow>
-				</ListRows>
-				<ListSelectBanner>
-					<template #actions="{ unselectAll, selections }">
-						<div class="flex gap-2">
-							<Button
-								variant="ghost"
-								@click="removeStudents(selections, unselectAll)"
-							>
-								<Trash2 class="h-4 w-4 stroke-1.5" />
-							</Button>
-						</div>
-					</template>
-				</ListSelectBanner>
-			</ListView>
-		</div>
-		<div v-else class="text-sm italic text-ink-gray-5">
-			{{ __('There are no students in this batch.') }}
-		</div>
-	</div>
-
-	<StudentModal
-		:batch="props.batch.name"
-		v-model="showStudentModal"
-		v-model:reloadStudents="students"
-	/>
-	<BatchStudentProgress
-		:student="selectedStudent"
-		v-model="showStudentProgressModal"
-	/>
-</template>
-<script setup>
-import {
-	Avatar,
-	Button,
-	createResource,
-	FeatherIcon,
-	ListHeader,
-	ListHeaderItem,
-	ListSelectBanner,
-	ListRow,
-	ListRows,
-	ListView,
-	ListRowItem,
-} from 'frappe-ui'
-import {
-	BookOpen,
-	GraduationCap,
-	Plus,
-	ShieldCheck,
-	Trash2,
-	User,
-} from 'lucide-vue-next'
-import { ref, watch } from 'vue'
-import StudentModal from '@/components/Modals/StudentModal.vue'
-import { showToast } from '@/utils'
-import ProgressBar from '@/components/ProgressBar.vue'
-import BatchStudentProgress from '@/components/Modals/BatchStudentProgress.vue'
-import ApexChart from 'vue3-apexcharts'
-import { theme } from '@/utils/theme'
-
-const showStudentModal = ref(false)
-const showStudentProgressModal = ref(false)
-const selectedStudent = ref(null)
-const chartData = ref(null)
-const chartOptions = ref(null)
-const showProgressChart = ref(false)
-const assessmentCount = ref(0)
-const readOnlyMode = window.read_only_mode
-
-const props = defineProps({
-	batch: {
-		type: Object,
-		default: null,
-	},
-})
-
-const students = createResource({
-	url: 'lms.lms.utils.get_batch_students',
-	cache: ['students', props.batch.name],
-	params: {
-		batch: props.batch?.name,
-	},
-	auto: true,
-	onSuccess(data) {
-		chartData.value = getChartData()
-		showProgressChart.value =
-			data.length && (props.batch?.courses?.length || assessmentCount.value)
-	},
-})
-
-const getStudentColumns = () => {
-	let columns = [
-		{
-			label: 'Full Name',
-			key: 'full_name',
-			width: '20rem',
-			icon: 'user',
-		},
-		{
-			label: 'Progress',
-			key: 'progress',
-			width: '15rem',
-			icon: 'activity',
-		},
-		{
-			label: 'Last Active',
-			key: 'last_active',
-			width: '10rem',
-			align: 'center',
-			icon: 'clock',
-		},
-	]
-
-	return columns
-}
-
-const openStudentModal = () => {
-	showStudentModal.value = true
-}
-
-const openStudentProgressModal = (row) => {
-	showStudentProgressModal.value = true
-	selectedStudent.value = row
-}
-
-const deleteStudents = createResource({
-	url: 'lms.lms.api.delete_documents',
-	makeParams(values) {
-		return {
-			doctype: 'LMS Batch Enrollment',
-			documents: values.students,
-		}
-	},
-})
-
-const removeStudents = (selections, unselectAll) => {
-	deleteStudents.submit(
-		{
-			students: Array.from(selections),
-		},
-		{
-			onSuccess(data) {
-				students.reload()
-				showToast(__('Success'), __('Students deleted successfully'), 'check')
-				unselectAll()
-			},
-		}
-	)
-}
-
-const getChartData = () => {
-	let categories = {}
-
-	if (!students.data?.length) return []
-
-	Object.keys(students.data[0].courses).forEach((course) => {
-		categories[course] = {
-			value: 0,
-			type: 'course',
-			label: course,
-		}
-	})
-
-	Object.keys(students.data?.[0].assessments).forEach((assessment) => {
-		categories[assessment] = {
-			value: 0,
-			type: 'assessment',
-			label: assessment,
-		}
-	})
-
-	students.data.forEach((student) => {
-		Object.keys(student.courses).forEach((course) => {
-			if (student.courses[course] === 100) {
-				categories[course].value += 1
-			}
-		})
-
-		Object.keys(student.assessments).forEach((assessment) => {
-			if (student.assessments[assessment].result === 'Pass') {
-				categories[assessment].value += 1
-			}
-		})
-	})
-
-	chartOptions.value = getChartOptions(categories)
-	return [
-		{
-			name: __('Completed by Students'),
-			data: Object.values(categories).map((item) => item.value),
-		},
-	]
-}
-
-const getChartOptions = (categories) => {
-	const courseColor = theme.colors.green[700]
-	const assessmentColor = theme.colors.blue[700]
-	const maxY =
-		students.data?.length % 5
-			? students.data?.length + (5 - (students.data?.length % 5))
-			: students.data?.length
-
-	return {
-		chart: {
-			type: 'bar',
-			toolbar: {
-				show: false,
-			},
-		},
-		plotOptions: {
-			bar: {
-				distributed: true,
-				borderRadius: 3,
-				borderRadiusApplication: 'end',
-				horizontal: true,
-				barHeight: '40%',
-			},
-		},
-		colors: Object.values(categories).map((item) =>
-			item.type === 'course' ? courseColor : assessmentColor
-		),
-		xaxis: {
-			categories: Object.values(categories).map((item) => item.label),
-			labels: {
-				style: {
-					fontSize: '10px',
-				},
-				rotate: 0,
-				formatter: function (value) {
-					return value.length > 30 ? `${value.substring(0, 30)}...` : value
-				},
-			},
-		},
-		yaxis: {
-			max: maxY,
-			min: 0,
-			stepSize: 10,
-			tickAmount: maxY / 5,
-			/* reversed: true */
-		},
-	}
-}
-
-watch(students, () => {
-	if (students.data?.length) {
-		assessmentCount.value = Object.keys(students.data?.[0].assessments).length
-	}
-})
-
-const certificationCount = createResource({
-	url: 'frappe.client.get_count',
-	params: {
-		doctype: 'LMS Certificate',
-		filters: {
-			batch_name: props.batch.name,
-		},
-	},
-	auto: true,
-})
-</script>
-<style>
-.apexcharts-legend {
-	display: none !important;
-}
-</style>

frontend/src/components/BrandSettings.vue

@@ -1,92 +0,0 @@
-<template>
-	<div class="flex flex-col justify-between min-h-0">
-		<div>
-			<div class="flex items-center justify-between">
-				<div class="font-semibold mb-1 text-ink-gray-9">
-					{{ __(label) }}
-				</div>
-				<Badge
-					v-if="isDirty"
-					:label="__('Not Saved')"
-					variant="subtle"
-					theme="orange"
-				/>
-			</div>
-			<div class="text-xs text-ink-gray-5">
-				{{ __(description) }}
-			</div>
-		</div>
-		<div class="overflow-y-auto">
-			<SettingFields :fields="fields" :data="data.data" />
-			<div class="flex flex-row-reverse mt-auto">
-				<Button variant="solid" :loading="saveSettings.loading" @click="update">
-					{{ __('Update') }}
-				</Button>
-			</div>
-		</div>
-	</div>
-</template>
-<script setup>
-import { createResource, Button, Badge } from 'frappe-ui'
-import SettingFields from '@/components/SettingFields.vue'
-import { watch, ref } from 'vue'
-
-const isDirty = ref(false)
-
-const props = defineProps({
-	fields: {
-		type: Array,
-		required: true,
-	},
-	data: {
-		type: Object,
-		required: true,
-	},
-	label: {
-		type: String,
-		required: true,
-	},
-	description: {
-		type: String,
-	},
-})
-
-const saveSettings = createResource({
-	url: 'frappe.client.set_value',
-	makeParams(values) {
-		return {
-			doctype: 'Website Settings',
-			name: 'Website Settings',
-			fieldname: values.fields,
-		}
-	},
-})
-
-const update = () => {
-	let fieldsToSave = {}
-	let imageFields = ['favicon', 'banner_image', 'footer_logo']
-	props.fields.forEach((f) => {
-		if (imageFields.includes(f.name)) {
-			fieldsToSave[f.name] = f.value ? f.value.file_url : null
-		} else {
-			fieldsToSave[f.name] = f.value
-		}
-	})
-	saveSettings.submit(
-		{
-			fields: fieldsToSave,
-		},
-		{
-			onSuccess(data) {
-				isDirty.value = false
-			},
-		}
-	)
-}
-
-watch(props.data, (newData) => {
-	if (newData && !isDirty.value) {
-		isDirty.value = true
-	}
-})
-</script>

frontend/src/components/Categories.vue

@@ -1,130 +0,0 @@
-<template>
-	<div class="flex flex-col min-h-0">
-		<div class="flex items-center justify-between">
-			<div class="text-xl font-semibold mb-5 text-ink-gray-9">
-				{{ label }}
-			</div>
-			<Button @click="() => showCategoryForm()">
-				<template #icon>
-					<Plus v-if="!showForm" class="h-3 w-3 stroke-1.5" />
-					<X v-else class="h-3 w-3 stroke-1.5" />
-				</template>
-			</Button>
-		</div>
-
-		<div
-			v-if="showForm"
-			class="flex items-center justify-between my-4 space-x-2"
-		>
-			<FormControl
-				ref="categoryInput"
-				v-model="category"
-				:placeholder="__('Category Name')"
-				class="flex-1"
-			/>
-			<Button @click="addCategory()" variant="subtle">
-				{{ __('Add') }}
-			</Button>
-		</div>
-
-		<div class="overflow-y-scroll">
-			<div class="text-base divide-y space-y-2">
-				<FormControl
-					:value="cat.category"
-					type="text"
-					v-for="cat in categories.data"
-					class=""
-					@change.stop="(e) => update(cat.name, e.target.value)"
-				/>
-			</div>
-		</div>
-	</div>
-</template>
-<script setup>
-import {
-	Button,
-	FormControl,
-	createListResource,
-	createResource,
-	debounce,
-} from 'frappe-ui'
-import { Plus, X } from 'lucide-vue-next'
-import { ref } from 'vue'
-
-const showForm = ref(false)
-const category = ref(null)
-const categoryInput = ref(null)
-
-const props = defineProps({
-	label: {
-		type: String,
-		required: true,
-	},
-	description: {
-		type: String,
-		default: '',
-	},
-})
-
-const categories = createListResource({
-	doctype: 'LMS Category',
-	fields: ['name', 'category'],
-	auto: true,
-})
-
-const newCategory = createResource({
-	url: 'frappe.client.insert',
-	makeParams(values) {
-		return {
-			doc: {
-				doctype: 'LMS Category',
-				category: category.value,
-			},
-		}
-	},
-})
-
-const addCategory = () => {
-	newCategory.submit(
-		{},
-		{
-			onSuccess(data) {
-				categories.reload()
-				category.value = null
-			},
-		}
-	)
-}
-
-const showCategoryForm = () => {
-	showForm.value = !showForm.value
-	setTimeout(() => {
-		categoryInput.value.$el.querySelector('input').focus()
-	}, 0)
-}
-
-const updateCategory = createResource({
-	url: 'frappe.client.rename_doc',
-	makeParams(values) {
-		return {
-			doctype: 'LMS Category',
-			old_name: values.name,
-			new_name: values.category,
-		}
-	},
-})
-
-const update = (name, value) => {
-	updateCategory.submit(
-		{
-			name: name,
-			category: value,
-		},
-		{
-			onSuccess() {
-				categories.reload()
-			},
-		}
-	)
-}
-</script>

frontend/src/components/CertificationLinks.vue

@@ -1,85 +0,0 @@
-<template>
-	<Button
-		v-if="certification.data && certification.data.certificate"
-		@click="downloadCertificate"
-		class=""
-	>
-		<template #prefix>
-			<GraduationCap class="size-4 stroke-1.5" />
-		</template>
-		{{ __('View Certificate') }}
-	</Button>
-	<div
-		v-else-if="
-			certification.data &&
-			certification.data.membership &&
-			certification.data.paid_certificate &&
-			user.data?.is_student
-		"
-	>
-		<router-link
-			v-if="!certification.data.membership.purchased_certificate"
-			:to="{
-				name: 'Billing',
-				params: {
-					type: 'certificate',
-					name: courseName,
-				},
-			}"
-		>
-			<Button class="w-full">
-				<template #prefix>
-					<GraduationCap class="size-4 stroke-1.5" />
-				</template>
-				{{ __('Get Certified') }}
-			</Button>
-		</router-link>
-		<router-link
-			v-else-if="!certification.data.membership.certificate"
-			:to="{
-				name: 'CourseCertification',
-				params: {
-					courseName: courseName,
-				},
-			}"
-		>
-			<Button class="w-full">
-				<template #prefix>
-					<GraduationCap class="size-4 stroke-1.5" />
-				</template>
-				{{ __('Get Certified') }}
-			</Button>
-		</router-link>
-	</div>
-</template>
-<script setup>
-import { Button, createResource } from 'frappe-ui'
-import { inject } from 'vue'
-import { GraduationCap } from 'lucide-vue-next'
-
-const user = inject('$user')
-
-const props = defineProps({
-	courseName: {
-		type: String,
-		required: true,
-	},
-})
-
-const certification = createResource({
-	url: 'lms.lms.api.get_certification_details',
-	params: {
-		course: props.courseName,
-	},
-	auto: user.data ? true : false,
-	cache: ['certificationData', user.data?.name],
-})
-
-const downloadCertificate = () => {
-	window.open(
-		`/api/method/frappe.utils.print_format.download_pdf?doctype=LMS+Certificate&name=${
-			certification.data.certificate.name
-		}&format=${encodeURIComponent(certification.data.certificate.template)}`
-	)
-}
-</script>

frontend/src/components/Common/DateRange.vue

@@ -1,22 +0,0 @@
-<template>
-	<div class="flex items-center text-ink-gray-7">
-		<Calendar class="h-4 w-4 stroke-1.5 mr-2" />
-		<span>
-			{{ getFormattedDateRange(props.startDate, props.endDate) }}
-		</span>
-	</div>
-</template>
-
-<script setup>
-import { Calendar } from 'lucide-vue-next'
-import { getFormattedDateRange } from '@/utils'
-
-const props = defineProps({
-	startDate: {
-		type: String,
-	},
-	endDate: {
-		type: String,
-	},
-})
-</script>