diff --git a/apps/course-builder-web/package.json b/apps/course-builder-web/package.json
index d0d0b8b34..e60f2575b 100644
--- a/apps/course-builder-web/package.json
+++ b/apps/course-builder-web/package.json
@@ -40,11 +40,13 @@
     "@codemirror/lang-markdown": "^6.2.3",
     "@codemirror/language-data": "^6.3.1",
     "@codemirror/state": "^6.3.3",
+    "@codemirror/view": "^6.22.3",
     "@coursebuilder/ui": "^1.0.1",
     "@heroicons/react": "^2.0.18",
     "@hookform/resolvers": "^3.3.2",
     "@mdx-js/loader": "^3.0.0",
     "@mdx-js/react": "^3.0.0",
+    "@msgpack/msgpack": "3.0.0-beta2",
     "@mux/mux-player-react": "^2.2.0",
     "@next/mdx": "14.0.1",
     "@planetscale/database": "^1.11.0",
@@ -87,7 +89,7 @@
     "@types/shortid": "^0.0.31",
     "@types/uuid": "^9.0.6",
     "@uploadthing/react": "5.7.1-canary.65ab2fd",
-    "ai": "^2.2.20",
+    "ai": "^2.2.22",
     "aws-sdk": "^2.1483.0",
     "axios": "^1.5.1",
     "base-64": "^1.0.0",
@@ -143,7 +145,8 @@
     "y-prosemirror": "^1.2.1",
     "y-protocols": "^1.0.6",
     "yjs": "^13.6.10",
