feat: updated devtools client to work with new render object

client/composables/useEmail.ts

@@ -1,6 +1,6 @@
 import pretty from 'pretty'
-import { convert } from 'html-to-text'
 import type { Email } from '@/types/email'
+import type { Result } from '@vue-email/compiler'
 
 export function useEmail() {
   const emails = useState<Email[]>('emails')
@@ -33,20 +33,15 @@ export function useEmail() {
   const renderEmail = async () => {
     if (!email.value) return null
 
-    const { data } = await useFetch<string>(`/api/render/${email.value.filename}`, {
+    const { data } = await useFetch<Result>(`/api/render/${email.value.filename}`, {
       baseURL: host.value,
     })
 
     if (data.value)
       return {
         vue: email.value.content,
-        html: pretty(data.value),
-        txt: convert(data.value, {
-          selectors: [
-            { selector: 'img', format: 'skip' },
-            { selector: '#__vue-email-preview', format: 'skip' },
-          ],
-        }),
+        html: pretty(data.value.html),
+        txt: data.value.text,
       }
 
     return null

package.json

@@ -50,8 +50,8 @@
   "dependencies": {
     "@nuxt/kit": "^3.8.2",
     "defu": "^6.1.3",
-    "vue-email": "0.8.1",
-    "@vue-email/compiler": "0.8.1",
+    "vue-email": "0.8.2",
+    "@vue-email/compiler": "0.8.2",
     "sirv": "^2.0.3"
   },
   "devDependencies": {

playground/server/api/test.get.ts

@@ -10,7 +10,9 @@ export default defineEventHandler(async () => {
       console.error(error);
     })
 
-    return template
+    if(!template) return null
+
+    return template.html
   } catch (error) {
     console.error(error);