MIDNIGHT/enlight-lms
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1741 from pateljannat/fui-upgrade

Browse Source 
chore: upgraded frappe ui and made relevant changes
This commit is contained in:
Jannat Patel
2025-09-25 18:30:15 +05:30
committed by GitHub
parent 27ed95b044 84a703bb50
commit 6c19cdc729
18 changed files with 1892 additions and 427 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
cypress/e2e/batch_creation.cy.js
View File

@@ -10,11 +10,11 @@ describe("Batch Creation", () => {
cy.get("span").contains("Settings").click(); cy.get("span").contains("Settings").click();
// Add a new member // Add a new member
cy.get('[id^="headlessui-dialog-panel-v-"]') cy.get("[data-dismissable-layer]")
.find("span") .find("span")
.contains(/^Members$/) .contains(/^Members$/)
.click(); .click();
cy.get('[id^="headlessui-dialog-panel-v-"]') cy.get("[data-dismissable-layer]")
.find("button") .find("button")
.contains("New") .contains("New")
.click(); .click();
@@ -28,12 +28,12 @@ describe("Batch Creation", () => {
cy.get("button").contains("Add").click(); cy.get("button").contains("Add").click();
// Add evaluator // Add evaluator
cy.get('[id^="headlessui-dialog-panel-v-"]') cy.get("[data-dismissable-layer]")
.find("span") .find("span")
.contains(/^Evaluators$/) .contains(/^Evaluators$/)
.click(); .click();
cy.get('[id^="headlessui-dialog-panel-v-"]') cy.get("[data-dismissable-layer]")
.find("button") .find("button")
.contains("New") .contains("New")
.click(); .click();
@@ -156,11 +156,7 @@ describe("Batch Creation", () => {
/* Add student to batch */ /* Add student to batch */
cy.get("button").contains("Add").click(); cy.get("button").contains("Add").click();
cy.get('div[id^="headlessui-dialog-panel-v-"]') cy.get('div[role="dialog"]').first().find("button").eq(1).click();
.first()
.find("button")
.eq(1)
.click();
cy.get("input[id^='headlessui-combobox-input-v-']").type(randomEmail); cy.get("input[id^='headlessui-combobox-input-v-']").type(randomEmail);
cy.get("div").contains(randomEmail).click(); cy.get("div").contains(randomEmail).click();
cy.get("button").contains("Submit").click(); cy.get("button").contains("Submit").click();

4
cypress/e2e/course_creation.cy.js
View File

@@ -76,7 +76,7 @@ describe("Course Creation", () => {
cy.button("Add Chapter").click(); cy.button("Add Chapter").click();
cy.wait(1000); cy.wait(1000);
cy.get("[id^=headlessui-dialog-panel-") cy.get("[data-dismissable-layer]")
.should("be.visible") .should("be.visible")
.within(() => { .within(() => {
cy.get("label").contains("Title").type("Test Chapter"); cy.get("label").contains("Title").type("Test Chapter");
@@ -143,7 +143,7 @@ describe("Course Creation", () => {
cy.get("span").contains("Community").click(); cy.get("span").contains("Community").click();
cy.button("New Question").click(); cy.button("New Question").click();
cy.wait(500); cy.wait(500);
cy.get("[id^=headlessui-dialog-panel-").within(() => { cy.get("[data-dismissable-layer]").within(() => {
cy.get("label").contains("Title").type("Test Discussion"); cy.get("label").contains("Title").type("Test Discussion");
cy.get("div[contenteditable=true]").invoke( cy.get("div[contenteditable=true]").invoke(
"text", "text",

2
frappe-ui

Submodule frappe-ui updated: 8cd9b06a5e...c9a0fc937c

2
frontend/components.d.ts vendored
View File

@@ -10,6 +10,7 @@ declare module 'vue' {
export interface GlobalComponents { export interface GlobalComponents {
Annoucements: typeof import('./src/components/Annoucements.vue')['default'] Annoucements: typeof import('./src/components/Annoucements.vue')['default']
AnnouncementModal: typeof import('./src/components/Modals/AnnouncementModal.vue')['default'] AnnouncementModal: typeof import('./src/components/Modals/AnnouncementModal.vue')['default']
AppHeader: typeof import('./src/components/AppHeader.vue')['default']
Apps: typeof import('./src/components/Apps.vue')['default'] Apps: typeof import('./src/components/Apps.vue')['default']
AppSidebar: typeof import('./src/components/AppSidebar.vue')['default'] AppSidebar: typeof import('./src/components/AppSidebar.vue')['default']
AssessmentModal: typeof import('./src/components/Modals/AssessmentModal.vue')['default'] AssessmentModal: typeof import('./src/components/Modals/AssessmentModal.vue')['default']
@@ -71,6 +72,7 @@ declare module 'vue' {
InviteIcon: typeof import('./src/components/Icons/InviteIcon.vue')['default'] InviteIcon: typeof import('./src/components/Icons/InviteIcon.vue')['default']
JobApplicationModal: typeof import('./src/components/Modals/JobApplicationModal.vue')['default'] JobApplicationModal: typeof import('./src/components/Modals/JobApplicationModal.vue')['default']
JobCard: typeof import('./src/components/JobCard.vue')['default'] JobCard: typeof import('./src/components/JobCard.vue')['default']
LayoutHeader: typeof import('./src/components/LayoutHeader.vue')['default']
LessonContent: typeof import('./src/components/LessonContent.vue')['default'] LessonContent: typeof import('./src/components/LessonContent.vue')['default']
LessonHelp: typeof import('./src/components/LessonHelp.vue')['default'] LessonHelp: typeof import('./src/components/LessonHelp.vue')['default']
Link: typeof import('./src/components/Controls/Link.vue')['default'] Link: typeof import('./src/components/Controls/Link.vue')['default']

2
frontend/index.html
View File

@@ -213,7 +213,7 @@
<meta name="twitter:image" content="{{ meta.image }}" /> <meta name="twitter:image" content="{{ meta.image }}" />
<meta name="twitter:description" content="{{ meta.description }}" /> <meta name="twitter:description" content="{{ meta.description }}" />
</head> </head>
<body> <body class="sm:overscroll-y-none no-scrollbar">
<div id="app"> <div id="app">
<div id="seo-content"> <div id="seo-content">
<h1>{{ meta.title }}</h1> <h1>{{ meta.title }}</h1>

2
frontend/package.json
View File

@@ -32,7 +32,7 @@
"dayjs": "^1.11.6", "dayjs": "^1.11.6",
"dompurify": "^3.2.6", "dompurify": "^3.2.6",
"feather-icons": "^4.28.0", "feather-icons": "^4.28.0",
"frappe-ui": "0.1.173", "frappe-ui": "^0.1.200",
"highlight.js": "^11.11.1", "highlight.js": "^11.11.1",
"lucide-vue-next": "^0.383.0", "lucide-vue-next": "^0.383.0",
"markdown-it": "^14.0.0", "markdown-it": "^14.0.0",

6
frontend/src/App.vue
View File

@@ -1,9 +1,7 @@
<template> <template>
<FrappeUIProvider> <FrappeUIProvider>
<Layout> <Layout class="isolate text-base">
<div class="text-base"> <router-view />
<router-view />
</div>
</Layout> </Layout>
<InstallPrompt v-if="isMobile" /> <InstallPrompt v-if="isMobile" />
<Dialogs /> <Dialogs />

5
frontend/src/components/AppHeader.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<div class="flex border-b sticky pr-5">
<div id="app-header" class="flex-1"></div>
</div>
</template>

5
frontend/src/components/AppSidebar.vue
View File

@@ -594,6 +594,11 @@ const articles = ref([
{ name: 'create-a-live-class', title: __('Create a live class') }, { name: 'create-a-live-class', title: __('Create a live class') },
], ],
}, },
{
title: __('Learning Paths'),
opened: false,
subArticles: [{ name: 'add-a-program', title: __('Add a program') }],
},
{ {
title: __('Assessments'), title: __('Assessments'),
opened: false, opened: false,

2
frontend/src/components/Controls/Autocomplete.vue
View File

@@ -37,7 +37,7 @@
</slot> </slot>
</template> </template>
<template #body="{ isOpen }"> <template #body="{ isOpen }">
<div v-show="isOpen"> <div v-show="isOpen" class="">
<div <div
class="mt-1 rounded-lg bg-surface-white py-1 text-base border-2" class="mt-1 rounded-lg bg-surface-white py-1 text-base border-2"
> >

19
frontend/src/components/DesktopLayout.vue
View File

@@ -1,19 +1,14 @@
<template> <template>
<div class="relative flex h-full flex-col"> <div class="flex h-screen w-screen">
<div class="h-full flex-1"> <div class="h-full border-r bg-surface-menu-bar">
<div class="flex h-screen text-base bg-surface-white"> <AppSidebar />
<div </div>
class="relative block min-h-0 flex-shrink-0 overflow-hidden hover:overflow-auto" <div class="flex-1 flex flex-col h-full overflow-auto bg-surface-white">
> <slot />
<AppSidebar />
</div>
<div class="w-full overflow-auto" id="scrollContainer">
<slot />
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import AppSidebar from './AppSidebar.vue' import AppSidebar from './AppSidebar.vue'
import AppHeader from './AppHeader.vue'
</script> </script>

25
frontend/src/components/LayoutHeader.vue Normal file
View File

@@ -0,0 +1,25 @@
<template>
<Teleport to="#app-header" v-if="showHeader">
<slot>
<header
class="flex h-10.5 items-center justify-between py-[7px] sm:pl-5 pl-2"
>
<div class="flex items-center gap-2">
<slot name="left-header" />
</div>
<div class="flex items-center gap-2">
<slot name="right-header" class="flex items-center gap-2" />
</div>
</header>
</slot>
</Teleport>
</template>
<script setup>
import { ref, nextTick } from 'vue'
const showHeader = ref(false)
nextTick(() => {
showHeader.value = true
})
</script>

96
frontend/src/components/UserDropdown.vue
View File

@@ -1,60 +1,62 @@
<template> <template>
<Dropdown class="p-2" :options="userDropdownOptions"> <div class="p-2">
<template v-slot="{ open }"> <Dropdown :options="userDropdownOptions">
<button <template v-slot="{ open }">
class="flex h-12 py-2 items-center rounded-md duration-300 ease-in-out" <button
:class=" class="flex h-12 py-2 items-center rounded-md duration-300 ease-in-out"
isCollapsed
? 'px-0 w-auto'
: open
? 'bg-surface-white shadow-sm px-2 w-52'
: 'hover:bg-surface-gray-3 px-2 w-52'
"
>
<img
v-if="branding.data?.banner_image"
:src="branding.data?.banner_image.file_url"
class="w-8 h-8 rounded flex-shrink-0"
/>
<LMSLogo v-else class="w-8 h-8 rounded flex-shrink-0" />
<div
class="flex flex-1 flex-col text-left duration-300 ease-in-out"
:class=" :class="
isCollapsed isCollapsed
? 'opacity-0 ml-0 w-0 overflow-hidden' ? 'px-0 w-auto'
: 'opacity-100 ml-2 w-auto' : open
? 'bg-surface-white shadow-sm px-2 w-52'
: 'hover:bg-surface-gray-3 px-2 w-52'
" "
> >
<div class="text-base font-medium text-ink-gray-9 leading-none"> <img
<span v-if="branding.data?.banner_image"
v-if=" :src="branding.data?.banner_image.file_url"
branding.data?.app_name && branding.data?.app_name != 'Frappe' class="w-8 h-8 rounded flex-shrink-0"
" />
<LMSLogo v-else class="w-8 h-8 rounded flex-shrink-0" />
<div
class="flex flex-1 flex-col text-left duration-300 ease-in-out"
:class="
isCollapsed
? 'opacity-0 ml-0 w-0 overflow-hidden'
: 'opacity-100 ml-2 w-auto'
"
>
<div class="text-base font-medium text-ink-gray-9 leading-none">
<span
v-if="
branding.data?.app_name && branding.data?.app_name != 'Frappe'
"
>
{{ branding.data?.app_name }}
</span>
<span v-else> Learning </span>
</div>
<div
v-if="userResource.data"
class="mt-1 text-sm text-ink-gray-7 leading-none"
> >
{{ branding.data?.app_name }} {{ convertToTitleCase(userResource.data?.full_name) }}
</span> </div>
<span v-else> Learning </span>
</div> </div>
<div <div
v-if="userResource.data" class="duration-300 ease-in-out"
class="mt-1 text-sm text-ink-gray-7 leading-none" :class="
isCollapsed
? 'opacity-0 ml-0 w-0 overflow-hidden'
: 'opacity-100 ml-2 w-auto'
"
> >
{{ convertToTitleCase(userResource.data?.full_name) }} <ChevronDown class="h-4 w-4 text-ink-gray-7" />
</div> </div>
</div> </button>
<div </template>
class="duration-300 ease-in-out" </Dropdown>
:class=" </div>
isCollapsed
? 'opacity-0 ml-0 w-0 overflow-hidden'
: 'opacity-100 ml-2 w-auto'
"
>
<ChevronDown class="h-4 w-4 text-ink-gray-7" />
</div>
</button>
</template>
</Dropdown>
<SettingsModal <SettingsModal
v-if="userResource.data?.is_moderator" v-if="userResource.data?.is_moderator"
v-model="showSettingsModal" v-model="showSettingsModal"

2
frontend/src/pages/Home/Home.vue
View File

@@ -4,7 +4,7 @@
> >
<Breadcrumbs :items="[{ label: __('Home'), route: { name: 'Home' } }]" /> <Breadcrumbs :items="[{ label: __('Home'), route: { name: 'Home' } }]" />
</header> --> </header> -->
<div class="w-full px-5 pt-10 pb-10"> <div class="w-full px-5 pt-5 pb-10">
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<div class="space-y-2"> <div class="space-y-2">
<div class="text-xl font-bold"> <div class="text-xl font-bold">

8
frontend/src/pages/ProfileEvaluationSchedule.vue
View File

@@ -4,7 +4,7 @@
<Calendar <Calendar
v-if="evaluations.data?.length" v-if="evaluations.data?.length"
:config="{ :config="{
defaultMode: 'Month', defaultMode: 'Week',
disableModes: ['Day', 'Week'], disableModes: ['Day', 'Week'],
redundantCellHeight: 100, redundantCellHeight: 100,
enableShortcuts: false, enableShortcuts: false,
@@ -87,8 +87,10 @@ const evaluations = createListResource({
mappedData.participant = d.member_name mappedData.participant = d.member_name
mappedData.id = d.name mappedData.id = d.name
mappedData.venue = d.google_meet_link mappedData.venue = d.google_meet_link
mappedData.fromDate = `${d.date} ${d.start_time}` mappedData.fromDate = `${d.date}`
mappedData.toDate = `${d.date} ${d.end_time}` mappedData.toDate = `${d.date}`
mappedData.fromTime = d.start_time
mappedData.toTime = d.end_time
mappedData.color = 'green' mappedData.color = 'green'
return mappedData return mappedData

1
frontend/src/pages/Programs/ProgramForm.vue
View File

@@ -112,6 +112,7 @@
<div class="space-x-2"> <div class="space-x-2">
<Button <Button
v-if="programMembers.data.length > 0"
@click=" @click="
() => { () => {
showProgressDialog = true showProgressDialog = true

750
frontend/yarn.lock
View File

File diff suppressed because it is too large Load Diff

1374
yarn.lock Normal file
View File

File diff suppressed because it is too large Load Diff