Merge branch 'main' into release-0.2

Author: subomi

web/ui/website/app/router.scrollBehavior.js

@@ -0,0 +1,34 @@
+export default async function (to, from, savedPosition) {
+	if (savedPosition) {
+		return savedPosition;
+	}
+
+	const findEl = async (hash, x = 0) => {
+		return (
+			document.querySelector(hash) ||
+			new Promise(resolve => {
+				if (x > 50) {
+					return resolve(document.querySelector('#app'));
+				}
+				setTimeout(() => {
+					resolve(findEl(hash, ++x || 1));
+				}, 100);
+			})
+		);
+	};
+
+	const main = document.querySelector('.main');
+
+	if (to.hash) {
+		console.log('🚀 ~ file: scrollBehavior.js ~ line 23 ~ to.hash', to.hash);
+		let el = await findEl(to.hash);
+		if ('scrollBehavior' in document.documentElement.style) {
+			return main.scrollTo({ top: el.offsetTop, behavior: 'smooth' });
+		} else {
+			return main.scrollTo(0, el.offsetTop);
+		}
+	}
+
+	main.scrollTo({ top: 0, behavior: 'smooth' });
+	return { x: 0, y: 0 };
+}

web/ui/website/content/docs/index.md

@@ -142,7 +142,7 @@ $ curl \
     --request POST \
     --data @endpoint.json \
     -H "Content-Type: application/json" \
-    http://localhost:5005/api/v1/applications/e0e1240a-96dc-4408-a335-144eb3749d34/endpoints
+    http://localhost:5005/api/v1/applications/{appID}/endpoints
 ```
 
 ```json[Response]
@@ -164,7 +164,7 @@ $ curl \
 
 ```json[Sample Payload]
 {
-	"app_id": "e0e1240a-96dc-4408-a335-144eb3749d34",
+	"app_id": "{appID}",
 	"event_type": "payment.success",
 	"data": {
 		"event": "payment.success",

web/ui/website/functions/subscribe/package.json

@@ -57,40 +57,5 @@ export default {
 
 	// Build Configuration: https://go.nuxtjs.dev/config-build
 	build: {},
-	runtimeCompiler: true,
-	router: {
-		scrollBehavior: async function (to, from, savedPosition) {
-			if (savedPosition) {
-				return savedPosition;
-			}
-
-			const findEl = async (hash, x = 0) => {
-				return (
-					document.querySelector(hash) ||
-					new Promise(resolve => {
-						if (x > 50) {
-							return resolve(document.querySelector('#app'));
-						}
-						setTimeout(() => {
-							resolve(findEl(hash, ++x || 1));
-						}, 100);
-					})
-				);
-			};
-
-			const main = document.querySelector('.main');
-
-			if (to.hash) {
-				let el = await findEl(to.hash);
-				if ('scrollBehavior' in document.documentElement.style) {
-					return main.scrollTo({ top: el.offsetTop, behavior: 'smooth' });
-				} else {
-					return main.scrollTo(0, el.offsetTop);
-				}
-			}
-
-			main.scrollTo({ top: 0, behavior: 'smooth' });
-			return { x: 0, y: 0 };
-		}
-	}
+	runtimeCompiler: true
 };

web/ui/website/functions/subscribe/subscribe.js

@@ -34,14 +34,14 @@
 				<div class="hero-section--cta">
 					<h1>A Cloud native Webhook Service</h1>
 					<p>With out-of-the-box security, reliability and scalability for your webhooks infrastructure.</p>
+					<nuxt-link to="/docs">Get Started</nuxt-link>
 
 					<form @submit.prevent="requestAccess()">
 						<div class="input">
-							<input type="text" id="github" placeholder="Enter your github username" aria-label="Github Name" v-model="earlyAccessGithubName" />
+							<input type="email" id="email" placeholder="Enter your email" aria-label="Email" v-model="earlyAccessEmail" />
 						</div>
 						<button :disabled="isSubmitingloadingEarlyAccessForm">{{ isSubmitingloadingEarlyAccessForm ? '...requesting' : earlyAccessFormButtonText }}</button>
 					</form>
-					<!-- <button>Get Started</button> -->
 				</div>
 				<div class="hero-section--img">
 					<img src="~/assets/images/hero-img.png" alt="hero" />
@@ -214,8 +214,8 @@ export default {
 		return {
 			showMenu: false,
 			isSubmitingloadingEarlyAccessForm: false,
-			earlyAccessFormButtonText: 'Get Early Access',
-			earlyAccessGithubName: ''
+			earlyAccessFormButtonText: 'Convoy Cloud Early Access',
+			earlyAccessEmail: ''
 		};
 	},
 	async asyncData({ $content, params }) {
@@ -237,7 +237,7 @@ export default {
 					redirect: 'follow',
 					referrerPolicy: 'no-referrer',
 					body: JSON.stringify({
-						githubName: this.earlyAccessGithubName
+						email: this.earlyAccessEmail
 					})
 				});
 				await response.json();
@@ -252,7 +252,7 @@ export default {
 		},
 		setDefaultAccessButtonText() {
 			setTimeout(() => {
-				this.earlyAccessFormButtonText = 'Get Early Access';
+				this.earlyAccessFormButtonText = 'Convoy Cloud Early Access';
 			}, 5000);
 		}
 	}
@@ -322,7 +322,7 @@ header {
 
 			&.show {
 				padding-top: 20px;
-				height: 175px;
+				height: 233px;
 				overflow-y: auto;
 				display: block;
 			}
@@ -429,12 +429,33 @@ header {
 			}
 		}
 
+		button,
+		a {
+			background: #477db3;
+			padding: 9px 21px;
+			color: #ffffff;
+			font-weight: 500;
+			font-size: 14px;
+			line-height: 28px;
+			margin: 20px 0 0;
+			max-width: 200px;
+			width: 100%;
+			display: block;
+			border-radius: 5px;
+			text-align: center;
+		}
+
 		form {
 			background: #ffffff;
 			max-width: 430px;
 			display: flex;
 			border-radius: 8px;
 			margin-top: 40px;
+			flex-direction: column;
+
+			@media (min-width: $desktopBreakPoint) {
+				flex-direction: row;
+			}
 
 			.input {
 				width: 100%;
@@ -459,16 +480,18 @@ header {
 			}
 
 			button {
-				background: #477db3;
-				border-radius: 0 8px 8px 0;
-				padding: 9px 21px;
-				color: #ffffff;
-				font-weight: 500;
-				font-size: 14px;
-				line-height: 28px;
-				max-width: 162px;
+				max-width: none;
 				width: 100%;
 				margin: 0;
+				border-radius: 0 0 8px 8px;
+				margin-top: 10px;
+
+				@media (min-width: $desktopBreakPoint) {
+					max-width: 220px;
+					width: 100%;
+					margin-top: 0;
+					border-radius: 0 8px 8px 0;
+				}
 			}
 		}
 	}
@@ -551,6 +574,7 @@ section.companies {
 		display: grid;
 		grid-template-columns: repeat(auto-fill, minmax(238px, 1fr));
 		gap: 80px 32px;
+		margin-bottom: 50px;
 
 		img {
 			width: 70px;