CLASSROOMIO-T-150: Add teacher to course + linear lesson content

clean up

CLASSROOMIO-T-150: Notify teacher they have been added

Make lesson content be linear on preview mode

CLASSROOMIO-T-150: Add teachers with a dropdown to course


Co-authored-by: Rotimi Best <[email protected]>


Merge-request: CLASSROOMIO-MR-69
Merged-by: Best Admin <[email protected]>

src/routes/api/email/course/welcome/+server.js

@@ -0,0 +1,55 @@
+import { render } from 'svelte-email';
+import { json } from '@sveltejs/kit';
+import WelcomeTemplate from './template.svelte';
+import { getSendgrid, SENDGRID_FROM_NOTIFY } from '$lib/utils/services/sendgrid';
+import { getSupabase } from '$lib/utils/functions/supabase';
+
+const sendgrid = getSendgrid();
+const supabase = getSupabase();
+
+export async function POST({ request }) {
+  const { to, name, orgName, courseName, orgSiteName } = await request.json();
+  const accessToken = request.headers.get('Authorization') || '';
+  console.log('/POST api/email/course/welcome', to, name, orgName);
+
+  if (!to || !name || !orgName || !courseName || !orgSiteName) {
+    return json({ success: false, message: 'Missing required fields' }, { status: 400 });
+  }
+
+  let user;
+  try {
+    const { data } = await supabase.auth.getUser(accessToken);
+    user = data.user;
+  } catch (error) {
+    console.error(error);
+  }
+
+  if (!user) {
+    return json({ success: false, message: 'Unauthenticated user' }, { status: 401 });
+  }
+
+  const origin = request.headers.get('origin');
+  const inviteLink = `${origin}/org/${orgSiteName}/courses`;
+
+  const options = {
+    from: SENDGRID_FROM_NOTIFY,
+    to,
+    subject: `You have been invited to a course in ${orgName}!`,
+    html: render({
+      template: WelcomeTemplate,
+      props: {
+        name,
+        orgName,
+        inviteLink,
+        courseName
+      }
+    })
+  };
+
+  sendgrid.send(options);
+
+  return json({
+    success: true,
+    message: 'Email sent'
+  });
+}

src/routes/api/email/course/welcome/template.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+  import EmailTemplate from '$lib/components/Email/EmailTemplate.svelte';
+  import Welcome from './welcome.svelte';
+
+  export let name = '';
+  export let orgName = '';
+  export let inviteLink = '';
+  export let courseName = '';
+</script>
+
+<EmailTemplate
+  children={Welcome}
+  props={{
+    name,
+    orgName,
+    inviteLink,
+    courseName
+  }}
+/>

src/routes/api/email/course/welcome/welcome.svelte

@@ -0,0 +1,53 @@
+<script lang="ts">
+  import { Text, Section, Button, Link } from 'svelte-email';
+
+  export let name = '';
+  export let orgName = '';
+  export let inviteLink = '';
+  export let courseName = '';
+
+  const fontFamily =
+    '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif';
+
+  const paragraph = {
+    fontFamily,
+    fontSize: '16px',
+    lineHeight: '26px'
+  };
+  const paragraphContent = {
+    ...paragraph,
+    margin: '20px 0'
+  };
+
+  const footerParagraph = {
+    ...paragraph,
+    margin: '0px'
+  };
+
+  const btnContainer = {
+    textAlign: 'center' as const
+  };
+
+  const button = {
+    fontFamily,
+    backgroundColor: '#1d4ee2',
+    borderRadius: '5px',
+    color: '#fff',
+    fontSize: '16px',
+    textDecoration: 'none',
+    textAlign: 'center' as const,
+    display: 'block'
+  };
+</script>
+
+<Text style={paragraph}>Hey {name},</Text>
+<Text style={paragraphContent}>
+  You have been given access to teach a course by {orgName}
+</Text>
+<Text style={paragraphContent}>
+  The course is titled: {courseName}
+</Text>
+
+<Section style={btnContainer}>
+  <Button pX={12} pY={12} style={button} href={inviteLink}>Open Dashboard</Button>
+</Section>

src/routes/api/email/invite/+server.js

@@ -1,7 +1,7 @@
 import { render } from 'svelte-email';
 import { json } from '@sveltejs/kit';
 import TeacherInviteTemplate from './template.svelte';
-import { getSendgrid, SENDGRID_FROM_HELP } from '$lib/utils/services/sendgrid';
+import { getSendgrid, SENDGRID_FROM_NOTIFY } from '$lib/utils/services/sendgrid';
 import { getSupabase } from '$lib/utils/functions/supabase';
 
 const sendgrid = getSendgrid();
@@ -47,7 +47,7 @@ export async function POST({ request }) {
   console.log('inviteData', inviteData);
 
   const options = {
-    from: SENDGRID_FROM_HELP,
+    from: SENDGRID_FROM_NOTIFY,
     to: email,
     subject: `Join ${name} on ClassroomIO`,
     html: render({