Merge pull request #142 from ThatConference/feat/member-network-sharing

feat: member–member sharing of shared profile data

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "thatconference.com",
-	"version": "5.1.15",
+	"version": "5.2.0",
 	"description": "THATConference.com website",
 	"main": "index.js",
 	"type": "module",
@@ -15,6 +15,7 @@
 	"scripts": {
 		"prepare": "npx husky install",
 		"dev": "env-cmd vite dev",
+		"dev:host": "env-cmd vite dev --host",
 		"local:build": "env-cmd vite build",
 		"build": "vite build",
 		"preview": "env-cmd vite preview",

src/_dataSources/api.that.tech/memberShareWith/mutations.js

@@ -0,0 +1,183 @@
+import gFetch from '$lib/gfetch';
+import { log } from '../utilities/error';
+
+const secureProfileFields = `
+	fragment secureProfileFields on SecureProfile {
+		... on PrivateProfile {
+			__typename
+			id
+			firstName
+			lastInitial
+		}
+		... on PublicProfile {
+			__typename
+			id
+			firstName
+			lastName
+			profileSlug
+		}
+	}
+`;
+export const MUTATION_ADD_SHARE_WITH_BY_PIN = `
+	${secureProfileFields}
+	mutation addShareWithPin($shareWith: ShareWithByPinInput!) {
+		members {
+			network {
+				add {
+					pin(shareWith: $shareWith) {
+						__typename
+						isSuccess
+						message
+						sharedWith {
+							__typename
+							createdAt
+							lastUpdatedAt
+							notes
+							sharingWithProfile {
+								...secureProfileFields
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+`;
+export const MUTATION_ADD_SHARE_WITH_PROFILE = `
+	${secureProfileFields}
+	mutation addShareWithProfile($shareWith: ShareWithByProfileInput!) {
+		members {
+			network {
+				add {
+					profile(shareWith: $shareWith) {
+						__typename
+						isSuccess
+						message
+						sharedWith {
+							__typename
+							createdAt
+							lastUpdatedAt
+							notes
+							sharingWithProfile {
+								...secureProfileFields
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+`;
+export const MUTATION_UPDATE_SHARE_WITH = `
+	${secureProfileFields}	
+	mutation updateShareWith($memberId: ID!, $shareWithData: ShareWithUpdateInput!) {
+		members {
+			network {
+				sharingWith (sharedWithId: $memberId) {
+					update(shareWith: $shareWithData) {
+						notes
+						sharingWithProfile {
+							...secureProfileFields
+						}
+						createdAt
+						lastUpdatedAt
+					}
+				 } 
+			}
+		}
+	}
+`;
+export const MUTATION_REMOVE_SHARE = `
+	mutation removeShareWith($memberId: ID!) {
+		members {
+			network {
+				sharingWith (sharedWithId: $memberId) {
+					remove
+				}
+			}
+		}
+	}
+`;
+
+export default (fetch) => {
+	const client = fetch ? gFetch(fetch) : gFetch();
+
+	function shareWithByPin(shareWith) {
+		const variables = { shareWith };
+		return client
+			.mutation({ mutation: MUTATION_ADD_SHARE_WITH_BY_PIN, variables })
+			.then(({ data, errors }) => {
+				if (errors) {
+					log({ errors, tag: 'MUTATION_ADD_SHARE_WITH' });
+					throw new Error('An error occurred while sharing your information');
+				}
+
+				return data.members.network.add.pin;
+			});
+	}
+
+	function shareWithByProfile(shareWith) {
+		const { id, profileSlug, notes } = shareWith;
+		const variables = {
+			shareWith: {
+				shareWithMember: {
+					id: id ?? null,
+					slug: profileSlug ?? null
+				},
+				notes: notes ?? ''
+			}
+		};
+
+		return client
+			.mutation({ mutation: MUTATION_ADD_SHARE_WITH_PROFILE, variables })
+			.then(({ data, errors }) => {
+				if (errors) {
+					log({ errors, tag: 'MUTATION_ADD_SHARE_WITH_PROFILE' });
+					throw new Error('An error occurred while sharing your information');
+				}
+
+				return data.members.network.add.profile;
+			});
+	}
+
+	function updateShareWith(memberId, notes = '') {
+		const variables = {
+			memberId,
+			shareWithData: {
+				notes
+			}
+		};
+
+		return client
+			.mutation({ mutation: MUTATION_UPDATE_SHARE_WITH, variables })
+			.then(({ data, errors }) => {
+				if (errors) {
+					log({ errors, tag: 'MUTATION_UPDATE_SHARE_WITH' });
+					throw new Error('An error occurred while updating share information');
+				}
+
+				return data.members.network.sharingWith.update;
+			});
+	}
+
+	function removeShareWith(memberId) {
+		const variables = { memberId };
+		return client
+			.mutation({ mutation: MUTATION_REMOVE_SHARE, variables })
+			.then(({ data, errors }) => {
+				if (errors) {
+					log({ errors, tag: 'MUTATION_REMOVE_SHARE' });
+					throw new Error('An error occurred removing the share');
+				}
+
+				return data.members.network.sharingWith.remove;
+			});
+	}
+
+	return {
+		shareWithByPin,
+		shareWithByProfile,
+		updateShareWith,
+		removeShareWith
+	};
+};

src/_dataSources/api.that.tech/memberShareWith/queries.js

@@ -0,0 +1,94 @@
+import gFetch from '$lib/gfetch';
+
+import { log } from '../utilities/error';
+
+const secureProfileFields = `
+	fragment secureProfileFields on SecureProfile {
+		... on PrivateProfile {
+			__typename
+			id
+			firstName
+			lastInitial
+		}
+		... on PublicProfile {
+			__typename
+			id
+			firstName
+			lastName
+			profileImage
+		}
+	}
+`;
+
+export const QUERY_ME_SHARING_WITH = `
+	${secureProfileFields}
+	query meSharingWith {
+		members {
+			network {
+				sharedByMe {
+					notes
+					sharingWithProfile {
+						...secureProfileFields
+					}
+				}
+			}
+		}
+	}
+`;
+
+export const QUERY_SHARING_WITH_ME = `
+	${secureProfileFields}
+	query sharingWithMe {
+		members {
+			network {
+				sharedWithMe {
+					sharedWithMeProfile {
+						...secureProfileFields
+					}
+				
+					sharedWithMeSharedProfile {
+						__typename
+						firstName
+						lastName
+						email
+						company
+						phone
+						city
+						state
+						country
+					}
+					createdAt
+				}
+			}
+		}
+	}
+`;
+
+export default (fetch) => {
+	const client = fetch ? gFetch(fetch) : gFetch();
+
+	const getMeSharingWith = () => {
+		return client
+			.secureQuery({ query: QUERY_ME_SHARING_WITH, variables: {} })
+			.then(({ data, errors }) => {
+				if (errors) log({ errors, tag: 'QUERY_SHARING_WITH_ME' });
+
+				return data.members.network.sharedByMe;
+			});
+	};
+
+	const getSharingWithMe = () => {
+		return client
+			.secureQuery({ query: QUERY_SHARING_WITH_ME, variables: {} })
+			.then(({ data, errors }) => {
+				if (errors) log({ errors, tag: 'QUERY_SHARING_WITH_ME' });
+
+				return data.members.network.sharedWithMe;
+			});
+	};
+
+	return {
+		getMeSharingWith,
+		getSharingWithMe
+	};
+};

src/_elements/buttons/ActionShell.svelte

@@ -0,0 +1,14 @@
+<div
+	class="focus:bg-thatBlue-300focus:text-white whitespace-nowrap rounded-md border-2
+	border-thatBlue-500 bg-thatBlue-500
+	px-8 py-2 text-base font-medium
+	leading-6 text-white
+	shadow transition duration-150 ease-in-out
+	hover:border-thatBlue-300
+	hover:bg-thatBlue-300 hover:text-white
+	 md:px-10 md:text-lg
+	 ">
+	<div class="flex h-full w-full items-center justify-center">
+		<slot />
+	</div>
+</div>

src/_elements/buttons/DisabledShell.svelte

@@ -1,9 +1,9 @@
 <div class="block">
 	<div
-		class="bg-grey-50 h-full w-full cursor-pointer
-		rounded-md border-2 border-gray-500 text-base
-		font-medium text-gray-500 shadow
-		md:text-lg">
+		class="bg-grey-50 h-full w-full
+		cursor-not-allowed rounded-md border-2 border-gray-500
+		text-base font-medium text-gray-500
+		shadow md:text-lg">
 		<div class="flex h-full w-full items-center justify-center">
 			<slot />
 		</div>

src/_elements/buttons/Standard.svelte

@@ -3,11 +3,11 @@
 	type="button"
 	on:click
 	class="whitespace-nowrap rounded-md border-2 border-thatBlue-500
-		bg-white px-8 py-2 
+		bg-white px-8 py-2
 		text-base font-medium
-		leading-6 text-thatBlue-500 shadow transition duration-150 
-		ease-in-out hover:bg-thatBlue-500 
-		hover:text-white focus:border-thatBlue-800 focus:bg-thatBlue-500 focus:text-white focus:outline-none 
+		leading-6 text-thatBlue-500 shadow transition duration-150
+		ease-in-out hover:bg-thatBlue-500
+		hover:text-white focus:border-thatBlue-800 focus:bg-thatBlue-500 focus:text-white focus:outline-none
 		focus:ring-thatBlue-500 md:px-10 md:text-lg">
 	<span>
 		<slot />

src/_elements/buttons/index.js

@@ -4,3 +4,4 @@ export { default as StandardShell } from './StandardShell.svelte';
 export { default as Highlight } from './Highlight.svelte';
 export { default as HighlightShell } from './HighlightShell.svelte';
 export { default as DisabledShell } from './DisabledShell.svelte';
+export { default as ActionShell } from './ActionShell.svelte';

src/lib/formSchemas/sharingForm.js

@@ -0,0 +1,6 @@
+import { z } from 'zod';
+
+export default z.object({
+	id: z.string().trim(),
+	notes: z.string().trim().max(1000).nullable().optional()
+});

src/routes/(admin my)/my/_components/PageLayout.svelte

@@ -1,5 +1,5 @@
-<main class="relative flex-grow">
-	<div class="mx-auto max-w-7xl pb-12">
+<main class="relative mb-24 mt-12 flex-grow">
+	<div class="mx-auto max-w-7xl">
 		<slot name="header" />
 
 		<div id="content-block" class="mt-12 rounded-lg bg-gray-100 px-5 py-6 shadow sm:px-6">