@txstate-mws/sveltekit-utils 1.2.3 → 1.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/api.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import type { InteractionEvent, ValidatedResponse } from '@txstate-mws/fastify-shared';
2
+ import type { Feedback, SubmitResponse } from '@txstate-mws/svelte-forms';
2
3
  export type APIBaseQueryPayload = string | Record<string, undefined | string | number | (string | number)[]>;
3
4
  type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
4
5
  export interface APIUploadInfo {
@@ -13,6 +14,16 @@ export type APIBaseProgressFn = (info: {
13
14
  total: number;
14
15
  ratio: number;
15
16
  } | undefined) => void;
17
+ export interface MessageFromAPI {
18
+ arg: string;
19
+ message: string;
20
+ type: 'error' | 'warning' | 'success';
21
+ }
22
+ export interface MutationResponseFromAPI {
23
+ success: boolean;
24
+ messages: MessageFromAPI[];
25
+ [key: string]: any;
26
+ }
16
27
  /**
17
28
  * Provided for convenience in case you are not using APIBase but still want to record navigations
18
29
  *
@@ -105,5 +116,43 @@ export declare class APIBase {
105
116
  * be called in your global +layout.svelte
106
117
  */
107
118
  recordNavigations(): void;
119
+ /**
120
+ * This function is used to convert MutationMessageType[] that comes from our standard
121
+ * graphql servers into the Feedback[] type expected by svelte-forms.
122
+ *
123
+ * It will also remove a prefix from the arg property if you pass one in. This is useful
124
+ * because your graphql service should always be creating paths relative to the mutation's
125
+ * argument root, but the UI may not care how that's done.
126
+ *
127
+ * For example, consider the difference between `{ updateUser(id: ID!, name: String!, email: String!) {...} }`
128
+ * and `{ updateUser(id: ID!, user: UserInfo!) {...} }`. The first one should be sending back messages
129
+ * with `arg` like `name` or `email`, while the second one should be sending back messages with `arg`
130
+ * like `user.name` or `user.email` - because any user of the GraphQL API should expect that format after
131
+ * seeing the mutation signature.
132
+ *
133
+ * If your UI form for editing the user uses paths like `name` and `email`, you can pass `user` as the
134
+ * prefix to the second example and this function will remove it from the `arg` property when it creates
135
+ * the `path` property.
136
+ */
137
+ messageForDialog(messages: MessageFromAPI[], prefix?: string): Feedback[];
138
+ /**
139
+ * This function is used to convert MutationResponseFromAPI into the SubmitResponse
140
+ * type expected by svelte-forms.
141
+ *
142
+ * It will also remove a prefix from the arg property if you pass one in. See messageForDialog
143
+ * for more details.
144
+ *
145
+ * If you pass a dataName, it will be used to extract the data object from the response. It's typical
146
+ * in graphql to name the data for what is is, for instance, updateUser probably returns success, messages,
147
+ * and user. However, SubmitResponse always expects a `data` property. You can pass `user` as the dataName
148
+ * and it will be returned as the `data` property.
149
+ */
150
+ mutationForDialog(resp: MutationResponseFromAPI, { prefix }: {
151
+ prefix?: string;
152
+ }): SubmitResponse<undefined>;
153
+ mutationForDialog<T = any>(resp: MutationResponseFromAPI, { prefix, dataName }: {
154
+ prefix?: string;
155
+ dataName: string;
156
+ }): SubmitResponse<T>;
108
157
  }
109
158
  export {};
package/dist/api.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { toasts } from '@txstate-mws/svelte-components';
2
2
  import { error } from '@sveltejs/kit';
3
3
  import { get } from 'svelte/store';
4
- import { pick, rescue, toArray } from 'txstate-utils';
4
+ import { isNotBlank, isNull, omit, pick, rescue, toArray } from 'txstate-utils';
5
5
  import { page } from '$app/stores';
6
6
  import { afterNavigate } from '$app/navigation';
7
7
  import { unifiedAuth } from './unifiedauth.js';
@@ -279,4 +279,30 @@ export class APIBase {
279
279
  recordNavigations() {
280
280
  recordNavigations(this.recordInteraction.bind(this));
281
281
  }
282
+ /**
283
+ * This function is used to convert MutationMessageType[] that comes from our standard
284
+ * graphql servers into the Feedback[] type expected by svelte-forms.
285
+ *
286
+ * It will also remove a prefix from the arg property if you pass one in. This is useful
287
+ * because your graphql service should always be creating paths relative to the mutation's
288
+ * argument root, but the UI may not care how that's done.
289
+ *
290
+ * For example, consider the difference between `{ updateUser(id: ID!, name: String!, email: String!) {...} }`
291
+ * and `{ updateUser(id: ID!, user: UserInfo!) {...} }`. The first one should be sending back messages
292
+ * with `arg` like `name` or `email`, while the second one should be sending back messages with `arg`
293
+ * like `user.name` or `user.email` - because any user of the GraphQL API should expect that format after
294
+ * seeing the mutation signature.
295
+ *
296
+ * If your UI form for editing the user uses paths like `name` and `email`, you can pass `user` as the
297
+ * prefix to the second example and this function will remove it from the `arg` property when it creates
298
+ * the `path` property.
299
+ */
300
+ messageForDialog(messages, prefix) {
301
+ return messages.map(m => {
302
+ return { ...omit(m, 'arg'), path: isNull(m.arg) ? null : isNotBlank(prefix) ? m.arg.replace(RegExp('^' + prefix + '\\.'), '') : m.arg };
303
+ });
304
+ }
305
+ mutationForDialog(resp, { prefix, dataName }) {
306
+ return { success: resp.success, messages: this.messageForDialog(resp.messages, prefix), data: (dataName ? resp[dataName] : undefined) };
307
+ }
282
308
  }
@@ -1 +1 @@
1
- {"root":["../src/api.ts","../src/index.ts","../src/unifiedauth.ts"],"version":"5.7.3"}
1
+ {"root":["../src/api.ts","../src/index.ts","../src/unifiedauth.ts"],"version":"5.8.3"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@txstate-mws/sveltekit-utils",
3
- "version": "1.2.3",
3
+ "version": "1.2.4",
4
4
  "description": "Shared library for code that is specifically tied to sveltekit in addition to svelte.",
5
5
  "type": "module",
6
6
  "exports": {
@@ -15,6 +15,7 @@
15
15
  "@sveltejs/kit": "^2.5.4",
16
16
  "@txstate-mws/fastify-shared": "^1.0.4",
17
17
  "@txstate-mws/svelte-components": "^1.6.1",
18
+ "@txstate-mws/svelte-forms": "^1.5.8",
18
19
  "txstate-utils": "^1.8.15"
19
20
  },
20
21
  "devDependencies": {