feat: use session access_tokens

apps/web/components/Objects/Editor/AI/AIEditorToolkit.tsx

@@ -24,6 +24,7 @@ import {
   startActivityAIChatSession,
 } from '@services/ai/ai'
 import useGetAIFeatures from '@components/AI/Hooks/useGetAIFeatures'
+import { useLHSession } from '@components/Contexts/LHSessionContext'
 
 type AIEditorToolkitProps = {
   editor: Editor
@@ -32,11 +33,11 @@ type AIEditorToolkitProps = {
 
 type AIPromptsLabels = {
   label:
-    | 'Writer'
-    | 'ContinueWriting'
-    | 'MakeLonger'
-    | 'GenerateQuiz'
-    | 'Translate'
+  | 'Writer'
+  | 'ContinueWriting'
+  | 'MakeLonger'
+  | 'GenerateQuiz'
+  | 'Translate'
   selection: string
 }
 
@@ -141,6 +142,8 @@ function AIEditorToolkit(props: AIEditorToolkitProps) {
 const UserFeedbackModal = (props: AIEditorToolkitProps) => {
   const dispatchAIEditor = useAIEditorDispatch() as any
   const aiEditorState = useAIEditor() as AIEditorStateTypes
+  const session = useLHSession() as any
+  const access_token = session.data.tokens.access_token;
 
   const handleChange = async (event: React.ChangeEvent<HTMLInputElement>) => {
     await dispatchAIEditor({
@@ -159,7 +162,7 @@ const UserFeedbackModal = (props: AIEditorToolkitProps) => {
       const response = await sendActivityAIChatMessage(
         message,
         aiEditorState.aichat_uuid,
-        props.activity.activity_uuid
+        props.activity.activity_uuid, access_token
       )
       if (response.success === false) {
         await dispatchAIEditor({ type: 'setIsNoLongerWaitingForResponse' })
@@ -191,7 +194,7 @@ const UserFeedbackModal = (props: AIEditorToolkitProps) => {
       })
       await dispatchAIEditor({ type: 'setIsWaitingForResponse' })
       const response = await startActivityAIChatSession(
-        message,
+        message, access_token,
         props.activity.activity_uuid
       )
       if (response.success === false) {

apps/web/components/Objects/Editor/Editor.tsx

@@ -44,8 +44,6 @@ import { CourseProvider } from '@components/Contexts/CourseContext'
 import { useLHSession } from '@components/Contexts/LHSessionContext'
 import AIEditorToolkit from './AI/AIEditorToolkit'
 import useGetAIFeatures from '@components/AI/Hooks/useGetAIFeatures'
-import UserAvatar from '../UserAvatar'
-import randomColor from 'randomcolor'
 import Collaboration from '@tiptap/extension-collaboration'
 import CollaborationCursor from '@tiptap/extension-collaboration-cursor'
 import ActiveAvatars from './ActiveAvatars'

apps/web/components/Objects/Editor/EditorWrapper.tsx

@@ -25,6 +25,7 @@ interface EditorWrapperProps {
 
 function EditorWrapper(props: EditorWrapperProps): JSX.Element {
   const session = useLHSession() as any
+    const access_token = session.data.tokens.access_token;
   // Define provider in the state
   const [provider, setProvider] = React.useState<HocuspocusProvider | null>(null);
   const [thisPageColor, setThisPageColor] = useState(randomColor({ luminosity: 'light' }) as string)
@@ -79,7 +80,7 @@ function EditorWrapper(props: EditorWrapperProps): JSX.Element {
       }
     });
 
-    toast.promise(updateActivity(activity, activity.activity_uuid), {
+    toast.promise(updateActivity(activity, activity.activity_uuid,access_token), {
       loading: 'Saving...',
       success: <b>Activity saved!</b>,
       error: <b>Could not save.</b>,

apps/web/components/Objects/Editor/Extensions/Image/ImageBlockComponent.tsx

@@ -9,11 +9,14 @@ import { getActivityBlockMediaDirectory } from '@services/media/media'
 import { useOrg } from '@components/Contexts/OrgContext'
 import { useCourse } from '@components/Contexts/CourseContext'
 import { useEditorProvider } from '@components/Contexts/Editor/EditorContext'
+import { useLHSession } from '@components/Contexts/LHSessionContext'
 
 function ImageBlockComponent(props: any) {
   const org = useOrg() as any
   const course = useCourse() as any
   const editorState = useEditorProvider() as any
+  const session = useLHSession() as any
+    const access_token = session.data.tokens.access_token;
 
   const isEditable = editorState.isEditable
   const [image, setImage] = React.useState(null)
@@ -36,7 +39,7 @@ function ImageBlockComponent(props: any) {
     setIsLoading(true)
     let object = await uploadNewImageFile(
       image,
-      props.extension.options.activity.activity_uuid
+      props.extension.options.activity.activity_uuid,access_token
     )
     setIsLoading(false)
     setblockObject(object)

apps/web/components/Objects/Editor/Extensions/PDF/PDFBlockComponent.tsx

@@ -8,10 +8,13 @@ import { getActivityBlockMediaDirectory } from '@services/media/media'
 import { useOrg } from '@components/Contexts/OrgContext'
 import { useCourse } from '@components/Contexts/CourseContext'
 import { useEditorProvider } from '@components/Contexts/Editor/EditorContext'
+import { useLHSession } from '@components/Contexts/LHSessionContext'
 
 function PDFBlockComponent(props: any) {
   const org = useOrg() as any
   const course = useCourse() as any
+  const session = useLHSession() as any
+  const access_token = session.data.tokens.access_token;
   const [pdf, setPDF] = React.useState(null)
   const [isLoading, setIsLoading] = React.useState(false)
   const [blockObject, setblockObject] = React.useState(
@@ -32,7 +35,7 @@ function PDFBlockComponent(props: any) {
     setIsLoading(true)
     let object = await uploadNewPDFFile(
       pdf,
-      props.extension.options.activity.activity_uuid
+      props.extension.options.activity.activity_uuid, access_token
     )
     setIsLoading(false)
     setblockObject(object)
@@ -41,7 +44,7 @@ function PDFBlockComponent(props: any) {
     })
   }
 
-  useEffect(() => {}, [course, org])
+  useEffect(() => { }, [course, org])
 
   return (
     <NodeViewWrapper className="block-pdf">

apps/web/components/Objects/Editor/Extensions/Quiz/QuizBlockComponent.tsx

@@ -86,10 +86,8 @@ function QuizBlockComponent(props: any) {
 
     if (allCorrect) {
       setSubmissionMessage('All answers are correct!')
-      console.log('All answers are correct!')
     } else {
       setSubmissionMessage('Some answers are incorrect!')
-      console.log('Some answers are incorrect!')
     }
   }
 

apps/web/components/Objects/Editor/Extensions/Video/VideoBlockComponent.tsx

@@ -8,6 +8,7 @@ import { UploadIcon } from '@radix-ui/react-icons'
 import { useOrg } from '@components/Contexts/OrgContext'
 import { useCourse } from '@components/Contexts/CourseContext'
 import { useEditorProvider } from '@components/Contexts/Editor/EditorContext'
+import { useLHSession } from '@components/Contexts/LHSessionContext'
 
 function VideoBlockComponents(props: any) {
   const org = useOrg() as any
@@ -15,6 +16,8 @@ function VideoBlockComponents(props: any) {
   const editorState = useEditorProvider() as any
   const isEditable = editorState.isEditable
   const [video, setVideo] = React.useState(null)
+  const session = useLHSession() as any
+  const access_token = session.data.tokens.access_token;
   const [isLoading, setIsLoading] = React.useState(false)
   const [blockObject, setblockObject] = React.useState(
     props.node.attrs.blockObject
@@ -32,7 +35,7 @@ function VideoBlockComponents(props: any) {
     setIsLoading(true)
     let object = await uploadNewVideoFile(
       video,
-      props.extension.options.activity.activity_uuid
+      props.extension.options.activity.activity_uuid, access_token
     )
     setIsLoading(false)
     setblockObject(object)
@@ -41,7 +44,7 @@ function VideoBlockComponents(props: any) {
     })
   }
 
-  useEffect(() => {}, [course, org])
+  useEffect(() => { }, [course, org])
 
   return (
     <NodeViewWrapper className="block-video">
@@ -98,7 +101,7 @@ function VideoBlockComponents(props: any) {
   )
 }
 const BlockVideoWrapper = styled.div`
-  //border: ${(props) =>
+  border: ${(props) =>
     props.contentEditable ? '2px dashed #713f1117' : 'none'};
 
   // center