CLASSROOMIO-T-92: AI Powered lesson notes

src/routes/api/completion/+server.js

@@ -0,0 +1,42 @@
+import { Configuration, OpenAIApi } from 'openai-edge';
+import { OpenAIStream, StreamingTextResponse } from 'ai';
+import { OPENAI_API_KEY } from '$env/static/private';
+
+// Create an OpenAI API client (that's edge friendly!)
+const openAIConfig = new Configuration({
+  apiKey: OPENAI_API_KEY
+});
+const openai = new OpenAIApi(openAIConfig);
+
+// Set the runtime to edge for best performance
+export const config = {
+  runtime: 'edge'
+};
+
+const instruction = {
+  outline: 'lesson outline',
+  note: 'lesson note',
+  activities: 'interactive lesson activities'
+};
+
+export async function POST({ request }) {
+  const { prompt } = await request.json();
+  const { courseTitle, lessonTitle, type } = prompt;
+  console.log('prompt', prompt);
+
+  const response = await openai.createChatCompletion({
+    model: 'gpt-3.5-turbo',
+    messages: [
+      {
+        role: 'user',
+        content: `Generate a ${instruction[type]} given the course title is "${courseTitle}" and the lesson is "${lessonTitle}". Format in markdown`
+      }
+    ],
+    stream: true
+  });
+
+  // Convert the response into a friendly text-stream
+  const stream = OpenAIStream(response);
+  // Respond with the stream
+  return new StreamingTextResponse(stream);
+}

src/routes/courses/[id]/lessons/[...lessonParams]/+page.svelte

@@ -4,6 +4,7 @@
   import { fetchCourse, fetchLesson } from '$lib/utils/services/courses';
   import CheckmarkOutlineIcon from 'carbon-icons-svelte/lib/CheckmarkOutline.svelte';
   import PrimaryButton from '$lib/components/PrimaryButton/index.svelte';
+  import { VARIANTS } from '$lib/components/PrimaryButton/constants.js';
   import RoleBasedSecurity from '$lib/components/RoleBasedSecurity/index.svelte';
   import PageNav from '$lib/components/PageNav/index.svelte';
   import PageBody from '$lib/components/PageBody/index.svelte';
@@ -92,6 +93,7 @@
             <PrimaryButton
               className="mr-2"
               label={mode === MODES.edit ? 'Save' : 'Edit'}
+              variant={VARIANTS.CONTAINED_INFO}
               onClick={() => {
                 prevMode = mode;
                 mode = mode === MODES.edit ? MODES.view : MODES.edit;
@@ -114,6 +116,7 @@
           onClick={markLessonComplete}
           isLoading={isMarkingComplete}
           isDisabled={isMarkingComplete}
+          variant={VARIANTS.OUTLINED}
           className="mt-10"
         >
           <CheckmarkOutlineIcon size={24} class="carbon-icon mr-2" />