From 35817f44b928518f2fc41e166f816d2624c9bc44 Mon Sep 17 00:00:00 2001 From: Rotimi Best Date: Mon, 11 Sep 2023 11:47:30 +0100 Subject: [PATCH] Add new org improvements --- src/lib/components/Icons/AudienceIcon.svelte | 2 +- src/lib/components/Icons/QuizIcon.svelte | 2 +- .../components/Icons/SiteSettingsIcon.svelte | 2 +- src/lib/components/LMS/SideBar.svelte | 11 +- .../Org/AddOrgModal/AddOrgModal.svelte | 146 ++++++++++++++++++ .../components/Org/LandingPage/index.svelte | 28 ++-- src/lib/components/Org/Settings/store.ts | 6 +- src/lib/components/Org/SideBar.svelte | 14 +- src/lib/components/Org/store.js | 4 + .../components/OrgSelector/OrgSelector.svelte | 93 ++++------- .../OrgSelector/OrgSelectorItem.svelte | 17 +- src/lib/components/PageBody/index.svelte | 1 - src/lib/utils/functions/org.js | 5 - src/lib/utils/functions/org.ts | 12 ++ src/lib/utils/functions/validator.js | 17 +- src/lib/utils/services/courses/index.ts | 15 -- src/lib/utils/services/org/index.js | 7 +- src/lib/utils/store/org.ts | 2 +- src/routes/+layout.svelte | 10 +- src/routes/onboarding/+page.svelte | 6 +- src/routes/org/[slug]/courses/+page.svelte | 3 - vercel.json | 4 - 22 files changed, 269 insertions(+), 138 deletions(-) create mode 100644 src/lib/components/Org/AddOrgModal/AddOrgModal.svelte delete mode 100644 src/lib/utils/functions/org.js create mode 100644 src/lib/utils/functions/org.ts delete mode 100644 vercel.json diff --git a/src/lib/components/Icons/AudienceIcon.svelte b/src/lib/components/Icons/AudienceIcon.svelte index a0d0a620..c57cb8ae 100644 --- a/src/lib/components/Icons/AudienceIcon.svelte +++ b/src/lib/components/Icons/AudienceIcon.svelte @@ -10,6 +10,6 @@ fill-rule="evenodd" clip-rule="evenodd" d="M15 1.5V3C15.9946 3 16.9484 3.39509 17.6516 4.09835C18.3549 4.80161 18.75 5.75544 18.75 6.75C18.75 7.74456 18.3549 8.69839 17.6516 9.40165C16.9484 10.1049 15.9946 10.5 15 10.5V12C16.3924 12 17.7277 11.4469 18.7123 10.4623C19.6969 9.47774 20.25 8.14239 20.25 6.75C20.25 5.35761 19.6969 4.02226 18.7123 3.03769C17.7277 2.05312 16.3924 1.5 15 1.5ZM15 22.5H16.5V18.75C16.4984 17.3581 15.9447 16.0237 14.9605 15.0395C13.9763 14.0553 12.6419 13.5016 11.25 13.5H6.75C5.35811 13.5016 4.0237 14.0553 3.03949 15.0395C2.05527 16.0237 1.50163 17.3581 1.5 18.75V22.5H3V18.75C3.00117 17.7558 3.39664 16.8027 4.09964 16.0996C4.80265 15.3966 5.7558 15.0012 6.75 15H11.25C12.2442 15.0012 13.1973 15.3966 13.9004 16.0996C14.6034 16.8027 14.9988 17.7558 15 18.75V22.5ZM21 22.5H22.5V18.75C22.4985 17.3581 21.9448 16.0236 20.9606 15.0394C19.9764 14.0552 18.6419 13.5015 17.25 13.5V15C18.2442 15.0011 19.1974 15.3966 19.9004 16.0996C20.6034 16.8026 20.9989 17.7558 21 18.75V22.5ZM11.0834 3.63199C10.4667 3.21993 9.74168 3 9 3C8.00544 3 7.05161 3.39509 6.34835 4.09835C5.64509 4.80161 5.25 5.75544 5.25 6.75C5.25 7.49168 5.46994 8.2167 5.88199 8.83339C6.29405 9.45007 6.87972 9.93072 7.56494 10.2145C8.25016 10.4984 9.00416 10.5726 9.73159 10.4279C10.459 10.2833 11.1272 9.9261 11.6517 9.40165C12.1761 8.8772 12.5333 8.20902 12.6779 7.48159C12.8226 6.75416 12.7484 6.00016 12.4646 5.31494C12.1807 4.62971 11.7001 4.04404 11.0834 3.63199ZM6.08326 2.38478C6.94662 1.80791 7.96165 1.5 9 1.5C10.3924 1.5 11.7277 2.05312 12.7123 3.03769C13.6969 4.02226 14.25 5.35761 14.25 6.75C14.25 7.78835 13.9421 8.80339 13.3652 9.66674C12.7883 10.5301 11.9684 11.203 11.0091 11.6004C10.0498 11.9977 8.99418 12.1017 7.97578 11.8991C6.95738 11.6966 6.02192 11.1965 5.28769 10.4623C4.55347 9.72808 4.05345 8.79262 3.85088 7.77422C3.64831 6.75582 3.75227 5.70022 4.14963 4.74091C4.54699 3.7816 5.2199 2.96166 6.08326 2.38478Z" - fill="#7A797D" + fill="currentColor" /> diff --git a/src/lib/components/Icons/QuizIcon.svelte b/src/lib/components/Icons/QuizIcon.svelte index 7be5135a..f26eab80 100644 --- a/src/lib/components/Icons/QuizIcon.svelte +++ b/src/lib/components/Icons/QuizIcon.svelte @@ -8,6 +8,6 @@ > diff --git a/src/lib/components/Icons/SiteSettingsIcon.svelte b/src/lib/components/Icons/SiteSettingsIcon.svelte index 9e0db91a..f2c5db8b 100644 --- a/src/lib/components/Icons/SiteSettingsIcon.svelte +++ b/src/lib/components/Icons/SiteSettingsIcon.svelte @@ -10,6 +10,6 @@ fill-rule="evenodd" clip-rule="evenodd" d="M20.9243 6.00098H22.5001V7.50098H20.9243C20.8276 7.97046 20.6412 8.41687 20.3753 8.81573L21.4928 9.93323L20.4323 10.9937L19.3148 9.87623C18.916 10.1421 18.4696 10.3284 18.0001 10.4252V12.001H16.5001V10.4252C16.0307 10.3284 15.5842 10.142 15.1854 9.87615L14.0679 10.9937L13.0074 9.93315L14.1249 8.81565C13.8591 8.41681 13.6727 7.97043 13.576 7.50098H12.0001V6.00098H13.576C13.6727 5.53149 13.8591 5.08508 14.125 4.68623L13.0075 3.56873L14.068 2.50823L15.1855 3.62573C15.5843 3.35989 16.0307 3.17351 16.5001 3.0768V1.50098H18.0001V3.0768C18.4696 3.17352 18.916 3.35993 19.3149 3.6258L20.4324 2.5083L21.4929 3.5688L20.3754 4.6863C20.6412 5.08514 20.8276 5.53152 20.9243 6.00098ZM16.0001 8.62178C16.3701 8.86902 16.8051 9.00098 17.2501 9.00098C17.8467 9.00032 18.4186 8.76306 18.8404 8.34124C19.2622 7.91943 19.4995 7.34751 19.5001 6.75098C19.5001 6.30597 19.3682 5.87095 19.1209 5.50094C18.8737 5.13093 18.5223 4.84255 18.1112 4.67225C17.7 4.50195 17.2476 4.45739 16.8112 4.54421C16.3747 4.63103 15.9738 4.84532 15.6591 5.15999C15.3445 5.47465 15.1302 5.87557 15.0434 6.31202C14.9566 6.74848 15.0011 7.20088 15.1714 7.61201C15.3417 8.02315 15.6301 8.37455 16.0001 8.62178ZM21 16.5002V12.7502H22.5V16.5002C22.5 16.8981 22.342 17.2796 22.0607 17.5609C21.7794 17.8422 21.3978 18.0002 21 18.0002H15V21.0002H18V22.5002H6V21.0002H9V18.0002H3C2.60218 18.0002 2.22064 17.8422 1.93934 17.5609C1.65804 17.2796 1.5 16.8981 1.5 16.5002V4.50024C1.5 4.10242 1.65804 3.72089 1.93934 3.43958C2.22064 3.15828 2.60218 3.00024 3 3.00024H10.5V4.50024H3V16.5002H21ZM10.5 21.0002H13.5V18.0002H10.5V21.0002Z" - fill="#7A797D" + fill="currentColor" /> diff --git a/src/lib/components/LMS/SideBar.svelte b/src/lib/components/LMS/SideBar.svelte index 07550d25..5d88ab0a 100644 --- a/src/lib/components/LMS/SideBar.svelte +++ b/src/lib/components/LMS/SideBar.svelte @@ -1,4 +1,4 @@ - + + ($newOrgModal.open = false)} + bind:open={$newOrgModal.open} + width="w-96" + modalHeading="Create Organization" +> +
+ + + + +
+ +
+ +
 diff --git a/src/lib/components/Org/LandingPage/index.svelte b/src/lib/components/Org/LandingPage/index.svelte index 8f5c9829..f721b0a9 100644 --- a/src/lib/components/Org/LandingPage/index.svelte +++ b/src/lib/components/Org/LandingPage/index.svelte @@ -270,12 +270,14 @@

