Merge pull request #1412 from ThatConference/next/feature

Promote Next/feature to production

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "that-us",
-	"version": "3.11.1",
+	"version": "3.11.2",
 	"description": "THAT.us website",
 	"main": "index.js",
 	"type": "module",

src/_components/banners/SuccessRounded.svelte

@@ -0,0 +1,29 @@
+<script>
+	export let showCloseButton = false;
+
+	import { createEventDispatcher } from 'svelte';
+
+	const dispatch = createEventDispatcher();
+</script>
+
+<div
+	class="flex items-center gap-x-6 rounded-lg bg-thatBlue-500 px-6 py-2.5 before:flex-1 sm:px-3.5">
+	<div class="text-lg leading-6 text-white">
+		<slot />
+	</div>
+
+	<div class="flex flex-1 justify-end">
+		{#if showCloseButton}
+			<button
+				type="button"
+				class="-m-3 p-3 focus-visible:outline-offset-[-4px]"
+				on:click={() => dispatch('dismiss')}>
+				<span class="sr-only">Dismiss</span>
+				<svg class="h-5 w-5 text-white" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+					<path
+						d="M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z" />
+				</svg>
+			</button>
+		{/if}
+	</div>
+</div>

src/routes/event/check-in/_components/_Ticket.svelte

@@ -27,11 +27,9 @@
 	let tempPin;
 
 	// keeps ticket object up-to-date with pin changes.
-	// $: console.log(ticket);
 	$: {
 		ticket.partnerPin = displayPin;
 		ticket.hasCheckedIn = displayPin !== 'PIN not set';
-		// console.log('in pin');
 	}
 </script>
 

src/routes/partners/leads/[eventId]/+page.svelte

@@ -2,13 +2,16 @@
 	import { goto } from '$app/navigation';
 	import { page } from '$app/stores';
 	import { Circle3 } from 'svelte-loading-spinners';
+	import SuccessBanner from '$components/banners/SuccessRounded.svelte';
 
 	import seoMetaTags from '$utils/seo/metaTags';
 	import Seo from '$components/Seo.svelte';
 	import NumPad from '$components/numberPad/Panel.svelte';
 	import { Shell } from '$elements/buttons';
 	import leadsMutationApi from '$dataSources/api.that.tech/partner/leads/mutations';
 
+	let showBanner = false;
+
 	const metaTags = ((title = 'Lead Capture - THAT') => ({
 		title,
 		tags: seoMetaTags({
@@ -31,7 +34,7 @@
 	let waiting = false;
 
 	let contactExchangeError = false;
-	let comtactExchangeErrorMessage;
+	let contactExchangeErrorMessage;
 
 	async function handleContactExchange() {
 		waiting = true;
@@ -40,24 +43,35 @@
 		waiting = false;
 
 		if (result) {
+			showBanner = true;
+			setTimeout(() => {
+				showBanner = false;
+			}, 2000);
+
 			pinNumber = '';
 			partnerNotes = undefined;
 		} else {
 			contactExchangeError = true;
-			comtactExchangeErrorMessage = message;
+			contactExchangeErrorMessage = message;
 		}
 	}
 
 	function tryAgain() {
 		contactExchangeError = false;
-		comtactExchangeErrorMessage = undefined;
+		contactExchangeErrorMessage = undefined;
 	}
 </script>
 
 <Seo title={metaTags.title} tags={metaTags.tags} />
 
 <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
-	<h1 class="mt-6 text-xl font-bold leading-6 text-thatBlue-800">THAT Contact Exchange</h1>
+	<h1 class="mt-2 text-xl font-bold leading-6 text-thatBlue-800">THAT Contact Exchange</h1>
+	<div
+		class:opacity-100={showBanner}
+		class="mx-auto max-w-sm opacity-0 transition-opacity duration-700 ease-out">
+		<SuccessBanner>Contact Saved!</SuccessBanner>
+	</div>
+
 	<div class="absolute right-0 top-0 block pr-4 pt-4">
 		<button
 			type="button"
@@ -79,8 +93,7 @@
 			</svg>
 		</button>
 	</div>
-
-	<div class="mx-auto mt-4 max-w-sm">
+	<div class="mx-auto mt-0 max-w-sm">
 		{#if waiting}
 			<div class="relative my-6 flex flex-col items-center space-y-6">
 				<Circle3
@@ -99,7 +112,7 @@
 			<div class="relative my-6 flex flex-col space-y-6">
 				<div class="mt-2">
 					<p class="text-md leading-5 text-gray-500">
-						{comtactExchangeErrorMessage}
+						{contactExchangeErrorMessage}
 					</p>
 				</div>