-    "zod": "^3.22.4"
+    "zod": "^3.22.4",
+    "zustand": "^4.4.7"
   },
   "devDependencies": {
     "@mux/mux-node": "^7.3.2",
diff --git a/apps/course-builder-web/party/index.ts b/apps/course-builder-web/party/index.ts
index 52e0e6f19..6f0561374 100644
--- a/apps/course-builder-web/party/index.ts
+++ b/apps/course-builder-web/party/index.ts
@@ -1,5 +1,15 @@
 import type * as Party from 'partykit/server'
 import {onConnect} from 'y-partykit'
+import * as Y from 'yjs'
+
+const BROADCAST_INTERVAL = 1000 / 60 // 60fps
+
+const CORS = {
+  'Access-Control-Allow-Origin': '*',
+  'Access-Control-Allow-Methods': 'GET',
+  'Access-Control-Allow-Headers':
+    'Origin, X-Requested-With, Content-Type, Accept',
+}
 
 export default class Server implements Party.Server {
   constructor(readonly party: Party.Party) {}
@@ -13,7 +23,27 @@ export default class Server implements Party.Server {
           url: ${new URL(ctx.request.url).pathname}`,
     )
 
-    return onConnect(conn, this.party, {})
+    const party = this.party
+
+    return onConnect(conn, this.party, {
+      async load() {
+        const tip = await sanityQuery<{body: string | null} | null>(
+          `*[_id == "${party.id}"][0]{body}`,
+          party.env,
+        )
+
+        const doc = new Y.Doc()
+        if (tip?.body) {
+          doc.getText('codemirror').insert(0, tip.body)
+        }
+        return doc
+      },
+      callback: {
+        handler: async (doc) => {
+          // autosave
+        },
+      },
+    })
   }
 
   messages: string[] = []
@@ -22,15 +52,33 @@ export default class Server implements Party.Server {
     this.messages = (await this.party.storage.get<string[]>('messages')) ?? []
   }
 
-  async onRequest(_req: Party.Request) {
-    const messageBody: {requestId: string; body: string; name: string} =
-      await _req.json()
+  async onRequest(req: Party.Request) {
+    if (req.method === 'GET') {
+      // For SSR, return the current presence of all connections
+      // const users = [...this.party.getConnections()].reduce(
+      //   (acc, user) => ({...acc, [user.id]: this.getUser(user)}),
+      //   {},
+      // )
+      return Response.json({users: []}, {status: 200, headers: CORS})
+    }
 
-    this.party.broadcast(JSON.stringify(messageBody))
+    // respond to cors preflight requests
+    if (req.method === 'OPTIONS') {
+      return Response.json({ok: true}, {status: 200, headers: CORS})
+    }
 
-    return new Response(
-      `Party ${this.party.id} has received ${this.messages.length} messages`,
-    )
+    if (req.method === 'POST') {
+      const messageBody: {requestId: string; body: string; name: string} =
+        await req.json()
+
+      this.party.broadcast(JSON.stringify(messageBody))
+
+      return new Response(
+        `Party ${this.party.id} has received ${this.messages.length} messages`,
+      )
+    }
+
+    return new Response('Method Not Allowed', {status: 405})
   }
 
   onMessage(message: string, sender: Party.Connection) {
@@ -46,3 +94,42 @@ export default class Server implements Party.Server {
 }
 
 Server satisfies Party.Worker
+
+export async function sanityQuery<T = any>(
+  query: string,
+  env: any,
+  options: {useCdn?: boolean; revalidate?: number} = {
+    useCdn: true,
+    revalidate: 10,
+  },
+): Promise<T> {
+  return await fetch(
+    `https://${env.SANITY_STUDIO_PROJECT_ID}.${
+      options.useCdn ? 'apicdn' : 'api'
+    }.sanity.io/v${env.SANITY_STUDIO_API_VERSION}/data/query/${
+      env.SANITY_STUDIO_DATASET || 'production'
+    }?query=${encodeURIComponent(query)}&perspective=published`,
+    {
+      method: 'get',
+      headers: {
+        Authorization: `Bearer ${env.SANITY_API_TOKEN}`,
+      },
+      next: {revalidate: options.revalidate}, //seconds
+    },
+  )
+    .then(async (response) => {
+      if (response.status !== 200) {
+        throw new Error(
+          `Sanity Query failed with status ${response.status}: ${
+            response.statusText
+          }\n\n\n${JSON.stringify(await response.json(), null, 2)})}`,
+        )
+      }
+      const {result} = await response.json()
+      return result as T
+    })
+    .catch((error) => {
+      console.error('FAAAAAAIIIILLLLL', error)
+      throw error
+    })
+}
diff --git a/apps/course-builder-web/sanity/schema.ts b/apps/course-builder-web/sanity/schema.ts
index 6872df655..3ebc21dd8 100644
--- a/apps/course-builder-web/sanity/schema.ts
+++ b/apps/course-builder-web/sanity/schema.ts
@@ -19,6 +19,7 @@ import solution from './schemas/objects/solution'
 import github from './schemas/objects/github'
 import email from './schemas/documents/email'
 import imageResource from './schemas/documents/imageResource'
+import article from './schemas/documents/article'
 
 export const schema: {types: SchemaTypeDefinition[]} = {
   types: [
@@ -36,6 +37,7 @@ export const schema: {types: SchemaTypeDefinition[]} = {
     linkResource,
     email,
     imageResource,
+    article,
     //objects
     solution,
     github,
diff --git a/apps/course-builder-web/sanity/schemas/documents/article.ts b/apps/course-builder-web/sanity/schemas/documents/article.ts
new file mode 100644
index 000000000..ac7468d69
--- /dev/null
+++ b/apps/course-builder-web/sanity/schemas/documents/article.ts
@@ -0,0 +1,68 @@
+import {MdArticle} from 'react-icons/md'
+import {defineField} from 'sanity'
+
+export default {
+  name: 'article',
+  type: 'document',
+  title: 'Article',
+  icon: MdArticle,
+  fields: [
+    defineField({
+      name: 'title',
+      title: 'Title',
+      type: 'string',
+      validation: (Rule) => Rule.required(),
+    }),
+    defineField({
+      name: 'state',
+      title: 'Current State',
+      type: 'string',
+      validation: (Rule) => Rule.required(),
+      initialValue: 'draft',
+      options: {
+        list: [
+          {title: 'draft', value: 'draft'},
+          {title: 'published', value: 'published'},
+        ],
+      },
+    }),
+    defineField({
+      name: 'slug',
+      title: 'Slug',
+      type: 'slug',
+      validation: (Rule) => Rule.required(),
+      options: {
+        source: 'title',
+        maxLength: 96,
+      },
+    }),
+    {
+      name: 'body',
+      title: 'Body',
+      type: 'markdown',
+    },
+    {
+      name: 'summary',
+      title: 'Summary',
+      type: 'markdown',
+    },
+    {
+      name: 'concepts',
+      title: 'Concepts',
+      type: 'array',
+      of: [
+        {
+          type: 'reference',
+          to: [{type: 'concept'}],
+        },
+      ],
+    },
+    defineField({
+      name: 'description',
+      title: 'Short Description',
+      description: 'Used as a short "SEO" summary on Twitter cards etc.',
+      type: 'text',
+      validation: (Rule) => Rule.max(160),
+    }),
+  ],
+}
diff --git a/apps/course-builder-web/src/app/[article]/page.tsx b/apps/course-builder-web/src/app/[article]/page.tsx
new file mode 100644
index 000000000..c8e7c03e3
--- /dev/null
+++ b/apps/course-builder-web/src/app/[article]/page.tsx
@@ -0,0 +1,50 @@
+import Link from 'next/link'
+import {Button} from '@coursebuilder/ui'
+import * as React from 'react'
+import {getServerAuthSession} from '@/server/auth'
+import {getAbility} from '@/lib/ability'
+import ReactMarkdown from 'react-markdown'
+import {getArticle} from '@/lib/articles'
+import {notFound} from 'next/navigation'
+
+export default async function ArticlePage({
+  params,
+}: {
+  params: {article: string}
+}) {
+  const session = await getServerAuthSession()
+  const ability = getAbility({user: session?.user})
+  const article = await getArticle(params.article)
+
+  console.log('******', {article})
+
+  if (!article) {
+    notFound()
+  }
+
+  return (
+    <div>
+      {ability.can('edit', 'Article') ? (
+        <div className="flex h-9 w-full items-center justify-between bg-muted px-1">
+          <div />
+          <Button asChild className="h-7">
+            <Link href={`/articles/${article.slug || article._id}/edit`}>
+              Edit
+            </Link>
+          </Button>
+        </div>
+      ) : null}
+      <article className="grid grid-cols-5 p-5 sm:p-10">
+        <div className="col-span-3">
+          <h1 className="text-3xl font-bold">{article.title}</h1>
+        </div>
+        <div className="col-span-2">
+          <ReactMarkdown className="prose dark:prose-invert">
+            {article.body}
+          </ReactMarkdown>
+          <ReactMarkdown>{article.summary}</ReactMarkdown>
+        </div>
+      </article>
+    </div>
+  )
+}
diff --git a/apps/course-builder-web/src/app/_components/chat-response.tsx b/apps/course-builder-web/src/app/_components/chat-response.tsx
index 69935648a..b081fee56 100644
--- a/apps/course-builder-web/src/app/_components/chat-response.tsx
+++ b/apps/course-builder-web/src/app/_components/chat-response.tsx
@@ -19,8 +19,6 @@ export function ChatResponse({requestIds = []}: {requestIds: string[]}) {
     onMessage: (messageEvent) => {
       const messageData = JSON.parse(messageEvent.data)
 
-      console.log({requestIds, messageData})
-
       if (
         messageData.body !== STREAM_COMPLETE &&
         requestIds.includes(messageData.requestId)
diff --git a/apps/course-builder-web/src/app/_components/landing.tsx b/apps/course-builder-web/src/app/_components/landing.tsx
index 98b083e21..6ee215037 100644
--- a/apps/course-builder-web/src/app/_components/landing.tsx
+++ b/apps/course-builder-web/src/app/_components/landing.tsx
@@ -7,7 +7,6 @@ import {Icon} from '@/components/icons'
 
 export const Landing = () => {
   const {data: session, status} = useSession()
-  console.log(session)
   return (
     <>
       <LandingCopy />
diff --git a/apps/course-builder-web/src/app/_components/party.tsx b/apps/course-builder-web/src/app/_components/party.tsx
index d0d1e6420..1db76b23d 100644
--- a/apps/course-builder-web/src/app/_components/party.tsx
+++ b/apps/course-builder-web/src/app/_components/party.tsx
@@ -4,10 +4,11 @@ import {useSocket} from '@/hooks/use-socket'
 import {api} from '@/trpc/react'
 import {useRouter} from 'next/navigation'
 
-export function Party() {
+export function Party({room}: {room?: string}) {
   const utils = api.useUtils()
   const router = useRouter()
   useSocket({
+    room,
     onMessage: async (messageEvent) => {
       try {
         const data = JSON.parse(messageEvent.data)
@@ -18,8 +19,6 @@ export function Party() {
           'ai.tip.draft.completed',
         ]
 
-        console.log(data.name)
-
         if (invalidateOn.includes(data.name)) {
           await utils.module.invalidate()
           router.refresh()
diff --git a/apps/course-builder-web/src/app/api/chat/route.ts b/apps/course-builder-web/src/app/api/chat/route.ts
new file mode 100644
index 000000000..b7b714651
--- /dev/null
+++ b/apps/course-builder-web/src/app/api/chat/route.ts
@@ -0,0 +1,20 @@
+// ./app/api/chat/route.js
+import OpenAI from 'openai'
+import {OpenAIStream, StreamingTextResponse} from 'ai'
+
+const openai = new OpenAI({
+  apiKey: process.env.OPENAI_API_KEY,
+})
+
+export const runtime = 'edge'
+
+export async function POST(req: Request) {
+  const {messages} = await req.json()
+  const response = await openai.chat.completions.create({
+    model: 'gpt-4',
+    stream: true,
+    messages,
+  })
+  const stream = OpenAIStream(response)
+  return new StreamingTextResponse(stream)
+}
diff --git a/apps/course-builder-web/src/app/articles/[slug]/edit/page.tsx b/apps/course-builder-web/src/app/articles/[slug]/edit/page.tsx
new file mode 100644
index 000000000..d118e2d84
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/[slug]/edit/page.tsx
@@ -0,0 +1,21 @@
+import * as React from 'react'
+import {getServerAuthSession} from '@/server/auth'
+import {getAbility} from '@/lib/ability'
+import {EditArticleForm} from '@/app/articles/_components/edit-article-form'
+import {getArticle} from '@/lib/articles'
+
+export default async function ArticleEditPage({
+  params,
+}: {
+  params: {slug: string}
+}) {
+  const session = await getServerAuthSession()
+  const ability = getAbility({user: session?.user})
+  const article = await getArticle(params.slug)
+
+  return article && ability.can('upload', 'Media') ? (
+    <div className="relative mx-auto flex h-full w-full flex-grow flex-col items-center justify-center">
+      <EditArticleForm key={article.slug} article={article} />
+    </div>
+  ) : null
+}
diff --git a/apps/course-builder-web/src/app/articles/_components/article-assistant.tsx b/apps/course-builder-web/src/app/articles/_components/article-assistant.tsx
new file mode 100644
index 000000000..658431699
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/_components/article-assistant.tsx
@@ -0,0 +1,170 @@
+'use client'
+
+import ReactMarkdown from 'react-markdown'
+import * as React from 'react'
+import {STREAM_COMPLETE} from '@/lib/streaming-chunk-publisher'
+import {useRef} from 'react'
+import {api} from '@/trpc/react'
+import {useSocket} from '@/hooks/use-socket'
+import {Button, ScrollArea, Textarea} from '@coursebuilder/ui'
+import {EnterIcon} from '@sanity/icons'
+import {
+  type ChatCompletionRequestMessage,
+  ChatCompletionRequestMessageRoleEnum,
+} from 'openai-edge'
+
+export function ArticleAssistant({
+  article,
+}: {
+  article: {body: string | null; title: string; _id: string}
+}) {
+  const {mutate: sendArticleChatMessage} = api.articles.chat.useMutation()
+  const [messages, setMessages] = React.useState<
+    ChatCompletionRequestMessage[]
+  >([])
+
+  const textareaRef = useRef<HTMLTextAreaElement>(null)
+
+  useSocket({
+    room: article._id,
+    onMessage: (messageEvent) => {
+      try {
+        const messageData = JSON.parse(messageEvent.data)
+
+        if (
+          messageData.name === 'article.chat.completed' &&
+          messageData.requestId === article._id
+        ) {
+          setMessages(messageData.body)
+        }
+      } catch (error) {
+        // noting to do
+      }
+    },
+  })
+
+  return (
+    <div className="flex h-full w-full flex-col justify-start">
+      <h3 className="inline-flex p-5 pb-3 text-lg font-bold">Assistant</h3>
+      <ArticleChatResponse requestId={article._id} />
+      <div className="flex w-full flex-col items-start border-t">
+        <div className="relative w-full">
+          <Textarea
+            ref={textareaRef}
+            className="w-full rounded-none border-0 border-b px-5 py-4 pr-10"
+            placeholder="Type a message..."
+            rows={4}
+            onKeyDown={async (event) => {
+              if (event.key === 'Enter' && !event.shiftKey) {
+                event.preventDefault()
+                sendArticleChatMessage({
+                  articleId: article._id,
+                  messages: [
+                    ...messages,
+                    {
+                      role: ChatCompletionRequestMessageRoleEnum.User,
+                      content: `${event.currentTarget.value}
+                      
+                      current title: ${article.title}
+                      current body: ${article.body}
+                      `,
+                    },
+                  ],
+                })
+                event.currentTarget.value = ''
+              }
+            }}
+          />
+          <Button
+            type="button"
+            className="absolute right-2 top-2 flex h-6 w-6 items-center justify-center p-0"
+            variant="outline"
+            onClick={async (event) => {
+              event.preventDefault()
+              if (textareaRef.current) {
+                sendArticleChatMessage({
+                  articleId: article._id,
+                  messages: [
+                    ...messages,
+                    {
+                      role: ChatCompletionRequestMessageRoleEnum.User,
+                      content: `${event.currentTarget.value}
+                      
+                      current title: ${article.title}
+                      current body: ${article.body}
+                      `,
+                    },
+                  ],
+                })
+                textareaRef.current.value = ''
+              }
+            }}
+          >
+            <EnterIcon className="w-4" />
+          </Button>
+        </div>
+
+        <div className="p-5">
+          <h3 className="flex pb-3 text-lg font-bold">Actions</h3>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+function ArticleChatResponse({requestId}: {requestId: string}) {
+  const [messages, setMessages] = React.useState<
+    {requestId: string; body: string}[]
+  >([])
+  const div = useRef<any>(null)
+
+  const utils = api.useUtils()
+
+  useSocket({
+    room: requestId,
+    onMessage: (messageEvent) => {
+      try {
+        const messageData = JSON.parse(messageEvent.data)
+
+        if (
+          messageData.body !== STREAM_COMPLETE &&
+          messageData.name == 'ai.message' &&
+          requestId === messageData.requestId
+        ) {
+          setMessages((messages) => [
+            ...messages,
+            {body: messageData.body, requestId: messageData.requestId},
+          ])
+        }
+        utils.module.invalidate()
+        if (div.current) {
+          div.current.scrollTop = div.current.scrollHeight
+        }
+      } catch (error) {
+        // noting to do
+      }
+    },
+  })
+  // Group messages by requestId
+  const groupedMessages = messages.reduce(
+    (groups, message) => {
+      if (!groups[message.requestId]) {
+        groups[message.requestId] = []
+      }
+
+      groups[message.requestId]?.push(message.body)
+      return groups
+    },
+    {} as Record<string, string[]>,
+  )
+
+  return (
+    <ScrollArea viewportRef={div} className="h-[50vh] w-full scroll-smooth">
+      {Object.entries(groupedMessages).map(([requestId, bodies], index) => (
+        <div key={requestId} className="prose prose-sm max-w-none p-5">
+          <ReactMarkdown>{bodies.join('')}</ReactMarkdown>
+        </div>
+      ))}
+    </ScrollArea>
+  )
+}
diff --git a/apps/course-builder-web/src/app/articles/_components/cloudinary-media-browser.tsx b/apps/course-builder-web/src/app/articles/_components/cloudinary-media-browser.tsx
new file mode 100644
index 000000000..c3433ade8
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/_components/cloudinary-media-browser.tsx
@@ -0,0 +1,49 @@
+import {useSocket} from '@/hooks/use-socket'
+import {api} from '@/trpc/react'
+import React from 'react'
+
+export const CloudinaryMediaBrowser = () => {
+  const utils = api.useUtils()
+
+  const {data: images = []} = api.imageResources.getAll.useQuery()
+
+  useSocket({
+    onMessage: (messageEvent) => {
+      try {
+        const messageData = JSON.parse(messageEvent.data)
+        if (messageData.name === 'cloudinary.asset.created') {
+          utils.imageResources.getAll.invalidate()
+        }
+      } catch (error) {
+        // noting to do
+      }
+    },
+  })
+
+  return (
+    <div>
+      <h3 className="inline-flex px-5 text-lg font-bold">Media Browser</h3>
+      <div className="grid grid-cols-3 gap-1 p-2">
+        {images.map((asset) => {
+          return asset?.url ? (
+            <div
+              key={asset._id}
+              className="flex aspect-square items-center justify-center overflow-hidden rounded border"
+            >
+              <img
+                src={asset.url}
+                alt={asset._id}
+                onDragStart={(e) => {
+                  e.dataTransfer.setData(
+                    'text/plain',
+                    `![](${e.currentTarget.src})`,
+                  )
+                }}
+              />
+            </div>
+          ) : null
+        })}
+      </div>
+    </div>
+  )
+}
diff --git a/apps/course-builder-web/src/app/articles/_components/cloudinary-upload-widget.tsx b/apps/course-builder-web/src/app/articles/_components/cloudinary-upload-widget.tsx
new file mode 100644
index 000000000..b5e7cf609
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/_components/cloudinary-upload-widget.tsx
@@ -0,0 +1,57 @@
+'use client'
+
+import React from 'react'
+import Script from 'next/script'
+import {Button} from '@coursebuilder/ui'
+import {env} from '@/env.mjs'
+
+export const CloudinaryUploadWidget: React.FC<{dir: string; id: string}> = ({
+  dir,
+  id,
+}) => {
+  const cloudinaryRef = React.useRef<any>()
+  const widgetRef = React.useRef<any>()
+  const containerRef = React.useRef<HTMLDivElement>(null)
+  React.useEffect(() => {
+    cloudinaryRef.current = (window as any).cloudinary
+  }, [])
+
+  return (
+    <div>
+      <Script
+        strategy="afterInteractive"
+        onLoad={() => {
+          cloudinaryRef.current = (window as any).cloudinary
+        }}
+        src="https://upload-widget.cloudinary.com/global/all.js"
+        type="text/javascript"
+      />
+      <div className="p-5">
+        <Button
+          type="button"
+          variant="outline"
+          className="flex w-full"
+          onClick={() => {
+            widgetRef.current = cloudinaryRef.current.createUploadWidget(
+              {
+                cloudName: env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME,
+                uploadPreset: env.NEXT_PUBLIC_CLOUDINARY_UPLOAD_PRESET,
+                // inline_container: '#cloudinary-upload-widget-container',
+                folder: `${dir}/${id}`,
+              },
+              (error: any, result: any) => {
+                if (!error && result && result.event === 'success') {
+                  console.log('Done! Here is the image info: ', result.info)
+                }
+              },
+            )
+            widgetRef.current.open()
+          }}
+        >
+          Upload images
+        </Button>
+      </div>
+      <div ref={containerRef} id="cloudinary-upload-widget-container" />
+    </div>
+  )
+}
diff --git a/apps/course-builder-web/src/app/articles/_components/codemirror.tsx b/apps/course-builder-web/src/app/articles/_components/codemirror.tsx
new file mode 100644
index 000000000..0e5553e91
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/_components/codemirror.tsx
@@ -0,0 +1,148 @@
+import {env} from '@/env.mjs'
+import * as Y from 'yjs'
+import {yCollab} from 'y-codemirror.next'
+import {basicSetup, EditorView} from 'codemirror'
+import {EditorState, Extension} from '@codemirror/state'
+import {useCallback, useEffect, useState} from 'react'
+import {markdown} from '@codemirror/lang-markdown'
+import YPartyKitProvider from 'y-partykit/provider'
+import {useSession} from 'next-auth/react'
+
+export const CodemirrorEditor = ({
+  roomName,
+  value,
+  onChange,
+}: {
+  roomName: string
+  value: string
+  onChange: (data: any) => void
+}) => {
+  const {codemirrorElementRef} = useCodemirror({roomName, value, onChange})
+
+  return (
+    <div className="h-full flex-shrink-0 border-t">
+      <div ref={codemirrorElementRef}></div>
+    </div>
+  )
+}
+
+const CourseBuilderEditorTheme = {
+  '.cm-content, .cm-gutter': {
+    minHeight: '100%',
+    height: '100%',
+  },
+  '.cm-content': {
+    padding: '2rem 0',
+    fontSize: '14px',
+    fontFamily: 'var(--font-mono)',
+  },
+  '.cm-line': {
+    padding: '0 2rem',
+  },
+  '.cm-gutters': {
+    backgroundColor: 'hsl(var(--background))',
+    borderRight: 'none',
+    opacity: 0.35,
+  },
+  '.cm-activeLineGutter': {
+    backgroundColor: 'transparent',
+  },
+  '.cm-lineNumbers': {
+    fontSize: '10px',
+  },
+  '&.cm-focused': {
+    outline: 'none',
+  },
+  '.cm-activeLine': {
+    backgroundColor: 'hsl(var(--foreground) / 3%)',
+  },
+}
+
+const styles: Extension[] = [
+  EditorView.theme(CourseBuilderEditorTheme),
+  EditorView.lineWrapping,
+  EditorView.domEventHandlers({}),
+]
+
+/**
+ * @see {@link https://codemirror.net/docs/ref/#codemirror.basicSetup Code Mirror Basic Setup}
+ * @param options
+ * @constructor
+ */
+const useCodemirror = ({
+  roomName,
+  value,
+  onChange,
+}: {
+  roomName: string
+  value: string
+  onChange: (data: any) => void
+}) => {
+  const [element, setElement] = useState<HTMLElement>()
+  const [yUndoManager, setYUndoManager] = useState<Y.UndoManager>()
+
+  const {data: session} = useSession()
+
+  useEffect(() => {
+    let view: EditorView
+
+    let provider = new YPartyKitProvider(
+      env.NEXT_PUBLIC_PARTY_KIT_URL,
+      roomName,
+    )
+
+    if (!element) {
+      return
+    }
+
+    const ytext = provider.doc.getText('codemirror')
+
+    const undoManager = new Y.UndoManager(ytext)
+    setYUndoManager(undoManager)
+
+    let updateListenerExtension = EditorView.updateListener.of((update) => {
+      if (update.docChanged) {
+        onChange(update.state.doc.toString())
+      }
+    })
+
+    const awareness = provider.awareness
+
+    if (session) {
+      awareness.setLocalStateField('user', {
+        ...session.user,
+        color: '#ffb61e', // should be a hex color
+      })
+    }
+
+    // Set up CodeMirror and extensions
+    const state = EditorState.create({
+      doc: ytext.toString(),
+      extensions: [
+        basicSetup,
+        updateListenerExtension,
+        markdown(),
+        yCollab(ytext, provider.awareness, {undoManager}),
+        ...styles,
+      ],
+    })
+
+    // Attach CodeMirror to element
+    view = new EditorView({
+      state,
+      parent: element,
+    })
+
+    return () => {
+      provider?.destroy()
+      view?.destroy()
+    }
+  }, [element, roomName, value, session])
+
+  return {
+    codemirrorElementRef: useCallback((node: HTMLElement | null) => {
+      if (!node) return
+      setElement(node)
+    }, []),
+  }
+}
diff --git a/apps/course-builder-web/src/app/articles/_components/create-article.tsx b/apps/course-builder-web/src/app/articles/_components/create-article.tsx
new file mode 100644
index 000000000..fb67d0209
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/_components/create-article.tsx
@@ -0,0 +1,14 @@
+import {Card, CardContent, CardFooter, CardHeader} from '@coursebuilder/ui'
+import {NewArticleForm} from '@/app/articles/_components/new-article-form'
+
+export function CreateArticle() {
+  return (
+    <Card>
+      <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2"></CardHeader>
+      <CardContent>
+        <NewArticleForm />
+      </CardContent>
+      <CardFooter></CardFooter>
+    </Card>
+  )
+}
diff --git a/apps/course-builder-web/src/app/articles/_components/edit-article-form.tsx b/apps/course-builder-web/src/app/articles/_components/edit-article-form.tsx
new file mode 100644
index 000000000..fc943c338
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/_components/edit-article-form.tsx
@@ -0,0 +1,199 @@
+'use client'
+
+import * as React from 'react'
+import {
+  Button,
+  Form,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+  Tooltip,
+  TooltipProvider,
+  TooltipTrigger,
+  TooltipContent,
+} from '@coursebuilder/ui'
+import {useForm} from 'react-hook-form'
+import {z} from 'zod'
+import {zodResolver} from '@hookform/resolvers/zod'
+import {Input} from '@coursebuilder/ui'
+import {api} from '@/trpc/react'
+import {useRouter} from 'next/navigation'
+import {ArticleAssistant} from './article-assistant'
+import Link from 'next/link'
+import {CodemirrorEditor} from './codemirror'
+import {ImagePlusIcon, ZapIcon} from 'lucide-react'
+import {CloudinaryUploadWidget} from './cloudinary-upload-widget'
+import {CloudinaryMediaBrowser} from './cloudinary-media-browser'
+import {cn} from '@/lib/utils'
+import {Article} from '@/lib/articles'
+
+const ArticleFormSchema = z.object({
+  title: z.string().min(2).max(90),
+  body: z.string().optional().nullable(),
+})
+
+export function EditArticleForm({article}: {article: Article}) {
+  const router = useRouter()
+
+  const form = useForm<z.infer<typeof ArticleFormSchema>>({
+    resolver: zodResolver(ArticleFormSchema),
+    defaultValues: {
+      title: article.title,
+      body: article.body,
+    },
+  })
+  const {mutateAsync: updateArticle, status: updateArticleStatus} =
+    api.articles.update.useMutation()
+
+  const onSubmit = async (values: z.infer<typeof ArticleFormSchema>) => {
+    const updatedArticle = await updateArticle({
+      articleId: article._id,
+      ...values,
+    })
+    if (updatedArticle) {
+      router.push(`/${updatedArticle.slug}`)
+    }
+  }
+
+  const [activeToolbarTab, setActiveToolbarTab] = React.useState(
+    TOOLBAR.values().next().value,
+  )
+
+  const formValues = form.getValues()
+
+  const watcher = form.watch(['title', 'body'])
+
+  return (
+    <Form {...form}>
+      <form
+        className="flex h-full flex-grow flex-col"
+        onSubmit={form.handleSubmit(onSubmit)}
+      >
+        <div className="flex h-9 w-full items-center justify-between bg-muted px-1">
+          <Button className="px-0" asChild variant="link">
+            <Link href={`/${article.slug}`} className="aspect-square">
+              ←
+            </Link>
+          </Button>
+          <Button
+            type="submit"
+            variant="default"
+            size="sm"
+            className="h-7"
+            disabled={updateArticleStatus === 'loading'}
+          >
+            Save
+          </Button>
+        </div>
+        <div className="flex h-full flex-grow border-t">
+          <div className="grid grid-cols-12">
+            <div className="col-span-3 flex h-full flex-col border-r">
+              <FormField
+                control={form.control}
+                name="title"
+                render={({field}) => (
+                  <FormItem className="p-5">
+                    <FormLabel className="text-lg font-bold">Title</FormLabel>
+                    <FormDescription>
+                      A title should summarize the tip and explain what it is
+                      about clearly.
+                    </FormDescription>
+                    <Input {...field} />
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+              <div className="flex max-h-screen items-end p-5 text-xs text-orange-600">
+                {article._id}
+              </div>
+            </div>
+            <div className="col-span-6 flex h-full w-full flex-col justify-start space-y-5 border-r">
+              <FormField
+                control={form.control}
+                name="body"
+                render={({field}) => (
+                  <FormItem className="pt-5">
+                    <FormLabel className="px-5 text-lg font-bold">
+                      Content
+                    </FormLabel>
+                    <FormDescription className="px-5 pb-3">
+                      Tip content in MDX.
+                    </FormDescription>
+                    <CodemirrorEditor
+                      roomName={`${article._id}`}
+                      value={article.body}
+                      onChange={(data) => {
+                        form.setValue('body', data)
+                      }}
+                    />
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+            </div>
+            <div className="col-span-3">
+              {watcher && activeToolbarTab.id === 'assistant' && (
+                <ArticleAssistant article={{...article, ...formValues}} />
+              )}
+              {activeToolbarTab.id === 'media' && (
+                <>
+                  <CloudinaryUploadWidget
+                    dir={article._type}
+                    id={article._id}
+                  />
+                  <CloudinaryMediaBrowser />
+                </>
+              )}
+            </div>
+          </div>
+          <div className="border-l bg-muted">
+            <div className="flex flex-col gap-1 p-1">
+              <TooltipProvider delayDuration={0}>
+                {Array.from(TOOLBAR).map((item) => (
+                  <Tooltip key={item.id}>
+                    <TooltipTrigger asChild>
+                      <Button
+                        variant="link"
+                        type="button"
+                        className={cn(
+                          `flex aspect-square items-center justify-center rounded-lg border p-0 transition hover:bg-background/50`,
+                          {
+                            'border-border bg-background':
+                              activeToolbarTab.id === item.id,
+                            'border-transparent bg-transparent':
+                              activeToolbarTab.id !== item.id,
+                          },
+                        )}
+                        onClick={() => setActiveToolbarTab(item)}
+                      >
+                        {item.icon()}
+                      </Button>
+                    </TooltipTrigger>
+                    <TooltipContent side="left" className="capitalize">
+                      {item.id}
+                    </TooltipContent>
+                  </Tooltip>
+                ))}
+              </TooltipProvider>
+            </div>
+          </div>
+        </div>
+      </form>
+    </Form>
+  )
+}
+
+const TOOLBAR = new Set([
+  {
+    id: 'assistant',
+    icon: () => <ZapIcon strokeWidth={1.5} size={24} width={18} height={18} />,
+  },
+  {
+    id: 'media',
+    icon: () => (
+      <ImagePlusIcon strokeWidth={1.5} size={24} width={18} height={18} />
+    ),
+  },
+])
diff --git a/apps/course-builder-web/src/app/articles/_components/new-article-form.tsx b/apps/course-builder-web/src/app/articles/_components/new-article-form.tsx
new file mode 100644
index 000000000..6c209589e
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/_components/new-article-form.tsx
@@ -0,0 +1,81 @@
+'use client'
+
+import * as React from 'react'
+import {Button} from '@coursebuilder/ui'
+import {
+  Form,
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@coursebuilder/ui'
+import {useForm} from 'react-hook-form'
+import {z} from 'zod'
+import {zodResolver} from '@hookform/resolvers/zod'
+import {Input} from '@coursebuilder/ui'
+import {api} from '@/trpc/react'
+import {useRouter} from 'next/navigation'
+
+const NewArticleFormSchema = z.object({
+  title: z.string().min(2).max(90),
+})
+
+export function NewArticleForm() {
+  const router = useRouter()
+
+  const form = useForm<z.infer<typeof NewArticleFormSchema>>({
+    resolver: zodResolver(NewArticleFormSchema),
+    defaultValues: {
+      title: '',
+    },
+  })
+  const {mutateAsync: createArticle} = api.articles.create.useMutation({
+    onSuccess: async () => {
+      form.reset()
+      router.refresh()
+    },
+  })
+
+  const onSubmit = async (values: z.infer<typeof NewArticleFormSchema>) => {
+    const article = await createArticle(values)
+    if (article) {
+      router.push(`/${article.slug}`)
+    }
+  }
+
+  return (
+    <Form {...form}>
+      <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-8">
+        <FormField
+          control={form.control}
+          name="title"
+          render={({field}) => (
+            <FormItem>
+              <FormLabel className="text-lg font-bold">Title</FormLabel>
+              <FormDescription className="mt-2 text-sm">
+                A title should summarize the article and explain what it is
+                about clearly.
+              </FormDescription>
+              <FormControl>
+                <Input {...field} />
+              </FormControl>
+
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+
+        <Button
+          type="submit"
+          className="mt-2"
+          variant="default"
+          disabled={!form.formState.isValid}
+        >
+          Create Draft Article
+        </Button>
+      </form>
+    </Form>
+  )
+}
diff --git a/apps/course-builder-web/src/app/articles/new/page.tsx b/apps/course-builder-web/src/app/articles/new/page.tsx
new file mode 100644
index 000000000..057bc74c4
--- /dev/null
+++ b/apps/course-builder-web/src/app/articles/new/page.tsx
@@ -0,0 +1,15 @@
+import {getServerAuthSession} from '@/server/auth'
+import {getAbility} from '@/lib/ability'
+import * as React from 'react'
+import {CreateArticle} from '../_components/create-article'
+
+export default async function NewTipPage() {
+  const session = await getServerAuthSession()
+  const ability = getAbility({user: session?.user})
+
+  return (
+    <div className="flex flex-col">
+      {ability.can('upload', 'Media') ? <CreateArticle /> : null}
+    </div>
+  )
+}
diff --git a/apps/course-builder-web/src/app/layout.tsx b/apps/course-builder-web/src/app/layout.tsx
index 5d95a5d55..53db21666 100644
--- a/apps/course-builder-web/src/app/layout.tsx
+++ b/apps/course-builder-web/src/app/layout.tsx
@@ -36,7 +36,7 @@ export default function RootLayout({children}: {children: React.ReactNode}) {
             <Party />
             <div key="1" className="flex min-h-screen w-full flex-col">
               <Navigation />
-              <main>
+              <main className="flex min-h-[calc(100vh-var(--nav-height))] flex-col">
                 <NextSSRPlugin
                   /**
                    * The `extractRouterConfig` will extract **only** the route configs from the
diff --git a/apps/course-builder-web/src/app/tips/[slug]/edit/page.tsx b/apps/course-builder-web/src/app/tips/[slug]/edit/page.tsx
index 2f94f1309..39c435ead 100644
--- a/apps/course-builder-web/src/app/tips/[slug]/edit/page.tsx
+++ b/apps/course-builder-web/src/app/tips/[slug]/edit/page.tsx
@@ -15,7 +15,7 @@ export default async function TipEditPage({params}: {params: {slug: string}}) {
   }
 
   return (
-    <div className="relative mx-auto h-full w-full flex-grow items-center justify-center border-b">
+    <div className="relative mx-auto flex h-full w-full flex-grow flex-col items-center justify-center">
       <EditTipForm key={tip.slug} tip={tip} />
     </div>
   )
diff --git a/apps/course-builder-web/src/app/tips/[slug]/page.tsx b/apps/course-builder-web/src/app/tips/[slug]/page.tsx
index 5366aa11b..8f07172b9 100644
--- a/apps/course-builder-web/src/app/tips/[slug]/page.tsx
+++ b/apps/course-builder-web/src/app/tips/[slug]/page.tsx
@@ -1,35 +1,56 @@
 import Link from 'next/link'
-import {CardTitle, CardHeader, CardContent, Card} from '@coursebuilder/ui'
+import {
+  CardTitle,
+  CardHeader,
+  CardContent,
+  Card,
+  Button,
+} from '@coursebuilder/ui'
 import {TipPlayer} from '@/app/tips/_components/tip-player'
 import * as React from 'react'
 import {getServerAuthSession} from '@/server/auth'
 import {getAbility} from '@/lib/ability'
 import {getTip} from '@/lib/tips'
 import ReactMarkdown from 'react-markdown'
+import {notFound} from 'next/navigation'
 
 export default async function TipPage({params}: {params: {slug: string}}) {
   const session = await getServerAuthSession()
   const ability = getAbility({user: session?.user})
   const tip = await getTip(params.slug)
 
+  if (!tip) {
+    notFound()
+  }
+
   return (
-    <div className="flex flex-col">
-      <Card key={tip._id}>
-        <CardHeader>
-          <CardTitle>{tip.title}</CardTitle>
-        </CardHeader>
-        <CardContent>
-          {tip.summary}
-          <TipPlayer
-            videoResourceId={tip.videoResourceId}
-            muxPlaybackId={tip.muxPlaybackId}
-          />
-          <ReactMarkdown>{tip.body}</ReactMarkdown>
-          {ability.can('edit', 'Tip') ? (
-            <Link href={`/tips/${tip.slug || tip._id}/edit`}>edit</Link>
-          ) : null}
-        </CardContent>
-      </Card>
+    <div>
+      {ability.can('edit', 'Tip') ? (
+        <div className="flex h-9 w-full items-center justify-between bg-muted px-1">
+          <div />
+          <Button asChild className="h-7">
+            <Link href={`/tips/${tip.slug || tip._id}/edit`}>Edit</Link>
+          </Button>
+        </div>
+      ) : null}
+      <header>
+        <TipPlayer
+          videoResourceId={tip.videoResourceId}
+          muxPlaybackId={tip.muxPlaybackId}
+          className="relative flex h-full max-h-[calc(100vh-var(--nav-height))] w-full items-center justify-center"
+        />
+      </header>
+      <article className="grid grid-cols-5 p-5 sm:p-10">
+        <div className="col-span-3">
+          <h1 className="text-3xl font-bold">{tip.title}</h1>
+        </div>
+        <div className="col-span-2">
+          <ReactMarkdown className="prose dark:prose-invert">
+            {tip.body}
+          </ReactMarkdown>
+          <ReactMarkdown>{tip.summary}</ReactMarkdown>
+        </div>
+      </article>
     </div>
   )
 }
diff --git a/apps/course-builder-web/src/app/tips/_components/codemirror.tsx b/apps/course-builder-web/src/app/tips/_components/codemirror.tsx
index fddc0d85b..0e5553e91 100644
--- a/apps/course-builder-web/src/app/tips/_components/codemirror.tsx
+++ b/apps/course-builder-web/src/app/tips/_components/codemirror.tsx
@@ -1,17 +1,26 @@
 import {env} from '@/env.mjs'
 import * as Y from 'yjs'
 import {yCollab} from 'y-codemirror.next'
-import {EditorView, basicSetup} from 'codemirror'
+import {basicSetup, EditorView} from 'codemirror'
 import {EditorState, Extension} from '@codemirror/state'
 import {useCallback, useEffect, useState} from 'react'
 import {markdown} from '@codemirror/lang-markdown'
 import YPartyKitProvider from 'y-partykit/provider'
+import {useSession} from 'next-auth/react'
 
-export const CodemirrorEditor = ({roomName}: {roomName: string}) => {
-  const {codemirrorElementRef} = useCodemirror({roomName})
+export const CodemirrorEditor = ({
+  roomName,
+  value,
+  onChange,
+}: {
+  roomName: string
+  value: string
+  onChange: (data: any) => void
+}) => {
+  const {codemirrorElementRef} = useCodemirror({roomName, value, onChange})
 
   return (
-    <div className="h-full flex-shrink-0 border-y">
+    <div className="h-full flex-shrink-0 border-t">
       <div ref={codemirrorElementRef}></div>
     </div>
   )
@@ -25,6 +34,7 @@ const CourseBuilderEditorTheme = {
   '.cm-content': {
     padding: '2rem 0',
     fontSize: '14px',
+    fontFamily: 'var(--font-mono)',
   },
   '.cm-line': {
     padding: '0 2rem',
@@ -51,6 +61,7 @@ const CourseBuilderEditorTheme = {
 const styles: Extension[] = [
   EditorView.theme(CourseBuilderEditorTheme),
   EditorView.lineWrapping,
+  EditorView.domEventHandlers({}),
 ]
 
 /**
@@ -58,17 +69,26 @@ const styles: Extension[] = [
  * @param options
  * @constructor
  */
-const useCodemirror = ({roomName}: {roomName: string}) => {
+const useCodemirror = ({
+  roomName,
+  value,
+  onChange,
+}: {
+  roomName: string
+  value: string
+  onChange: (data: any) => void
+}) => {
   const [element, setElement] = useState<HTMLElement>()
   const [yUndoManager, setYUndoManager] = useState<Y.UndoManager>()
 
+  const {data: session} = useSession()
+
   useEffect(() => {
     let view: EditorView
-    let yDoc = new Y.Doc()
+
     let provider = new YPartyKitProvider(
       env.NEXT_PUBLIC_PARTY_KIT_URL,
       roomName,
-      yDoc,
     )
 
     if (!element) {
@@ -76,14 +96,31 @@ const useCodemirror = ({roomName}: {roomName: string}) => {
     }
 
     const ytext = provider.doc.getText('codemirror')
+
     const undoManager = new Y.UndoManager(ytext)
     setYUndoManager(undoManager)
 
+    let updateListenerExtension = EditorView.updateListener.of((update) => {
+      if (update.docChanged) {
+        onChange(update.state.doc.toString())
+      }
+    })
+
+    const awareness = provider.awareness
+
+    if (session) {
+      awareness.setLocalStateField('user', {
+        ...session.user,
+        color: '#ffb61e', // should be a hex color
+      })
+    }
+
     // Set up CodeMirror and extensions
     const state = EditorState.create({
       doc: ytext.toString(),
       extensions: [
         basicSetup,
+        updateListenerExtension,
         markdown(),
         yCollab(ytext, provider.awareness, {undoManager}),
         ...styles,
@@ -99,9 +136,8 @@ const useCodemirror = ({roomName}: {roomName: string}) => {
     return () => {
       provider?.destroy()
       view?.destroy()
-      yDoc?.destroy()
     }
-  }, [element, roomName])
+  }, [element, roomName, value, session])
 
   return {
     codemirrorElementRef: useCallback((node: HTMLElement | null) => {
diff --git a/apps/course-builder-web/src/app/tips/_components/edit-tip-form.tsx b/apps/course-builder-web/src/app/tips/_components/edit-tip-form.tsx
index 8402e039a..677912689 100644
--- a/apps/course-builder-web/src/app/tips/_components/edit-tip-form.tsx
+++ b/apps/course-builder-web/src/app/tips/_components/edit-tip-form.tsx
@@ -49,8 +49,15 @@ export function EditTipForm({tip}: {tip: Tip}) {
     api.tips.update.useMutation()
 
   const onSubmit = async (values: z.infer<typeof NewTipFormSchema>) => {
-    const {slug} = await updateTip({tipId: tip._id, ...values})
-    router.push(`/tips/${slug}`)
+    const updatedTip = await updateTip({tipId: tip._id, ...values})
+
+    if (!updatedTip) {
+      // handle edge case, e.g. toast an error message
+    } else {
+      const {slug} = updatedTip
+
+      router.push(`/tips/${slug}`)
+    }
   }
 
   const [activeToolbarTab, setActiveToolbarTab] = React.useState(
@@ -59,32 +66,39 @@ export function EditTipForm({tip}: {tip: Tip}) {
 
   return (
     <Form {...form}>
-      <form onSubmit={form.handleSubmit(onSubmit)}>
-        <div className="flex w-full items-center justify-between bg-gray-100 p-2">
+      <form
+        className="flex h-full flex-grow flex-col"
+        onSubmit={form.handleSubmit(onSubmit)}
+      >
+        <div className="flex h-9 w-full items-center justify-between bg-muted px-1">
           <Button className="px-0" asChild variant="link">
-            <Link href={`/tips/${tip.slug}`}>← Tip</Link>
+            <Link href={`/tips/${tip.slug}`} className="aspect-square">
+              ←
+            </Link>
           </Button>
           <Button
             type="submit"
             variant="default"
             size="sm"
+            className="h-7"
             disabled={updateTipStatus === 'loading'}
           >
-            Save Tip
+            Save
           </Button>
         </div>
-        <div className="flex h-full border-t">
+        <div className="flex h-full flex-grow border-t">
           <div className="grid grid-cols-12">
-            <div className="col-span-3 flex h-full flex-col space-y-5 border-r p-5">
+            <div className="col-span-3 flex h-full flex-col border-r">
               <TipPlayer
                 videoResourceId={tip.videoResourceId}
                 muxPlaybackId={tip.muxPlaybackId}
               />
+
               <FormField
                 control={form.control}
                 name="title"
                 render={({field}) => (
-                  <FormItem>
+                  <FormItem className="p-5">
                     <FormLabel className="text-lg font-bold">Title</FormLabel>
                     <FormDescription>
                       A title should summarize the tip and explain what it is
@@ -95,20 +109,29 @@ export function EditTipForm({tip}: {tip: Tip}) {
                   </FormItem>
                 )}
               />
+              <div className="flex max-h-screen items-end p-5 text-xs text-orange-600">
+                {tip._id}
+              </div>
             </div>
             <div className="col-span-6 flex h-full w-full flex-col justify-start space-y-5 border-r">
               <FormField
                 control={form.control}
                 name="body"
                 render={({field}) => (
-                  <FormItem className="h-full pt-5">
+                  <FormItem className="pt-5">
                     <FormLabel className="px-5 text-lg font-bold">
                       Content
                     </FormLabel>
                     <FormDescription className="px-5 pb-3">
                       Tip content in MDX.
                     </FormDescription>
-                    <CodemirrorEditor roomName={`tip-edit-${tip._id}`} />
+                    <CodemirrorEditor
+                      roomName={`${tip._id}`}
+                      value={tip.body}
+                      onChange={(data) => {
+                        form.setValue('body', data)
+                      }}
+                    />
                     <FormMessage />
                   </FormItem>
                 )}
@@ -126,7 +149,7 @@ export function EditTipForm({tip}: {tip: Tip}) {
               )}
             </div>
           </div>
-          <div className="border-l bg-gray-100">
+          <div className="border-l bg-muted">
             <div className="flex flex-col gap-1 p-1">
               <TooltipProvider delayDuration={0}>
                 {Array.from(TOOLBAR).map((item) => (
diff --git a/apps/course-builder-web/src/app/tips/_components/new-tip-form.tsx b/apps/course-builder-web/src/app/tips/_components/new-tip-form.tsx
index 01fde9cbc..f1c1821a8 100644
--- a/apps/course-builder-web/src/app/tips/_components/new-tip-form.tsx
+++ b/apps/course-builder-web/src/app/tips/_components/new-tip-form.tsx
@@ -48,7 +48,12 @@ export function NewTipForm() {
 
   const onSubmit = async (values: z.infer<typeof NewTipFormSchema>) => {
     const tip = await createTip(values)
-    router.push(`/tips/${tip.slug}`)
+
+    if (!tip) {
+      // handle edge, e.g. toast an error message
+    } else {
+      router.push(`/tips/${tip.slug}`)
+    }
   }
 
   return (
@@ -117,7 +122,7 @@ export function NewTipForm() {
           variant="default"
           disabled={videoResourceId.length === 0}
         >
-          Submit Tip
+          Create Draft Tip
         </Button>
       </form>
     </Form>
diff --git a/apps/course-builder-web/src/app/tips/_components/tip-assistant.tsx b/apps/course-builder-web/src/app/tips/_components/tip-assistant.tsx
index 65e5041bf..0f4676e3c 100644
--- a/apps/course-builder-web/src/app/tips/_components/tip-assistant.tsx
+++ b/apps/course-builder-web/src/app/tips/_components/tip-assistant.tsx
@@ -10,18 +10,48 @@ import {Tip} from '@/lib/tips'
 import {Button, ScrollArea, Textarea} from '@coursebuilder/ui'
 import {LoaderIcon, SparkleIcon} from 'lucide-react'
 import {EnterIcon} from '@sanity/icons'
+import {
+  type ChatCompletionRequestMessage,
+  ChatCompletionRequestMessageRoleEnum,
+} from 'openai-edge'
 
 export function TipAssistant({tip}: {tip: Tip}) {
+  const {mutate: sendTipChatMessage} = api.tips.chat.useMutation()
+  const [messages, setMessages] = React.useState<
+    ChatCompletionRequestMessage[]
+  >([])
+
+  const textareaRef = useRef<HTMLTextAreaElement>(null)
+
   const {mutateAsync: generateTitle, status: generateTitleStatus} =
     api.tips.generateTitle.useMutation()
 
+  useSocket({
+    room: tip._id,
+    onMessage: (messageEvent) => {
+      try {
+        const messageData = JSON.parse(messageEvent.data)
+
+        if (
+          messageData.name === 'tip.chat.completed' &&
+          messageData.requestId === tip._id
+        ) {
+          setMessages(messageData.body)
+        }
+      } catch (error) {
+        // noting to do
+      }
+    },
+  })
+
   return (
     <div className="flex h-full w-full flex-col justify-start">
       <h3 className="inline-flex p-5 pb-3 text-lg font-bold">Assistant</h3>
-      <ChatResponse requestIds={[tip.videoResourceId]} />
+      <TipChatResponse requestId={tip._id} />
       <div className="flex w-full flex-col items-start border-t">
         <div className="relative w-full">
           <Textarea
+            ref={textareaRef}
             className="w-full rounded-none border-0 border-b px-5 py-4 pr-10"
             placeholder="Type a message..."
             disabled={generateTitleStatus === 'loading'}
@@ -29,7 +59,17 @@ export function TipAssistant({tip}: {tip: Tip}) {
             onKeyDown={async (event) => {
               if (event.key === 'Enter' && !event.shiftKey) {
                 event.preventDefault()
-                // TODO: send message
+                sendTipChatMessage({
+                  tipId: tip._id,
+                  messages: [
+                    ...messages,
+                    {
+                      role: ChatCompletionRequestMessageRoleEnum.User,
+                      content: event.currentTarget.value,
+                    },
+                  ],
+                })
+                event.currentTarget.value = ''
               }
             }}
           />
@@ -37,13 +77,27 @@ export function TipAssistant({tip}: {tip: Tip}) {
             type="button"
             className="absolute right-2 top-2 flex h-6 w-6 items-center justify-center p-0"
             variant="outline"
-            onClick={() => {
-              // TODO: send message
+            onClick={async (event) => {
+              event.preventDefault()
+              if (textareaRef.current) {
+                sendTipChatMessage({
+                  tipId: tip._id,
+                  messages: [
+                    ...messages,
+                    {
+                      role: ChatCompletionRequestMessageRoleEnum.User,
+                      content: textareaRef.current?.value,
+                    },
+                  ],
+                })
+                textareaRef.current.value = ''
+              }
             }}
           >
             <EnterIcon className="w-4" />
           </Button>
         </div>
+
         <div className="p-5">
           <h3 className="flex pb-3 text-lg font-bold">Actions</h3>
           <Button
@@ -66,7 +120,7 @@ export function TipAssistant({tip}: {tip: Tip}) {
   )
 }
 
-export function ChatResponse({requestIds = []}: {requestIds: string[]}) {
+function TipChatResponse({requestId}: {requestId: string}) {
   const [messages, setMessages] = React.useState<
     {requestId: string; body: string}[]
   >([])
@@ -75,15 +129,15 @@ export function ChatResponse({requestIds = []}: {requestIds: string[]}) {
   const utils = api.useUtils()
 
   useSocket({
+    room: requestId,
     onMessage: (messageEvent) => {
       try {
         const messageData = JSON.parse(messageEvent.data)
 
-        console.log({requestIds, messageData})
-
         if (
           messageData.body !== STREAM_COMPLETE &&
-          requestIds.includes(messageData.requestId)
+          messageData.name == 'ai.message' &&
+          requestId === messageData.requestId
         ) {
           setMessages((messages) => [
             ...messages,
@@ -91,7 +145,6 @@ export function ChatResponse({requestIds = []}: {requestIds: string[]}) {
           ])
         }
         utils.module.invalidate()
-
         if (div.current) {
           div.current.scrollTop = div.current.scrollHeight
         }
diff --git a/apps/course-builder-web/src/app/tips/_components/tip-player.tsx b/apps/course-builder-web/src/app/tips/_components/tip-player.tsx
index 6d5646915..bcdb94ccc 100644
--- a/apps/course-builder-web/src/app/tips/_components/tip-player.tsx
+++ b/apps/course-builder-web/src/app/tips/_components/tip-player.tsx
@@ -4,13 +4,16 @@ import {type MuxPlayerProps} from '@mux/mux-player-react'
 import MuxPlayer from '@mux/mux-player-react/lazy'
 import * as React from 'react'
 import {api} from '@/trpc/react'
+import {cn} from '@coursebuilder/ui/utils/cn'
 
 export function TipPlayer({
   videoResourceId,
   muxPlaybackId,
+  className,
 }: {
   videoResourceId: string
   muxPlaybackId?: string
+  className?: string
 }) {
   const {data: videoResource} = api.videoResources.getById.useQuery({
     videoResourceId,
@@ -32,5 +35,11 @@ export function TipPlayer({
       ? videoResource?.muxPlaybackId
       : undefined)
 
-  return <MuxPlayer playbackId={playbackId} {...playerProps} />
+  return (
+    <MuxPlayer
+      playbackId={playbackId}
+      className={cn(className)}
+      {...playerProps}
+    />
+  )
 }
diff --git a/apps/course-builder-web/src/app/tips/page.tsx b/apps/course-builder-web/src/app/tips/page.tsx
index 7b3853a17..9b2c928ab 100644
--- a/apps/course-builder-web/src/app/tips/page.tsx
+++ b/apps/course-builder-web/src/app/tips/page.tsx
@@ -12,10 +12,8 @@ export default async function TipsListPage() {
   const tipsModule = await getTipsModule()
 
   return (
-    <div className="mx-auto flex w-full max-w-screen-sm flex-col py-5">
-      <h1 className="pb-3 text-lg font-bold">Create Tip</h1>
-      {ability.can('upload', 'Media') ? <CreateTip /> : null}
-      <div className="mt-8 flex flex-col space-y-3">
+    <div className="grid h-full flex-grow grid-cols-5 gap-3 bg-muted p-5">
+      <div className="col-span-3 flex h-full flex-grow flex-col space-y-2">
         <h2 className="text-lg font-bold">Published Tips</h2>
         {tipsModule.tips.map((tip) => (
           <Card key={tip._id}>
@@ -31,6 +29,10 @@ export default async function TipsListPage() {
           </Card>
         ))}
       </div>
+      <div className="col-span-2 h-full flex-grow">
+        <h1 className="pb-2 text-lg font-bold">Create Tip</h1>
+        {ability.can('upload', 'Media') ? <CreateTip /> : null}
+      </div>
     </div>
   )
 }
diff --git a/apps/course-builder-web/src/components/navigation.tsx b/apps/course-builder-web/src/components/navigation.tsx
index 833c7ddfa..c0ed1b666 100644
--- a/apps/course-builder-web/src/components/navigation.tsx
+++ b/apps/course-builder-web/src/components/navigation.tsx
@@ -21,7 +21,7 @@ const Navigation: React.FC<NavigationProps> = async ({
     <>
       <div
         className={cn(
-          'left-0 z-50 flex w-full flex-col items-center justify-center border-b border-foreground/5 bg-white/95 shadow shadow-gray-300/20 backdrop-blur-md print:hidden',
+          `relative z-50 flex h-[var(--nav-height)] w-full flex-col items-center justify-center border-b bg-background print:hidden`,
           navigationContainerClassName,
         )}
       >
diff --git a/apps/course-builder-web/src/components/navigation/links.tsx b/apps/course-builder-web/src/components/navigation/links.tsx
index 855e3fb68..d5cc46a65 100644
--- a/apps/course-builder-web/src/components/navigation/links.tsx
+++ b/apps/course-builder-web/src/components/navigation/links.tsx
@@ -53,7 +53,7 @@ export function Links({className}: {className?: string}) {
     <motion.nav
       aria-label="top"
       className={cn(
-        'relative mx-auto flex h-14 w-full items-center justify-between px-3 text-sm',
+        'relative mx-auto flex w-full items-center justify-between px-3 text-sm',
         className,
       )}
     >
@@ -69,7 +69,7 @@ export function Links({className}: {className?: string}) {
             redirect('/brand')
           }}
         >
-          <Logo />
+          Course Builder
         </Link>
         <div className="hidden items-center justify-start gap-2 font-medium md:flex lg:pl-2">
           {navigationLinks.map(({label, href, icon}) => {
@@ -91,7 +91,6 @@ export function Links({className}: {className?: string}) {
       <div className="flex items-center justify-end">
         <Login className="hidden md:flex" />
         <User className="hidden md:flex" />
-
         <NavToggle isMenuOpened={menuOpen} setMenuOpened={setMenuOpen} />
       </div>
       <AnimatePresence>
diff --git a/apps/course-builder-web/src/components/navigation/user.tsx b/apps/course-builder-web/src/components/navigation/user.tsx
index 3727a23a6..0fea7e911 100644
--- a/apps/course-builder-web/src/components/navigation/user.tsx
+++ b/apps/course-builder-web/src/components/navigation/user.tsx
@@ -42,7 +42,7 @@ export const User: React.FC<{className?: string}> = ({className}) => {
               default="mp"
             />
             <div className="flex flex-col pl-0.5">
-              <span className="inline-flex gap-0.5 text-sm font-bold leading-tight">
+              <span className="inline-flex items-center gap-0.5 text-sm font-bold leading-tight">
                 <span className="truncate sm:max-w-[8rem] lg:max-w-[11rem] xl:max-w-none">
                   {sessionData?.user?.name?.split(' ')[0]}
                 </span>{' '}
diff --git a/apps/course-builder-web/src/hooks/use-socket.ts b/apps/course-builder-web/src/hooks/use-socket.ts
index 71bae0542..fcfbfdbca 100644
--- a/apps/course-builder-web/src/hooks/use-socket.ts
+++ b/apps/course-builder-web/src/hooks/use-socket.ts
@@ -6,10 +6,11 @@ export function useSocket(options: {
   onMessage?: (event: WebSocketEventMap['message']) => void
   onClose?: (event: WebSocketEventMap['close']) => void
   onError?: (event: WebSocketEventMap['error']) => void
+  room?: string
 }) {
   return usePartySocket({
-    room: env.NEXT_PUBLIC_PARTYKIT_ROOM_NAME,
     host: env.NEXT_PUBLIC_PARTY_KIT_URL,
     ...options,
+    room: options.room ?? env.NEXT_PUBLIC_PARTYKIT_ROOM_NAME,
   })
 }
diff --git a/apps/course-builder-web/src/inngest/events.ts b/apps/course-builder-web/src/inngest/events.ts
index 653a51a70..8734f3aef 100644
--- a/apps/course-builder-web/src/inngest/events.ts
+++ b/apps/course-builder-web/src/inngest/events.ts
@@ -36,3 +36,23 @@ export type UserCreated = {
   name: typeof USER_CREATED_EVENT
   data: {}
 }
+
+export const TIP_CHAT_EVENT = 'tip/chat-event'
+
+export type TipChat = {
+  name: typeof TIP_CHAT_EVENT
+  data: {
+    tipId: string
+    messages: ChatCompletionRequestMessage[]
+  }
+}
+
+export const ARTICLE_CHAT_EVENT = 'article/chat-event'
+
+export type ArticleChat = {
+  name: typeof ARTICLE_CHAT_EVENT
+  data: {
+    articleId: string
+    messages: ChatCompletionRequestMessage[]
+  }
+}
diff --git a/apps/course-builder-web/src/inngest/functions/ai/tip-writer.ts b/apps/course-builder-web/src/inngest/functions/ai/tip-writer.ts
index bf7653695..73c80c82b 100644
--- a/apps/course-builder-web/src/inngest/functions/ai/tip-writer.ts
+++ b/apps/course-builder-web/src/inngest/functions/ai/tip-writer.ts
@@ -83,7 +83,7 @@ export const tipTitleAndSummaryWriter = inngest.createFunction(
 
     await step.run('Broadcast Completion', async () => {
       await fetch(
-        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${env.NEXT_PUBLIC_PARTYKIT_ROOM_NAME}`,
+        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${videoResource._id}`,
         {
           method: 'POST',
           body: JSON.stringify({
diff --git a/apps/course-builder-web/src/inngest/functions/ai/writer.ts b/apps/course-builder-web/src/inngest/functions/ai/writer.ts
index 51e2b1c62..3cd88a40e 100644
--- a/apps/course-builder-web/src/inngest/functions/ai/writer.ts
+++ b/apps/course-builder-web/src/inngest/functions/ai/writer.ts
@@ -58,7 +58,7 @@ export const writeAnEmail = inngest.createFunction(
 
     await step.run('Broadcast Completion', async () => {
       await fetch(
-        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${env.NEXT_PUBLIC_PARTYKIT_ROOM_NAME}`,
+        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${event.data.requestId}`,
         {
           method: 'POST',
           body: JSON.stringify({
diff --git a/apps/course-builder-web/src/inngest/functions/articles/chat.ts b/apps/course-builder-web/src/inngest/functions/articles/chat.ts
new file mode 100644
index 000000000..30e9fa589
--- /dev/null
+++ b/apps/course-builder-web/src/inngest/functions/articles/chat.ts
@@ -0,0 +1,139 @@
+import {inngest} from '@/inngest/inngest.server'
+import {ARTICLE_CHAT_EVENT, TIP_CHAT_EVENT} from '@/inngest/events'
+
+import {getTip} from '@/lib/tips'
+import {promptStep} from '@/lib/prompt-step'
+import {env} from '@/env.mjs'
+import {sanityQuery} from '@/server/sanity.server'
+import type {ChatCompletionRequestMessage} from 'openai-edge'
+import {promptActionExecutor} from '@/lib/prompt.action-executor'
+import {Liquid} from 'liquidjs'
+import {getArticle} from '@/lib/articles'
+
+export const articleChat = inngest.createFunction(
+  {
+    id: `article-chat`,
+    name: 'Article Chat',
+  },
+  {
+    event: ARTICLE_CHAT_EVENT,
+  },
+  async ({event, step}) => {
+    const article = await step.run(`load article`, async () => {
+      return await getArticle(event.data.articleId)
+    })
+
+    if (!article) {
+      throw new Error(`Article ${event.data.articleId} not found`)
+    }
+
+    const workflow = await step.run('Load Workflow', async () => {
+      return await sanityQuery(
+        `*[_type == "workflow" && trigger == "${ARTICLE_CHAT_EVENT}"][0]`,
+        {useCdn: false},
+      )
+    })
+
+    let messages: ChatCompletionRequestMessage[] = event.data.messages
+
+    const systemPromptAction = workflow.actions.find(
+      (action: {_type: string; role: string}) =>
+        action._type === 'prompt' && action.role === 'system',
+    )
+
+    console.log(systemPromptAction)
+
+    const systemPrompt = await step.run(`parse system prompt`, async () => {
+      try {
+        const engine = new Liquid()
+        return {
+          role: systemPromptAction.role,
+          content: await engine.parseAndRender(systemPromptAction.content, {
+            article,
+          }),
+        }
+      } catch (e: any) {
+        console.error(e.message)
+        return {
+          role: systemPromptAction.role,
+          content: systemPromptAction.content,
+        }
+      }
+    })
+
+    if (messages.length === 1 && systemPrompt) {
+      messages = [systemPrompt, ...messages]
+    }
+
+    const systemPromptIndex = workflow.actions.findIndex(
+      (item: any) =>
+        item.content === systemPrompt.content &&
+        item.role === systemPrompt.role,
+    )
+
+    workflow.actions.splice(systemPromptIndex, 1)
+
+    messages = await step.run('answer the user prompt', async () => {
+      const currentUserMessage = messages[messages.length - 1]
+      if (!currentUserMessage) {
+        throw new Error('No user message')
+      }
+      const engine = new Liquid()
+      currentUserMessage.content = await engine.parseAndRender(
+        currentUserMessage.content ?? '',
+        {
+          article,
+        },
+      )
+      return promptStep({
+        requestId: event.data.articleId,
+        promptMessages: messages,
+      })
+    })
+
+    let shouldContinue = Boolean(workflow && workflow.actions.length > 0)
+
+    // if the workflow has additional steps, do them now
+    while (shouldContinue) {
+      const action = workflow.actions.shift()
+      switch (action._type) {
+        case 'prompt':
+          messages = await step.run(action.title, async () => {
+            return await promptActionExecutor({
+              action,
+              input: {
+                article,
+              },
+              requestId: article._id,
+              messages,
+            })
+          })
+          break
+        default:
+          shouldContinue = false
+      }
+    }
+
+    await step.run('partykit broadcast', async () => {
+      return await fetch(
+        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${event.data.articleId}`,
+        {
+          method: 'POST',
+          body: JSON.stringify({
+            body: messages,
+            requestId: event.data.articleId,
+            name: 'article.chat.completed',
+          }),
+        },
+      )
+        .then((res) => {
+          return res.text()
+        })
+        .catch((e) => {
+          console.error(e)
+        })
+    })
+
+    return {article, messages}
+  },
+)
diff --git a/apps/course-builder-web/src/inngest/functions/tips/chat.ts b/apps/course-builder-web/src/inngest/functions/tips/chat.ts
new file mode 100644
index 000000000..bd05e214e
--- /dev/null
+++ b/apps/course-builder-web/src/inngest/functions/tips/chat.ts
@@ -0,0 +1,126 @@
+import {inngest} from '@/inngest/inngest.server'
+import {TIP_CHAT_EVENT} from '@/inngest/events'
+
+import {getTip} from '@/lib/tips'
+import {promptStep} from '@/lib/prompt-step'
+import {env} from '@/env.mjs'
+import {sanityQuery} from '@/server/sanity.server'
+import type {ChatCompletionRequestMessage} from 'openai-edge'
+import {promptActionExecutor} from '@/lib/prompt.action-executor'
+import {Liquid} from 'liquidjs'
+import {NonRetriableError} from 'inngest'
+
+export const tipChat = inngest.createFunction(
+  {
+    id: `tip-chat`,
+    name: 'Tip Chat',
+  },
+  {
+    event: TIP_CHAT_EVENT,
+  },
+  async ({event, step}) => {
+    const tip = await step.run(`load tip`, async () => {
+      return await getTip(event.data.tipId)
+    })
+
+    if (!tip) {
+      throw new NonRetriableError(`Tip not found for id (${event.data.tipId})`)
+    }
+
+    const workflow = await step.run('Load Workflow', async () => {
+      return await sanityQuery(
+        `*[_type == "workflow" && trigger == "${TIP_CHAT_EVENT}"][0]`,
+        {useCdn: false},
+      )
+    })
+
+    let messages: ChatCompletionRequestMessage[] = event.data.messages
+
+    const systemPromptAction = workflow.actions.find(
+      (action: {_type: string; role: string}) =>
+        action._type === 'prompt' && action.role === 'system',
+    )
+
+    const systemPrompt = await step.run(`parse system prompt`, async () => {
+      try {
+        const engine = new Liquid()
+        return {
+          role: systemPromptAction.role,
+          content: await engine.parseAndRender(systemPromptAction.content, {
+            tip,
+          }),
+        }
+      } catch (e: any) {
+        console.error(e.message)
+        return {
+          role: systemPromptAction.role,
+          content: systemPromptAction.content,
+        }
+      }
+    })
+
+    if (messages.length === 1 && systemPrompt) {
+      messages = [systemPrompt, ...messages]
+    }
+
+    const systemPromptIndex = workflow.actions.findIndex(
+      (item: any) =>
+        item.content === systemPrompt.content &&
+        item.role === systemPrompt.role,
+    )
+
+    workflow.actions.splice(systemPromptIndex, 1)
+
+    messages = await step.run('answer the user prompt', async () => {
+      return promptStep({
+        requestId: event.data.tipId,
+        promptMessages: messages,
+      })
+    })
+
+    let shouldContinue = Boolean(workflow && workflow.actions.length > 0)
+
+    // if the workflow has additional steps, do them now
+    while (shouldContinue) {
+      const action = workflow.actions.shift()
+      switch (action._type) {
+        case 'prompt':
+          messages = await step.run(action.title, async () => {
+            return await promptActionExecutor({
+              action,
+              input: {
+                tip,
+              },
+              requestId: tip._id,
+              messages,
+            })
+          })
+          break
+        default:
+          shouldContinue = false
+      }
+    }
+
+    await step.run('partykit broadcast', async () => {
+      return await fetch(
+        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${event.data.tipId}`,
+        {
+          method: 'POST',
+          body: JSON.stringify({
+            body: messages,
+            requestId: event.data.tipId,
+            name: 'tip.chat.completed',
+          }),
+        },
+      )
+        .then((res) => {
+          return res.text()
+        })
+        .catch((e) => {
+          console.error(e)
+        })
+    })
+
+    return {tip, messages}
+  },
+)
diff --git a/apps/course-builder-web/src/inngest/functions/transcript-ready.ts b/apps/course-builder-web/src/inngest/functions/transcript-ready.ts
index 5169af33f..c673b16ab 100644
--- a/apps/course-builder-web/src/inngest/functions/transcript-ready.ts
+++ b/apps/course-builder-web/src/inngest/functions/transcript-ready.ts
@@ -60,7 +60,7 @@ export const transcriptReady = inngest.createFunction(
 
     await step.run('send the transcript to the party', async () => {
       await fetch(
-        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${env.NEXT_PUBLIC_PARTYKIT_ROOM_NAME}`,
+        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${event.data.videoResourceId}`,
         {
           method: 'POST',
           body: JSON.stringify({
diff --git a/apps/course-builder-web/src/inngest/functions/video-uploaded.ts b/apps/course-builder-web/src/inngest/functions/video-uploaded.ts
index 4da9d87c3..85625d6d0 100644
--- a/apps/course-builder-web/src/inngest/functions/video-uploaded.ts
+++ b/apps/course-builder-web/src/inngest/functions/video-uploaded.ts
@@ -118,7 +118,7 @@ export const videoUploaded = inngest.createFunction(
 
     await step.run('announce video resource created', async () => {
       await fetch(
-        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${env.NEXT_PUBLIC_PARTYKIT_ROOM_NAME}`,
+        `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${videoResource._id}`,
         {
           method: 'POST',
           body: JSON.stringify({
diff --git a/apps/course-builder-web/src/inngest/inngest.config.ts b/apps/course-builder-web/src/inngest/inngest.config.ts
index f07d1ba69..1f7505984 100644
--- a/apps/course-builder-web/src/inngest/inngest.config.ts
+++ b/apps/course-builder-web/src/inngest/inngest.config.ts
@@ -13,6 +13,8 @@ import {weeklySignupDigest} from '@/inngest/functions/notify/creator/weekly-sign
 import {userSignupAdminEmail} from '@/inngest/functions/notify/creator/user-signup'
 import {postmarkWebhook} from '@/inngest/functions/postmark/postmarks-webhooks-handler'
 import {cloudinaryAssetCreated} from '@/inngest/functions/cloudinary/cloudinary-webhooks-handlers'
+import {tipChat} from '@/inngest/functions/tips/chat'
+import {articleChat} from '@/inngest/functions/articles/chat'
 
 export const inngestConfig = {
   client: inngest,
@@ -29,5 +31,7 @@ export const inngestConfig = {
     userSignupAdminEmail,
     postmarkWebhook,
     cloudinaryAssetCreated,
+    tipChat,
+    articleChat,
   ],
 }
diff --git a/apps/course-builder-web/src/inngest/inngest.server.ts b/apps/course-builder-web/src/inngest/inngest.server.ts
index 340753d75..6c95100a8 100644
--- a/apps/course-builder-web/src/inngest/inngest.server.ts
+++ b/apps/course-builder-web/src/inngest/inngest.server.ts
@@ -6,6 +6,10 @@ import {
   type AITipWritingRequested,
   type AIWritingRequestCompleted,
   type AIWritingRequested,
+  ARTICLE_CHAT_EVENT,
+  ArticleChat,
+  TIP_CHAT_EVENT,
+  TipChat,
   type USER_CREATED_EVENT,
   type UserCreated,
 } from '@/inngest/events'
@@ -56,6 +60,8 @@ type Events = {
   [USER_CREATED_EVENT]: UserCreated
   [POSTMARK_WEBHOOK_EVENT]: PostmarkWebhook
   [CLOUDINARY_WEBHOOK_EVENT]: CloudinaryWebhook
+  [TIP_CHAT_EVENT]: TipChat
+  [ARTICLE_CHAT_EVENT]: ArticleChat
 }
 export const inngest = new Inngest({
   id: 'gpt-4-ai-chains',
diff --git a/apps/course-builder-web/src/lib/ability.ts b/apps/course-builder-web/src/lib/ability.ts
index be1b5e813..16fea6ddd 100644
--- a/apps/course-builder-web/src/lib/ability.ts
+++ b/apps/course-builder-web/src/lib/ability.ts
@@ -21,6 +21,7 @@ type Abilities =
   | ['view', 'Profile' | User]
   | ['upload', 'Media']
   | ['edit', 'Tip']
+  | ['edit', 'Article']
   | ['edit', 'Module']
 
 export type AppAbility = MongoAbility<Abilities>
@@ -43,6 +44,7 @@ export function getAbilityRules(options: GetAbilityOptions = {}) {
     can('upload', 'Media')
     can('edit', 'Tip')
     can('edit', 'Module')
+    can('edit', 'Article')
   }
 
   if (options.user) {
diff --git a/apps/course-builder-web/src/lib/articles.ts b/apps/course-builder-web/src/lib/articles.ts
new file mode 100644
index 000000000..e2f143ef3
--- /dev/null
+++ b/apps/course-builder-web/src/lib/articles.ts
@@ -0,0 +1,26 @@
+import {z} from 'zod'
+import {sanityQuery} from '@/server/sanity.server'
+
+export const ArticleSchema = z.object({
+  _id: z.string(),
+  _type: z.literal('article'),
+  _updatedAt: z.string(),
+  title: z.string(),
+  summary: z.string(),
+  body: z.string(),
+  slug: z.string(),
+})
+
+export type Article = z.infer<typeof ArticleSchema>
+
+export async function getArticle(slugOrId: string) {
+  return sanityQuery<Article | null>(`*[_type == "article" && (_id == "${slugOrId}" || slug.current == "${slugOrId}")][0]{
+          _id,
+          _type,
+          "_updatedAt": ^._updatedAt,
+          title,
+          summary,
+          body,
+          "slug": slug.current,
+  }`)
+}
diff --git a/apps/course-builder-web/src/lib/streaming-chunk-publisher.ts b/apps/course-builder-web/src/lib/streaming-chunk-publisher.ts
index 86ae2aa88..e8babc97e 100755
--- a/apps/course-builder-web/src/lib/streaming-chunk-publisher.ts
+++ b/apps/course-builder-web/src/lib/streaming-chunk-publisher.ts
@@ -88,13 +88,14 @@ export class OpenAIStreamingDataPartykitChunkPublisher {
  * @param requestId
  */
 export const publishToPartykit = async (body: string, requestId: string) => {
-  const partyUrl = `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${env.NEXT_PUBLIC_PARTYKIT_ROOM_NAME}`
+  const partyUrl = `${env.NEXT_PUBLIC_PARTY_KIT_URL}/party/${requestId}`
 
   return await fetch(partyUrl, {
     method: 'POST',
     body: JSON.stringify({
       body,
       requestId,
+      name: 'ai.message',
     }),
   }).catch((e) => {
     console.error(e)
diff --git a/apps/course-builder-web/src/lib/tips.ts b/apps/course-builder-web/src/lib/tips.ts
index 996c70792..c749d73bc 100644
--- a/apps/course-builder-web/src/lib/tips.ts
+++ b/apps/course-builder-web/src/lib/tips.ts
@@ -17,7 +17,7 @@ const TipSchema = z.object({
 export type Tip = z.infer<typeof TipSchema>
 
 export async function getTip(slugOrId: string) {
-  return await sanityQuery<Tip>(`*[_type == "tip" && (_id == "${slugOrId}" || slug.current == "${slugOrId}")][0]{
+  return await sanityQuery<Tip | null>(`*[_type == "tip" && (_id == "${slugOrId}" || slug.current == "${slugOrId}")][0]{
           _id,
           _type,
           "_updatedAt": ^._updatedAt,
diff --git a/apps/course-builder-web/src/styles/globals.css b/apps/course-builder-web/src/styles/globals.css
index e34a58872..79d34637f 100644
--- a/apps/course-builder-web/src/styles/globals.css
+++ b/apps/course-builder-web/src/styles/globals.css
@@ -4,6 +4,10 @@
 
 @layer base {
   :root {
+    --nav-height: 3.5rem;
+
+    /* shadcnui */
+
     --background: 0 0% 100%;
     --foreground: 222.2 84% 4.9%;
 
diff --git a/apps/course-builder-web/src/trpc/api/root.ts b/apps/course-builder-web/src/trpc/api/root.ts
index 385a99bae..0cb877645 100644
--- a/apps/course-builder-web/src/trpc/api/root.ts
+++ b/apps/course-builder-web/src/trpc/api/root.ts
@@ -5,6 +5,7 @@ import {tipsRouter} from '@/trpc/api/routers/tips'
 import {videoResourceRouter} from '@/trpc/api/routers/videoResource'
 import {abilityRouter} from '@/trpc/api/routers/ability'
 import {imageResourceRouter} from '@/trpc/api/routers/imageResource'
+import {articlesRouter} from '@/trpc/api/routers/articles'
 
 /**
  * This is the primary router for your server.
@@ -18,6 +19,7 @@ export const appRouter = createTRPCRouter({
   videoResources: videoResourceRouter,
   ability: abilityRouter,
   imageResources: imageResourceRouter,
+  articles: articlesRouter,
 })
 
 // export type definition of API
diff --git a/apps/course-builder-web/src/trpc/api/routers/articles.ts b/apps/course-builder-web/src/trpc/api/routers/articles.ts
new file mode 100644
index 000000000..aebce25a3
--- /dev/null
+++ b/apps/course-builder-web/src/trpc/api/routers/articles.ts
@@ -0,0 +1,132 @@
+import {z} from 'zod'
+import {getServerAuthSession} from '@/server/auth'
+import {getAbility} from '@/lib/ability'
+import {
+  createTRPCRouter,
+  protectedProcedure,
+  publicProcedure,
+} from '@/trpc/api/trpc'
+import {sanityMutation} from '@/server/sanity.server'
+import {v4} from 'uuid'
+import slugify from '@sindresorhus/slugify'
+import {customAlphabet} from 'nanoid'
+import {getArticle} from '@/lib/articles'
+import {toChicagoTitleCase} from '@/utils/chicagor-title'
+import {inngest} from '@/inngest/inngest.server'
+import {ARTICLE_CHAT_EVENT, TIP_CHAT_EVENT} from '@/inngest/events'
+import {getTip} from '@/lib/tips'
+const nanoid = customAlphabet('1234567890abcdefghijklmnopqrstuvwxyz', 5)
+
+export const articlesRouter = createTRPCRouter({
+  get: publicProcedure
+    .input(
+      z.object({
+        articleId: z.string(),
+      }),
+    )
+    .query(async ({ctx, input}) => {
+      return await getArticle(input.articleId)
+    }),
+  chat: protectedProcedure
+    .input(
+      z.object({
+        articleId: z.string(),
+        messages: z.array(z.any()),
+      }),
+    )
+    .mutation(async ({ctx, input}) => {
+      const session = await getServerAuthSession()
+      const ability = getAbility({user: session?.user})
+      if (!ability.can('upload', 'Media')) {
+        throw new Error('Unauthorized')
+      }
+
+      await inngest.send({
+        name: ARTICLE_CHAT_EVENT,
+        data: {
+          articleId: input.articleId,
+          messages: input.messages,
+        },
+      })
+
+      return await getArticle(input.articleId)
+    }),
+  create: protectedProcedure
+    .input(
+      z.object({
+        title: z.string(),
+      }),
+    )
+    .mutation(async ({ctx, input}) => {
+      const session = await getServerAuthSession()
+      const ability = getAbility({user: session?.user})
+      if (!ability.can('upload', 'Media')) {
+        throw new Error('Unauthorized')
+      }
+
+      const newArticleId = v4()
+
+      await sanityMutation([
+        {
+          createOrReplace: {
+            _id: newArticleId,
+            _type: 'article',
+            state: 'draft',
+            title: toChicagoTitleCase(input.title),
+            slug: {
+              current: slugify(`${input.title}~${nanoid()}`),
+            },
+          },
+        },
+      ])
+
+      return getArticle(newArticleId)
+    }),
+  update: protectedProcedure
+    .input(
+      z.object({
+        articleId: z.string(),
+        title: z.string(),
+        body: z.string().optional().nullable(),
+      }),
+    )
+    .mutation(async ({ctx, input}) => {
+      const session = await getServerAuthSession()
+      const ability = getAbility({user: session?.user})
+      if (!ability.can('upload', 'Media')) {
+        throw new Error('Unauthorized')
+      }
+
+      const currentArticle = await getArticle(input.articleId)
+
+      if (input.title !== currentArticle?.title) {
+        await sanityMutation([
+          {
+            patch: {
+              id: input.articleId,
+              set: {
+                'slug.current': `${slugify(input.title)}~${nanoid()}`,
+                title: toChicagoTitleCase(input.title),
+              },
+            },
+          },
+        ])
+      }
+
+      await sanityMutation(
+        [
+          {
+            patch: {
+              id: input.articleId,
+              set: {
+                body: input.body,
+              },
+            },
+          },
+        ],
+        {returnDocuments: true},
+      )
+
+      return getArticle(input.articleId)
+    }),
+})
diff --git a/apps/course-builder-web/src/trpc/api/routers/tips.ts b/apps/course-builder-web/src/trpc/api/routers/tips.ts
index b466b493a..fe0862750 100644
--- a/apps/course-builder-web/src/trpc/api/routers/tips.ts
+++ b/apps/course-builder-web/src/trpc/api/routers/tips.ts
@@ -13,46 +13,10 @@ import slugify from '@sindresorhus/slugify'
 
 import {customAlphabet} from 'nanoid'
 import {inngest} from '@/inngest/inngest.server'
-import {AI_TIP_WRITING_REQUESTED_EVENT} from '@/inngest/events'
+import {AI_TIP_WRITING_REQUESTED_EVENT, TIP_CHAT_EVENT} from '@/inngest/events'
+import {toChicagoTitleCase} from '@/utils/chicagor-title'
 const nanoid = customAlphabet('1234567890abcdefghijklmnopqrstuvwxyz', 5)
 
-function toChicagoTitleCase(slug: string): string {
-  const minorWords = new Set<string>([
-    'and',
-    'but',
-    'for',
-    'or',
-    'nor',
-    'the',
-    'a',
-    'an',
-    'as',
-    'at',
-    'by',
-    'for',
-    'in',
-    'of',
-    'on',
-    'per',
-    'to',
-  ])
-
-  return slug
-    .replace(/-/g, ' ')
-    .split(' ')
-    .map((word, index, array) => {
-      if (
-        index > 0 &&
-        index < array.length - 1 &&
-        minorWords.has(word.toLowerCase())
-      ) {
-        return word.toLowerCase()
-      }
-      return word.charAt(0).toUpperCase() + word.substring(1).toLowerCase()
-    })
-    .join(' ')
-}
-
 export const tipsRouter = createTRPCRouter({
   get: publicProcedure
     .input(
@@ -61,6 +25,30 @@ export const tipsRouter = createTRPCRouter({
       }),
     )
     .query(async ({ctx, input}) => {
+      return await getTip(input.tipId)
+    }),
+  chat: protectedProcedure
+    .input(
+      z.object({
+        tipId: z.string(),
+        messages: z.array(z.any()),
+      }),
+    )
+    .mutation(async ({ctx, input}) => {
+      const session = await getServerAuthSession()
+      const ability = getAbility({user: session?.user})
+      if (!ability.can('upload', 'Media')) {
+        throw new Error('Unauthorized')
+      }
+
+      await inngest.send({
+        name: TIP_CHAT_EVENT,
+        data: {
+          tipId: input.tipId,
+          messages: input.messages,
+        },
+      })
+
       return await getTip(input.tipId)
     }),
   create: protectedProcedure
@@ -139,18 +127,39 @@ export const tipsRouter = createTRPCRouter({
         throw new Error('Unauthorized')
       }
 
-      await sanityMutation([
-        {
-          patch: {
-            id: input.tipId,
-            set: {
-              'slug.current': `${slugify(input.title)}~${nanoid()}`,
-              title: toChicagoTitleCase(input.title),
-              body: input.body,
+      const currentTip = await getTip(input.tipId)
+
+      if (!currentTip) {
+        throw new Error('Not found')
+      }
+
+      if (input.title !== currentTip.title) {
+        await sanityMutation([
+          {
+            patch: {
+              id: input.tipId,
+              set: {
+                'slug.current': `${slugify(input.title)}~${nanoid()}`,
+                title: toChicagoTitleCase(input.title),
+              },
             },
           },
-        },
-      ])
+        ])
+      }
+
+      await sanityMutation(
+        [
+          {
+            patch: {
+              id: input.tipId,
+              set: {
+                body: input.body,
+              },
+            },
+          },
+        ],
+        {returnDocuments: true},
+      )
 
       return await getTip(input.tipId)
     }),
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index cf0ee87d4..e4dd3a507 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -151,10 +151,13 @@ importers:
         version: 6.2.3
       '@codemirror/language-data':
         specifier: ^6.3.1
-        version: 6.3.1(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+        version: 6.3.1(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/state':
         specifier: ^6.3.3
         version: 6.3.3
+      '@codemirror/view':
+        specifier: ^6.22.3
+        version: 6.22.3
       '@coursebuilder/ui':
         specifier: ^1.0.1
         version: link:../../packages/ui
@@ -170,6 +173,9 @@ importers:
       '@mdx-js/react':
         specifier: ^3.0.0
         version: 3.0.0(@types/react@18.2.37)(react@18.2.0)
+      '@msgpack/msgpack':
+        specifier: 3.0.0-beta2
+        version: 3.0.0-beta2
       '@mux/mux-player-react':
         specifier: ^2.2.0
         version: 2.2.0(@types/react-dom@18.2.15)(@types/react@18.2.37)(react-dom@18.2.0)(react@18.2.0)
@@ -297,7 +303,7 @@ importers:
         specifier: 5.7.1-canary.65ab2fd
         version: 5.7.1-canary.65ab2fd(next@14.0.1)(react@18.2.0)(uploadthing@5.7.5-canary.65ab2fd)
       ai:
-        specifier: ^2.2.20
+        specifier: ^2.2.22
         version: 2.2.22(react@18.2.0)(solid-js@1.8.5)(svelte@4.2.3)(vue@3.3.8)
       aws-sdk:
         specifier: ^2.1483.0
@@ -451,7 +457,7 @@ importers:
         version: 9.0.1
       y-codemirror.next:
         specifier: ^0.3.2
-        version: 0.3.2(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(yjs@13.6.10)
+        version: 0.3.2(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(yjs@13.6.10)
       y-partykit:
         specifier: ^0.0.10
         version: 0.0.10
@@ -467,6 +473,9 @@ importers:
       zod:
         specifier: ^3.22.4
         version: 3.22.4
+      zustand:
+        specifier: ^4.4.7
+        version: 4.4.7(@types/react@18.2.37)(react@18.2.0)
     devDependencies:
       '@mux/mux-node':
         specifier: ^7.3.2
@@ -533,7 +542,7 @@ importers:
         version: 3.1.0
       prettier-plugin-tailwindcss:
         specifier: ^0.5.7
-        version: 0.5.7(prettier@3.1.0)
+        version: 0.5.7(@ianvs/prettier-plugin-sort-imports@4.1.1)(prettier@3.1.0)
       tailwindcss:
         specifier: ^3.3.3
         version: 3.3.5
@@ -2849,7 +2858,7 @@ packages:
     resolution: {integrity: sha512-eGB0cRVyoJpeyGJx2re5sbd9R316a61sY73xwnqm4cwGpb+OxCK2gc651RxGiN7H4w6LY1RpysUgeGLmj5B3+g==}
     dev: true
 
-  /@codemirror/autocomplete@6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1):
+  /@codemirror/autocomplete@6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1):
     resolution: {integrity: sha512-LCPH3W+hl5vcO7OzEQgX6NpKuKVyiKFLGAy7FXROF6nUpsWUdQEgUb3fe/g7B0E1KZCRFfgzdKASt6Wly2UOBg==}
     peerDependencies:
       '@codemirror/language': ^6.0.0
@@ -2859,7 +2868,7 @@ packages:
     dependencies:
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       '@lezer/common': 1.1.1
     dev: false
 
@@ -2868,7 +2877,7 @@ packages:
     dependencies:
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       '@lezer/common': 1.1.1
     dev: false
 
@@ -2890,10 +2899,10 @@ packages:
       '@lezer/cpp': 1.1.1
     dev: false
 
-  /@codemirror/lang-css@6.2.1(@codemirror/view@6.22.0):
+  /@codemirror/lang-css@6.2.1(@codemirror/view@6.22.3):
     resolution: {integrity: sha512-/UNWDNV5Viwi/1lpr/dIXJNWiwDxpw13I4pTUAsNxZdg6E0mI2kTQb0P2iHczg1Tu+H4EBgJR+hYhKiHKko7qg==}
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
       '@lezer/common': 1.1.1
@@ -2905,12 +2914,12 @@ packages:
   /@codemirror/lang-html@6.4.7:
     resolution: {integrity: sha512-y9hWSSO41XlcL4uYwWyk0lEgTHcelWWfRuqmvcAmxfCs0HNWZdriWo/EU43S63SxEZpc1Hd50Itw7ktfQvfkUg==}
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
-      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.22.0)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
+      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.22.3)
       '@codemirror/lang-javascript': 6.2.1
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       '@lezer/common': 1.1.1
       '@lezer/css': 1.1.4
       '@lezer/html': 1.3.7
@@ -2926,11 +2935,11 @@ packages:
   /@codemirror/lang-javascript@6.2.1:
     resolution: {integrity: sha512-jlFOXTejVyiQCW3EQwvKH0m99bUYIw40oPmFjSX2VS78yzfe0HELZ+NEo9Yfo1MkGRpGlj3Gnu4rdxV1EnAs5A==}
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/language': 6.9.2
       '@codemirror/lint': 6.4.2
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       '@lezer/common': 1.1.1
       '@lezer/javascript': 1.4.9
     dev: false
@@ -2942,10 +2951,10 @@ packages:
       '@lezer/json': 1.0.1
     dev: false
 
-  /@codemirror/lang-less@6.0.1(@codemirror/view@6.22.0):
+  /@codemirror/lang-less@6.0.1(@codemirror/view@6.22.3):
     resolution: {integrity: sha512-ABcsKBjLbyPZwPR5gePpc8jEKCQrFF4pby2WlMVdmJOOr7OWwwyz8DZonPx/cKDE00hfoSLc8F7yAcn/d6+rTQ==}
     dependencies:
-      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.22.0)
+      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.22.3)
       '@codemirror/language': 6.9.2
       '@lezer/highlight': 1.2.0
       '@lezer/lr': 1.3.14
@@ -2956,11 +2965,11 @@ packages:
   /@codemirror/lang-markdown@6.2.3:
     resolution: {integrity: sha512-wCewRLWpdefWi7uVkHIDiE8+45Fe4buvMDZkihqEom5uRUQrl76Zb13emjeK3W+8pcRgRfAmwelURBbxNEKCIg==}
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/lang-html': 6.4.7
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       '@lezer/common': 1.1.1
       '@lezer/markdown': 1.1.2
     dev: false
@@ -2975,10 +2984,10 @@ packages:
       '@lezer/php': 1.0.1
     dev: false
 
-  /@codemirror/lang-python@6.1.3(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1):
+  /@codemirror/lang-python@6.1.3(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1):
     resolution: {integrity: sha512-S9w2Jl74hFlD5nqtUMIaXAq9t5WlM0acCkyuQWUUSvZclk1sV+UfnpFiZzuZSG+hfEaOmxKR5UxY/Uxswn7EhQ==}
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/language': 6.9.2
       '@lezer/python': 1.1.9
     transitivePeerDependencies:
@@ -2994,10 +3003,10 @@ packages:
       '@lezer/rust': 1.0.1
     dev: false
 
-  /@codemirror/lang-sass@6.0.2(@codemirror/view@6.22.0):
+  /@codemirror/lang-sass@6.0.2(@codemirror/view@6.22.3):
     resolution: {integrity: sha512-l/bdzIABvnTo1nzdY6U+kPAC51czYQcOErfzQ9zSm9D8GmNPD0WTW8st/CJwBTPLO8jlrbyvlSEcN20dc4iL0Q==}
     dependencies:
-      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.22.0)
+      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.22.3)
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
       '@lezer/common': 1.1.1
@@ -3006,10 +3015,10 @@ packages:
       - '@codemirror/view'
     dev: false
 
-  /@codemirror/lang-sql@6.5.4(@codemirror/view@6.22.0)(@lezer/common@1.1.1):
+  /@codemirror/lang-sql@6.5.4(@codemirror/view@6.22.3)(@lezer/common@1.1.1):
     resolution: {integrity: sha512-5Gq7fYtT/5HbNyIG7a8vYaqOYQU3JbgtBe3+derkrFUXRVcjkf8WVgz++PIbMFAQsOFMDdDR+uiNM8ZRRuXH+w==}
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
       '@lezer/highlight': 1.2.0
@@ -3038,10 +3047,10 @@ packages:
       '@lezer/lr': 1.3.14
     dev: false
 
-  /@codemirror/lang-xml@6.0.2(@codemirror/view@6.22.0):
+  /@codemirror/lang-xml@6.0.2(@codemirror/view@6.22.3):
     resolution: {integrity: sha512-JQYZjHL2LAfpiZI2/qZ/qzDuSqmGKMwyApYmEUUCTxLM4MWS7sATUEfIguZQr9Zjx/7gcdnewb039smF6nC2zw==}
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
       '@lezer/common': 1.1.1
@@ -3050,26 +3059,26 @@ packages:
       - '@codemirror/view'
     dev: false
 
-  /@codemirror/language-data@6.3.1(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1):
+  /@codemirror/language-data@6.3.1(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1):
     resolution: {integrity: sha512-p6jhJmvhGe1TG1EGNhwH7nFWWFSTJ8NDKnB2fVx5g3t+PpO0+63R7GJNxjS0TmmH3cdMxZbzejsik+rlEh1EyQ==}
     dependencies:
       '@codemirror/lang-angular': 0.1.2
       '@codemirror/lang-cpp': 6.0.2
-      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.22.0)
+      '@codemirror/lang-css': 6.2.1(@codemirror/view@6.22.3)
       '@codemirror/lang-html': 6.4.7
       '@codemirror/lang-java': 6.0.1
       '@codemirror/lang-javascript': 6.2.1
       '@codemirror/lang-json': 6.0.1
-      '@codemirror/lang-less': 6.0.1(@codemirror/view@6.22.0)
+      '@codemirror/lang-less': 6.0.1(@codemirror/view@6.22.3)
       '@codemirror/lang-markdown': 6.2.3
       '@codemirror/lang-php': 6.0.1
-      '@codemirror/lang-python': 6.1.3(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/lang-python': 6.1.3(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/lang-rust': 6.0.1
-      '@codemirror/lang-sass': 6.0.2(@codemirror/view@6.22.0)
-      '@codemirror/lang-sql': 6.5.4(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/lang-sass': 6.0.2(@codemirror/view@6.22.3)
+      '@codemirror/lang-sql': 6.5.4(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/lang-vue': 0.1.2
       '@codemirror/lang-wast': 6.0.1
-      '@codemirror/lang-xml': 6.0.2(@codemirror/view@6.22.0)
+      '@codemirror/lang-xml': 6.0.2(@codemirror/view@6.22.3)
       '@codemirror/language': 6.9.2
       '@codemirror/legacy-modes': 6.3.3
     transitivePeerDependencies:
@@ -3082,7 +3091,7 @@ packages:
     resolution: {integrity: sha512-QGTQXSpAKDIzaSE96zNK1UfIUhPgkT1CLjh1N5qVzZuxgsEOhz5RqaN8QCIdyOQklGLx3MgHd9YrE3X3+Pl1ow==}
     dependencies:
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       '@lezer/common': 1.1.1
       '@lezer/highlight': 1.2.0
       '@lezer/lr': 1.3.14
@@ -3099,7 +3108,7 @@ packages:
     resolution: {integrity: sha512-wzRkluWb1ptPKdzlsrbwwjYCPLgzU6N88YBAmlZi8WFyuiEduSd05MnJYNogzyc8rPK7pj6m95ptUApc8sHKVA==}
     dependencies:
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       crelt: 1.0.6
     dev: false
 
@@ -3107,7 +3116,7 @@ packages:
     resolution: {integrity: sha512-YoTrvjv9e8EbPs58opjZKyJ3ewFrVSUzQ/4WXlULQLSDDr1nGPJ67mMXFNNVYwdFhybzhrzrtqgHmtpJwIF+8g==}
     dependencies:
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       crelt: 1.0.6
     dev: false
 
@@ -3120,12 +3129,12 @@ packages:
     dependencies:
       '@codemirror/language': 6.9.2
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       '@lezer/highlight': 1.2.0
     dev: false
 
-  /@codemirror/view@6.22.0:
-    resolution: {integrity: sha512-6zLj4YIoIpfTGKrDMTbeZRpa8ih4EymMCKmddEDcJWrCdp/N1D46B38YEz4creTb4T177AVS9EyXkLeC/HL2jA==}
+  /@codemirror/view@6.22.3:
+    resolution: {integrity: sha512-rqnq+Zospwoi3x1vZ8BGV1MlRsaGljX+6qiGYmIpJ++M+LCC+wjfDaPklhwpWSgv7pr/qx29KiAKQBH5+DOn4w==}
     dependencies:
       '@codemirror/state': 6.3.3
       style-mod: 4.1.0
@@ -4789,6 +4798,11 @@ packages:
       react: 18.2.0
     dev: false
 
+  /@msgpack/msgpack@3.0.0-beta2:
+    resolution: {integrity: sha512-y+l1PNV0XDyY8sM3YtuMLK5vE3/hkfId+Do8pLo/OPxfxuFAUwcGz3oiiUuV46/aBpwTzZ+mRWVMtlSKbradhw==}
+    engines: {node: '>= 14'}
+    dev: false
+
   /@mux/mux-node@7.3.3:
     resolution: {integrity: sha512-t98SW0rhUP56Qn3vly+NApzy7Ebo51fcMYVQL379dpU5exsCoRBYc9lf6a4V+U0fXJ4Ke2asfToXfXMvfsMC+Q==}
     engines: {node: '>=14'}
@@ -7104,12 +7118,12 @@ packages:
       react: ^18
       styled-components: ^5.2 || ^6
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/commands': 6.3.0
       '@codemirror/lang-javascript': 6.2.1
       '@codemirror/language': 6.9.2
       '@codemirror/search': 6.5.4
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       '@juggle/resize-observer': 3.4.0
       '@lezer/highlight': 1.2.0
       '@rexxars/react-json-inspector': 8.0.1(react@18.2.0)
@@ -7117,7 +7131,7 @@ packages:
       '@sanity/color': 2.2.5
       '@sanity/icons': 2.7.0(react@18.2.0)
       '@sanity/ui': 1.9.3(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0)(styled-components@5.2.3)
-      '@uiw/react-codemirror': 4.21.21(@babel/runtime@7.23.2)(@codemirror/autocomplete@6.11.0)(@codemirror/language@6.9.2)(@codemirror/lint@6.4.2)(@codemirror/search@6.5.4)(@codemirror/state@6.3.3)(@codemirror/theme-one-dark@6.1.2)(@codemirror/view@6.22.0)(codemirror@6.0.1)(react-dom@18.2.0)(react@18.2.0)
+      '@uiw/react-codemirror': 4.21.21(@babel/runtime@7.23.2)(@codemirror/autocomplete@6.11.0)(@codemirror/language@6.9.2)(@codemirror/lint@6.4.2)(@codemirror/search@6.5.4)(@codemirror/state@6.3.3)(@codemirror/theme-one-dark@6.1.2)(@codemirror/view@6.22.3)(codemirror@6.0.1)(react-dom@18.2.0)(react@18.2.0)
       hashlru: 2.3.0
       is-hotkey: 0.1.8
       json5: 2.2.3
@@ -8238,7 +8252,6 @@ packages:
       typescript: 5.2.2
     transitivePeerDependencies:
       - supports-color
-    dev: false
 
   /@typescript-eslint/scope-manager@6.11.0:
     resolution: {integrity: sha512-0A8KoVvIURG4uhxAdjSaxy8RdRE//HztaZdG8KiHLP8WOXSk0vlF7Pvogv+vlJA5Rnjj/wDcFENvDaHb+gKd1A==}
@@ -8341,7 +8354,7 @@ packages:
       '@ucast/core': 1.10.2
     dev: false
 
-  /@uiw/codemirror-extensions-basic-setup@4.21.21(@codemirror/autocomplete@6.11.0)(@codemirror/commands@6.3.0)(@codemirror/language@6.9.2)(@codemirror/lint@6.4.2)(@codemirror/search@6.5.4)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0):
+  /@uiw/codemirror-extensions-basic-setup@4.21.21(@codemirror/autocomplete@6.11.0)(@codemirror/commands@6.3.0)(@codemirror/language@6.9.2)(@codemirror/lint@6.4.2)(@codemirror/search@6.5.4)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3):
     resolution: {integrity: sha512-+0i9dPrRSa8Mf0CvyrMvnAhajnqwsP3IMRRlaHDRgsSGL8igc4z7MhvUPn+7cWFAAqWzQRhMdMSWzo6/TEa3EA==}
     peerDependencies:
       '@codemirror/autocomplete': '>=6.0.0'
@@ -8352,16 +8365,16 @@ packages:
       '@codemirror/state': '>=6.0.0'
       '@codemirror/view': '>=6.0.0'
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/commands': 6.3.0
       '@codemirror/language': 6.9.2
       '@codemirror/lint': 6.4.2
       '@codemirror/search': 6.5.4
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
     dev: false
 
-  /@uiw/react-codemirror@4.21.21(@babel/runtime@7.23.2)(@codemirror/autocomplete@6.11.0)(@codemirror/language@6.9.2)(@codemirror/lint@6.4.2)(@codemirror/search@6.5.4)(@codemirror/state@6.3.3)(@codemirror/theme-one-dark@6.1.2)(@codemirror/view@6.22.0)(codemirror@6.0.1)(react-dom@18.2.0)(react@18.2.0):
+  /@uiw/react-codemirror@4.21.21(@babel/runtime@7.23.2)(@codemirror/autocomplete@6.11.0)(@codemirror/language@6.9.2)(@codemirror/lint@6.4.2)(@codemirror/search@6.5.4)(@codemirror/state@6.3.3)(@codemirror/theme-one-dark@6.1.2)(@codemirror/view@6.22.3)(codemirror@6.0.1)(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-PaxBMarufMWoR0qc5zuvBSt76rJ9POm9qoOaJbqRmnNL2viaF+d+Paf2blPSlm1JSnqn7hlRjio+40nZJ9TKzw==}
     peerDependencies:
       '@babel/runtime': '>=7.11.0'
@@ -8376,8 +8389,8 @@ packages:
       '@codemirror/commands': 6.3.0
       '@codemirror/state': 6.3.3
       '@codemirror/theme-one-dark': 6.1.2
-      '@codemirror/view': 6.22.0
-      '@uiw/codemirror-extensions-basic-setup': 4.21.21(@codemirror/autocomplete@6.11.0)(@codemirror/commands@6.3.0)(@codemirror/language@6.9.2)(@codemirror/lint@6.4.2)(@codemirror/search@6.5.4)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)
+      '@codemirror/view': 6.22.3
+      '@uiw/codemirror-extensions-basic-setup': 4.21.21(@codemirror/autocomplete@6.11.0)(@codemirror/commands@6.3.0)(@codemirror/language@6.9.2)(@codemirror/lint@6.4.2)(@codemirror/search@6.5.4)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)
       codemirror: 6.0.1(@lezer/common@1.1.1)
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
@@ -9904,13 +9917,13 @@ packages:
   /codemirror@6.0.1(@lezer/common@1.1.1):
     resolution: {integrity: sha512-J8j+nZ+CdWmIeFIGXEFbFPtpiYacFMDR8GlHK3IyHQJMCaVRfGx9NT+Hxivv1ckLWPvNdZqndbr/7lVhrf/Svg==}
     dependencies:
-      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(@lezer/common@1.1.1)
+      '@codemirror/autocomplete': 6.11.0(@codemirror/language@6.9.2)(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(@lezer/common@1.1.1)
       '@codemirror/commands': 6.3.0
       '@codemirror/language': 6.9.2
       '@codemirror/lint': 6.4.2
       '@codemirror/search': 6.5.4
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
     transitivePeerDependencies:
       - '@lezer/common'
     dev: false
@@ -11280,7 +11293,7 @@ packages:
       eslint: 8.53.0
       eslint-import-resolver-node: 0.3.9
       eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.0)(eslint@8.53.0)
-      eslint-plugin-import: 2.29.0(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-typescript@3.6.1)(eslint@8.53.0)
+      eslint-plugin-import: 2.29.0(@typescript-eslint/parser@6.11.0)(eslint@8.53.0)
       eslint-plugin-jsx-a11y: 6.8.0(eslint@8.53.0)
       eslint-plugin-react: 7.33.2(eslint@8.53.0)
       eslint-plugin-react-hooks: 4.6.0(eslint@8.53.0)
@@ -11328,7 +11341,7 @@ packages:
       enhanced-resolve: 5.15.0
       eslint: 8.53.0
       eslint-module-utils: 2.8.0(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1)(eslint@8.53.0)
-      eslint-plugin-import: 2.29.0(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-typescript@3.6.1)(eslint@8.53.0)
+      eslint-plugin-import: 2.29.0(@typescript-eslint/parser@6.11.0)(eslint@8.53.0)
       fast-glob: 3.3.2
       get-tsconfig: 4.7.2
       is-core-module: 2.13.1
@@ -11370,6 +11383,35 @@ packages:
       - supports-color
     dev: true
 
+  /eslint-module-utils@2.8.0(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-node@0.3.9)(eslint@8.53.0):
+    resolution: {integrity: sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==}
+    engines: {node: '>=4'}
+    peerDependencies:
+      '@typescript-eslint/parser': '*'
+      eslint: '*'
+      eslint-import-resolver-node: '*'
+      eslint-import-resolver-typescript: '*'
+      eslint-import-resolver-webpack: '*'
+    peerDependenciesMeta:
+      '@typescript-eslint/parser':
+        optional: true
+      eslint:
+        optional: true
+      eslint-import-resolver-node:
+        optional: true
+      eslint-import-resolver-typescript:
+        optional: true
+      eslint-import-resolver-webpack:
+        optional: true
+    dependencies:
+      '@typescript-eslint/parser': 6.11.0(eslint@8.54.0)(typescript@5.2.2)
+      debug: 3.2.7
+      eslint: 8.53.0
+      eslint-import-resolver-node: 0.3.9
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /eslint-module-utils@2.8.0(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-node@0.3.9)(eslint@8.54.0):
     resolution: {integrity: sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==}
     engines: {node: '>=4'}
@@ -11399,7 +11441,7 @@ packages:
       - supports-color
     dev: false
 
-  /eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-typescript@3.6.1)(eslint@8.53.0):
+  /eslint-plugin-import@2.29.0(@typescript-eslint/parser@6.11.0)(eslint@8.53.0):
     resolution: {integrity: sha512-QPOO5NO6Odv5lpoTkddtutccQjysJuFxoPS7fAHO+9m9udNHvTCPSAMW9zGAYj8lAIdr40I8yPCdUYrncXtrwg==}
     engines: {node: '>=4'}
     peerDependencies:
@@ -11409,7 +11451,7 @@ packages:
       '@typescript-eslint/parser':
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 6.11.0(eslint@8.53.0)(typescript@5.2.2)
+      '@typescript-eslint/parser': 6.11.0(eslint@8.54.0)(typescript@5.2.2)
       array-includes: 3.1.7
       array.prototype.findlastindex: 1.2.3
       array.prototype.flat: 1.3.2
@@ -11418,7 +11460,7 @@ packages:
       doctrine: 2.1.0
       eslint: 8.53.0
       eslint-import-resolver-node: 0.3.9
-      eslint-module-utils: 2.8.0(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1)(eslint@8.53.0)
+      eslint-module-utils: 2.8.0(@typescript-eslint/parser@6.11.0)(eslint-import-resolver-node@0.3.9)(eslint@8.53.0)
       hasown: 2.0.0
       is-core-module: 2.13.1
       is-glob: 4.0.3
@@ -17185,61 +17227,6 @@ packages:
       '@ianvs/prettier-plugin-sort-imports': 4.1.1(prettier@3.1.0)
       prettier: 3.1.0
 
-  /prettier-plugin-tailwindcss@0.5.7(prettier@3.1.0):
-    resolution: {integrity: sha512-4v6uESAgwCni6YF6DwJlRaDjg9Z+al5zM4JfngcazMy4WEf/XkPS5TEQjbD+DZ5iNuG6RrKQLa/HuX2SYzC3kQ==}
-    engines: {node: '>=14.21.3'}
-    peerDependencies:
-      '@ianvs/prettier-plugin-sort-imports': '*'
-      '@prettier/plugin-pug': '*'
-      '@shopify/prettier-plugin-liquid': '*'
-      '@shufo/prettier-plugin-blade': '*'
-      '@trivago/prettier-plugin-sort-imports': '*'
-      prettier: ^3.0
-      prettier-plugin-astro: '*'
-      prettier-plugin-css-order: '*'
-      prettier-plugin-import-sort: '*'
-      prettier-plugin-jsdoc: '*'
-      prettier-plugin-marko: '*'
-      prettier-plugin-organize-attributes: '*'
-      prettier-plugin-organize-imports: '*'
-      prettier-plugin-style-order: '*'
-      prettier-plugin-svelte: '*'
-      prettier-plugin-twig-melody: '*'
-    peerDependenciesMeta:
-      '@ianvs/prettier-plugin-sort-imports':
-        optional: true
-      '@prettier/plugin-pug':
-        optional: true
-      '@shopify/prettier-plugin-liquid':
-        optional: true
-      '@shufo/prettier-plugin-blade':
-        optional: true
-      '@trivago/prettier-plugin-sort-imports':
-        optional: true
-      prettier-plugin-astro:
-        optional: true
-      prettier-plugin-css-order:
-        optional: true
-      prettier-plugin-import-sort:
-        optional: true
-      prettier-plugin-jsdoc:
-        optional: true
-      prettier-plugin-marko:
-        optional: true
-      prettier-plugin-organize-attributes:
-        optional: true
-      prettier-plugin-organize-imports:
-        optional: true
-      prettier-plugin-style-order:
-        optional: true
-      prettier-plugin-svelte:
-        optional: true
-      prettier-plugin-twig-melody:
-        optional: true
-    dependencies:
-      prettier: 3.1.0
-    dev: true
-
   /prettier@2.8.8:
     resolution: {integrity: sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==}
     engines: {node: '>=10.13.0'}
@@ -21212,7 +21199,7 @@ packages:
     engines: {node: '>=0.4'}
     dev: false
 
-  /y-codemirror.next@0.3.2(@codemirror/state@6.3.3)(@codemirror/view@6.22.0)(yjs@13.6.10):
+  /y-codemirror.next@0.3.2(@codemirror/state@6.3.3)(@codemirror/view@6.22.3)(yjs@13.6.10):
     resolution: {integrity: sha512-3ksMXoietzNkrgluG9ut+5q4PNHCS6sQ+mHd44hNX1s7TBe4iDgOOIswfY3oLsdamZLAUPr+TnRdYgYuNDs7Qg==}
     peerDependencies:
       '@codemirror/state': ^6.0.0
@@ -21220,7 +21207,7 @@ packages:
       yjs: ^13.5.6
     dependencies:
       '@codemirror/state': 6.3.3
-      '@codemirror/view': 6.22.0
+      '@codemirror/view': 6.22.3
       lib0: 0.2.88
       yjs: 13.6.10
     dev: false
@@ -21367,6 +21354,26 @@ packages:
   /zod@3.22.4:
     resolution: {integrity: sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==}
 
+  /zustand@4.4.7(@types/react@18.2.37)(react@18.2.0):
+    resolution: {integrity: sha512-QFJWJMdlETcI69paJwhSMJz7PPWjVP8Sjhclxmxmxv/RYI7ZOvR5BHX+ktH0we9gTWQMxcne8q1OY8xxz604gw==}
+    engines: {node: '>=12.7.0'}
+    peerDependencies:
+      '@types/react': '>=16.8'
+      immer: '>=9.0'
+      react: '>=16.8'
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      immer:
+        optional: true
+      react:
+        optional: true
+    dependencies:
+      '@types/react': 18.2.37
+      react: 18.2.0
+      use-sync-external-store: 1.2.0(react@18.2.0)
+    dev: false
+
   /zwitch@2.0.4:
     resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
     dev: false