From 4d13a9082285eb5a31e4efd517b5583caaf9480b Mon Sep 17 00:00:00 2001
From: Simon Farshid <simon.farshid@outlook.com>
Date: Tue, 2 Jul 2024 13:19:10 -0700
Subject: [PATCH] docs: v0.3 migration (#376)

---
 apps/www/pages/docs/migrations/_meta.tsx |  7 ++++
 apps/www/pages/docs/migrations/v0.3.mdx  | 50 ++++++++++++++++++++++++
 2 files changed, 57 insertions(+)
 create mode 100644 apps/www/pages/docs/migrations/_meta.tsx
 create mode 100644 apps/www/pages/docs/migrations/v0.3.mdx

diff --git a/apps/www/pages/docs/migrations/_meta.tsx b/apps/www/pages/docs/migrations/_meta.tsx
new file mode 100644
index 000000000..6d1b04d0f
--- /dev/null
+++ b/apps/www/pages/docs/migrations/_meta.tsx
@@ -0,0 +1,7 @@
+const meta = {
+  "v0.3": "Migration to v0.3",
+  "v0.2": "Migration to v0.2",
+  "v0.1": "Migration to v0.1",
+};
+
+export default meta;
diff --git a/apps/www/pages/docs/migrations/v0.3.mdx b/apps/www/pages/docs/migrations/v0.3.mdx
new file mode 100644
index 000000000..9d85ca2c0
--- /dev/null
+++ b/apps/www/pages/docs/migrations/v0.3.mdx
@@ -0,0 +1,50 @@
+---
+title: Migration to v0.3
+---
+
+## Changes to the `Thread.tsx` template
+
+### Removal of `MessagePrimitive.InProgress`
+
+Remove `MessagePrimitive.InProgress` from `Thread.tsx`.
+
+```diff
+  const AssistantMessage = () => {
+    return (
+      <MessagePrimitive.Root>
+        ...
+-       <MessagePrimitive.InProgress className="..." />
+        ...
+      </MessagePrimitive.Root>
+    );
+  };
+```
+
+#### Custom loading indicator
+
+In case you want a custom loading indicator (other than the dot), create a custom Text component and pass it to the `MessagePrimitive.Content` component.
+
+```tsx {1,7,13-22}
+import { ContentPartPrimitive } from "@assistant-ui/react";
+
+const AssistantMessage = () => {
+  return (
+    <MessagePrimitive.Root>
+      ...
+      <MessagePrimitive.Content components={{ Text }} />
+      ...
+    </MessagePrimitive.Root>
+  );
+};
+
+const Text: FC = ({ children }) => {
+  return (
+    <ContentPartPrimitive.InProgress>
+      <ContentPartPrimitive.Text className="whitespace-pre-line">
+        {children}
+      </ContentPartPrimitive.Text>
+      <ContentPartPrimitive.InProgress>...</ContentPartPrimitive.InProgress>
+    </ContentPartPrimitive.InProgress>
+  );
+};
+```