-
- {#if $courseMetaDeta.isLoading} + {#if $courseMetaDeta.isLoading} +
- {:else} +
+ {:else if $courses.length > 0} +
{#each $courses.slice(0, viewAll ? $courses.length : 3) as courseData} - {:else} - - -

No Course Published

-

- We've got great courses coming your way, stay tuned!!! -

- {/each} - {/if} -
+
+ {:else} + + +

No Course Published

+

+ We've got great courses coming your way, stay tuned!!! +

+ + {/if} {#if $courses.length > 3}
diff --git a/src/lib/components/Org/Settings/store.ts b/src/lib/components/Org/Settings/store.ts index c9a72af1..48e2769d 100644 --- a/src/lib/components/Org/Settings/store.ts +++ b/src/lib/components/Org/Settings/store.ts @@ -74,16 +74,16 @@ export let landingPageSettings: Writable = writable({ }, video: { show: true, - link: 'https://www.youtube.com/watch?v=bbVZo4Yw7pI' + link: 'https://www.youtube.com/watch?v=qqAYW7uxErI' }, - show: false + show: true }, aboutUs: { title: 'Our Story', content: 'Lorem ipsum dolor sit, amet consectetur adipisicing elit. Repudiandae, quaerat cum. Ullam similique quae dicta ipsum atque quam fugit iusto eligendi magni voluptatum aut, exercitationem deserunt vitae iste rem sunt!\nLorem ipsum, dolor sit amet consectetur adipisicing elit. Maiores obcaecati veritatis tenetur in, nihil repellat quasi cumque sed molestias id reiciendis harum doloremque minus fugit quia cum dolores quas pariatur.', imageUrl: '', - show: false + show: true }, courses: { title: 'Explore our', diff --git a/src/lib/components/Org/SideBar.svelte b/src/lib/components/Org/SideBar.svelte index 2d09ef1a..1b05b607 100644 --- a/src/lib/components/Org/SideBar.svelte +++ b/src/lib/components/Org/SideBar.svelte @@ -1,4 +1,4 @@ -
@@ -44,51 +35,25 @@
{/if} - - - null} - /> - - -
- -{#if openAddOrg} - (openAddOrg = false)} - bind:open={openAddOrg} - width="w-96" - modalHeading="Create Organization" - > -
- - -
- + {#each $orgs as org} + { + currentOrg.set(org); + goto($currentOrgPath); + open = false; + }} /> -
- -
-{/if} + {/each} + + + + {/if} + diff --git a/src/lib/components/OrgSelector/OrgSelectorItem.svelte b/src/lib/components/OrgSelector/OrgSelectorItem.svelte index 11b5997e..da34ce01 100644 --- a/src/lib/components/OrgSelector/OrgSelectorItem.svelte +++ b/src/lib/components/OrgSelector/OrgSelectorItem.svelte @@ -1,13 +1,15 @@ @@ -17,7 +19,16 @@ 'border-b border-gray-100'} {active && 'bg-primary-100 dark:bg-gray-500'}" on:click={onClick} > - {#if avatarText} + {#if avatar} + + {:else if avatarText} .root { overflow-y: auto; - overflow-x: hidden; height: calc(100vh - 127px); } .head { diff --git a/src/lib/utils/functions/org.js b/src/lib/utils/functions/org.js deleted file mode 100644 index 897e34e0..00000000 --- a/src/lib/utils/functions/org.js +++ /dev/null @@ -1,5 +0,0 @@ -export function genQuizPin() { - var minm = 100000; - var maxm = 999999; - return Math.floor(Math.random() * (maxm - minm + 1)) + minm; -} diff --git a/src/lib/utils/functions/org.ts b/src/lib/utils/functions/org.ts new file mode 100644 index 00000000..36154ed8 --- /dev/null +++ b/src/lib/utils/functions/org.ts @@ -0,0 +1,12 @@ +export function genQuizPin(): number { + var minm = 100000; + var maxm = 999999; + return Math.floor(Math.random() * (maxm - minm + 1)) + minm; +} + +export function generateSitename(orgName: string): string { + return orgName + .toLowerCase() + .replace(/\s+/g, '-') + .replace(/[^a-zA-Z0-9-]/g, ''); +} diff --git a/src/lib/utils/functions/validator.js b/src/lib/utils/functions/validator.js index 1a1e2af1..8bc4980f 100644 --- a/src/lib/utils/functions/validator.js +++ b/src/lib/utils/functions/validator.js @@ -1,4 +1,3 @@ -import get from 'lodash/get'; import isNumber from 'lodash/isNumber'; import z from 'zod'; import { validateEmail } from './validateEmail'; @@ -161,6 +160,22 @@ export const onboardingValidation = (fields = {}, step) => { return processErrors(error); }; +export const createOrgValidation = (fields = {}) => { + const schema = z.object({ + orgName: z.string().min(5, { + message: 'Must be 5 or more characters long', + invalid_type_error: 'Must not be empty' + }), + siteName: z.string().min(5, { + message: 'Must be 5 or more characters long', + invalid_type_error: 'Must not be empty' + }) + }); + const { error } = schema.safeParse(fields); + + return processErrors(error); +}; + export const createQuizValidation = (fields = {}) => { const { error } = createQuizValidationSchema.safeParse(fields); diff --git a/src/lib/utils/services/courses/index.ts b/src/lib/utils/services/courses/index.ts index 3f38a9bd..9e5b68d9 100644 --- a/src/lib/utils/services/courses/index.ts +++ b/src/lib/utils/services/courses/index.ts @@ -72,21 +72,6 @@ export async function fetchGroup(groupId: Group['id']) { }; } -export async function setProfileIdOfGroupMember(email: string, profileId: string) { - const { data, error } = await supabase - .from('groupmember') - .update({ - email: null, - profile_id: profileId - }) - .match({ email: email }); - - return { - data, - error - }; -} - export async function uploadAvatar(courseId: string, avatar: string) { const filename = `course/${courseId + Date.now()}.webp`; let logo; diff --git a/src/lib/utils/services/org/index.js b/src/lib/utils/services/org/index.js index e5bc4ba0..7767aeec 100644 --- a/src/lib/utils/services/org/index.js +++ b/src/lib/utils/services/org/index.js @@ -57,17 +57,20 @@ export async function getOrganizations(userId) { id, profile_id, role_id, + created_at, organization!organizationmember_organization_id_fkey ( id, name, siteName, avatar_url, landingpage, - theme + theme, + created_at ) ` ) - .eq('profile_id', userId); + .eq('profile_id', userId) + .order('id', { ascending: false }); const orgsArray = []; diff --git a/src/lib/utils/store/org.ts b/src/lib/utils/store/org.ts index 5878a4ca..8562dc18 100644 --- a/src/lib/utils/store/org.ts +++ b/src/lib/utils/store/org.ts @@ -3,7 +3,7 @@ import { STEPS } from '../constants/quiz'; import type { Writable } from 'svelte/store'; import type { CurrentOrg, OrgTeamMember } from '../types/org'; -export const orgs = writable([]); +export const orgs = writable([]); export const currentOrg: Writable = writable({ id: '', name: '', diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 86f3592f..40577698 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -30,14 +30,15 @@ import { getSupabase } from '$lib/utils/functions/supabase'; import { isMobile } from '$lib/utils/store/useMobile'; import { ROUTE } from '$lib/utils/constants/routes'; - import { getOrganizations, getCurrentOrg } from '$lib/utils/services/org'; + import { getOrganizations } from '$lib/utils/services/org'; import { toggleBodyByMode } from '$lib/utils/functions/app'; import { appStore } from '$lib/utils/store/app'; import { currentOrg } from '$lib/utils/store/org'; import { setTheme } from '$lib/utils/functions/theme'; + import hideNavByRoute from '$lib/utils/functions/routes/hideNavByRoute'; + import AddOrgModal from '$lib/components/Org/AddOrgModal/AddOrgModal.svelte'; import '../app.postcss'; - import hideNavByRoute from '$lib/utils/functions/routes/hideNavByRoute'; export let data; @@ -171,6 +172,8 @@ // Not on invite page or no org, go to onboarding if (isEmpty(orgRes.orgs) && !path.includes('invite')) { goto(ROUTE.ONBOARDING); + } else if (params.has('redirect')) { + goto(params.get('redirect') || ''); } else if ( ['login', 'signup', 'onboarding', 'invite'].some((r) => path.includes(r)) || path === '' // for home page @@ -220,7 +223,7 @@ !isPublicRoute($page.url.pathname) ) { console.log('No auth token and is not a public route, redirect to login', path); - return goto('/login'); + return goto('/login?redirect=/' + path); } const { data: authListener } = supabase.auth.onAuthStateChange((event, session) => { @@ -309,6 +312,7 @@
{#if isOrgPage($page.url.pathname)} +
{#if !isQuizPage($page.url.pathname)} diff --git a/src/routes/onboarding/+page.svelte b/src/routes/onboarding/+page.svelte index 5f6df51a..14bc6722 100644 --- a/src/routes/onboarding/+page.svelte +++ b/src/routes/onboarding/+page.svelte @@ -12,6 +12,7 @@ import { getOrganizations } from '$lib/utils/services/org'; import { sendWelcomeEmail } from './utils'; import { currentOrg } from '$lib/utils/store/org'; + import { generateSitename } from '$lib/utils/functions/org'; interface OnboardingField { fullname?: string; @@ -196,10 +197,7 @@ }; $: progress = Math.round((step / maxSteps) * 100); - $: fields.siteName = fields.siteName - ?.toLowerCase() - ?.replace(/\s+/g, '-') - ?.replace(/[^a-zA-Z0-9-]/g, ''); + $: fields.siteName = generateSitename(fields.siteName || ''); $: setOrgSiteName(fields.orgName, isSiteNameTouched); $: { diff --git a/src/routes/org/[slug]/courses/+page.svelte b/src/routes/org/[slug]/courses/+page.svelte index 9b3b97ae..58c09aef 100644 --- a/src/routes/org/[slug]/courses/+page.svelte +++ b/src/routes/org/[slug]/courses/+page.svelte @@ -7,7 +7,6 @@ import NewCourseModal from '$lib/components/Courses/components/NewCourseModal/index.svelte'; import PrimaryButton from '$lib/components/PrimaryButton/index.svelte'; import { courses, createCourseModal, courseMetaDeta } from '$lib/components/Courses/store'; - import { setProfileIdOfGroupMember } from '$lib/utils/services/courses'; import { currentOrg } from '$lib/utils/store/org'; import { Add } from 'carbon-icons-svelte'; import { isMobile } from '$lib/utils/store/useMobile'; @@ -25,8 +24,6 @@ if (cantFetch && typeof cantFetch === 'boolean' && !allCourses.length && orgId) { $courseMetaDeta.isLoading = true; - const updatedProfile = await setProfileIdOfGroupMember($profile.email, userId); - console.log(`updatedProfile`, updatedProfile); const coursesResult = await fetchCourses(userId, orgId); console.log(`coursesResult`, coursesResult); diff --git a/vercel.json b/vercel.json deleted file mode 100644 index 7a24fd77..00000000 --- a/vercel.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "outputDirectory": "__sapper__/export", - "public": true -} \ No newline at end of file