zzstoatzz.io
+13
-11
notes/quickslice-migration.md
+13
-11
notes/quickslice-migration.md
···
63
64
```javascript
65
const client = await QuicksliceClient.create({
66
-
server: 'https://zzstoatzz-quickslice-status.fly.dev',
67
-
clientId: 'client_2mP9AwgVHkg1vaSpcWSsKw',
68
-
redirectUri: window.location.origin + '/',
69
});
70
71
// start login
···
75
const { data } = await client.agent.getProfile({ actor: client.agent.session.did });
76
```
77
78
-
the redirect URI is just the root of your site (e.g., `https://status.zzstoatzz.io/`).
79
80
**GraphQL queries**
81
82
quickslice auto-generates a GraphQL API from your lexicons. querying status records looks like:
83
84
```javascript
85
-
const response = await fetch(`${CONFIG.server}/api/graphql`, {
86
method: 'POST',
87
headers: { 'Content-Type': 'application/json' },
88
body: JSON.stringify({
89
query: `
90
-
query GetStatuses($did: String!) {
91
-
ioZzstoatzzStatusRecords(
92
where: { did: { eq: $did } }
93
orderBy: { createdAt: DESC }
94
first: 50
95
) {
96
-
nodes { uri did emoji text createdAt }
97
}
98
}
99
`,
···
101
})
102
});
103
```
104
105
no need to write resolvers or schema - it's all generated from the lexicon definitions.
106
···
134
135
```toml
136
[env]
137
-
EXTERNAL_BASE_URL = 'https://zzstoatzz-quickslice-status.fly.dev'
138
```
139
140
### PDS caching
···
146
```
147
┌─────────────────────────────────────────────────────────┐
148
│ cloudflare pages │
149
-
│ status.zzstoatzz.io │
150
│ │
151
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
152
│ │ index.html │ │ app.js │ │ styles.css │ │
···
157
▼
158
┌─────────────────────────────────────────────────────────┐
159
│ fly.io │
160
-
│ zzstoatzz-quickslice-status.fly.dev │
161
│ │
162
│ ┌─────────────────────────────────────────────────┐ │
163
│ │ quickslice │ │
···
63
64
```javascript
65
const client = await QuicksliceClient.create({
66
+
server: 'https://your-app.fly.dev', // your quickslice instance
67
+
clientId: 'client_xxx', // from quickslice admin UI
68
+
redirectUri: window.location.origin + '/', // where OAuth redirects back
69
});
70
71
// start login
···
75
const { data } = await client.agent.getProfile({ actor: client.agent.session.did });
76
```
77
78
+
the `clientId` comes from registering an OAuth client in the quickslice admin UI. the redirect URI should match what you registered.
79
80
**GraphQL queries**
81
82
quickslice auto-generates a GraphQL API from your lexicons. querying status records looks like:
83
84
```javascript
85
+
const response = await fetch(`https://your-app.fly.dev/api/graphql`, {
86
method: 'POST',
87
headers: { 'Content-Type': 'application/json' },
88
body: JSON.stringify({
89
query: `
90
+
query GetRecords($did: String!) {
91
+
yourLexiconRecords(
92
where: { did: { eq: $did } }
93
orderBy: { createdAt: DESC }
94
first: 50
95
) {
96
+
nodes { uri did createdAt /* your fields */ }
97
}
98
}
99
`,
···
101
})
102
});
103
```
104
+
105
+
the query name (`yourLexiconRecords`) is auto-generated from your lexicon ID - dots become camelCase (e.g., `io.example.foo` → `ioExampleFoos`).
106
107
no need to write resolvers or schema - it's all generated from the lexicon definitions.
108
···
136
137
```toml
138
[env]
139
+
EXTERNAL_BASE_URL = 'https://your-app.fly.dev'
140
```
141
142
### PDS caching
···
148
```
149
┌─────────────────────────────────────────────────────────┐
150
│ cloudflare pages │
151
+
│ your-frontend.com │
152
│ │
153
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
154
│ │ index.html │ │ app.js │ │ styles.css │ │
···
159
▼
160
┌─────────────────────────────────────────────────────────┐
161
│ fly.io │
162
+
│ your-app.fly.dev │
163
│ │
164
│ ┌─────────────────────────────────────────────────┐ │
165
│ │ quickslice │ │