This simulates the parent application authenticating with the shared backend.
Test Deep Linking:
Test API Creation:
Manual Auth:
1. Available Routes:
/embed/notes: Renders the full notepad/editor./embed/notes?noteId=XXX: Renders a specific note directly./embed/quick-add: Renders a standalone task creation form.2. Creating Notes Programmatically (API):
Before embedding, a sister app can create a Note via PocketBase API to retrieve a new
noteId. By default, notes should have an array of tags and a
title.
Using the PocketBase JS SDK:
const record = await pb.collection('notes').create({
title: "Sister App Payload",
content: "<p>Initial content here...</p>",
tags: ["sister_app_export"],
isPrivate: false,
user: pb.authStore.model.id, // Must be authenticated user ID
tasks: [] // Optional array of linked task IDs
});
const newNoteId = record.id;
// Then iframe to /embed/notes?noteId=${newNoteId}
Using standard REST API (fetch):
const res = await fetch('https://pocketbase.ccllc.pro/api/collections/notes/records', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': 'YOUR_PB_AUTH_TOKEN'
},
body: JSON.stringify({
title: "REST Custom Note",
user: "YOUR_USER_ID",
tags: [],
tasks: [],
isPrivate: false
})
});
const data = await res.json();
const newNoteId = data.id;
3. Authentication Protocol:
The parent application must send a postMessage to the iframe immediately after the
iframe loads (or whenever auth state changes).
iframe.contentWindow.postMessage({
type: "TASGRID_AUTH",
token: "YOUR_POCKETBASE_TOKEN",
user: { /* optional PB user record */ }
}, "*");
4. Responsiveness:
Both routes are designed to be fluid. Ensure your iframe container has defined dimensions; the content will expand to fill it.
/embed/notes
/embed/quick-add