feat: Add sendgrid resource (#970)

Co-authored-by: Faton Ramadani <faton.ramadani14@gmail.com>
Co-authored-by: Ruben Fiszel <ruben@rubenfiszel.com>

frontend/src/lib/components/AppConnect.svelte

@@ -22,7 +22,15 @@
 				'Go to <a href="https://admin.mailchimp.com/account/api" target="_blank" rel=”noopener noreferrer”>https://admin.mailchimp.com/account/api</a>',
 				'Find "Your API Keys"'
 			]
-		}
+		},
+		sendgrid: {
+			img: 'sendgrid_connect.png',
+			instructions: [
+				'Go to <a href="https://app.sendgrid.com/settings/api_keys" target="_blank" rel=”noopener noreferrer”>https://app.sendgrid.com/settings/api_keys</a>',
+				'Create an API key',
+				'Copy your key'
+			]
+		},
 	}
 </script>
 

frontend/src/lib/components/icons/SendgridIcon.svelte

@@ -0,0 +1,67 @@
+<script lang="ts">
+	export let height = '24px'
+	export let width = '24px'
+</script>
+
+<svg
+   version="1.1"
+   id="svg2"
+   xml:space="preserve"
+	 {width}
+	 {height}
+   viewBox="0 0 246.66667 231.54668"
+   xmlns="http://www.w3.org/2000/svg"
+>
+	<g
+		id="g8"
+		transform="matrix(1.3333333,0,0,-1.3333333,0,231.54667)"
+	>
+		<g id="g10" transform="scale(0.1)">
+			<path
+				d="M 0,0 H 1850 V 1736.64 H 0 Z"
+				style="fill:#223141;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path12"
+			/>
+			<path
+				d="M 1137.17,231.82 H 712.832 v 424.328 h -424.34 v 424.342 h 424.34 V 656.148 H 1137.17 V 231.82"
+				style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path14"
+			/>
+			<path
+				d="M 1137.17,231.82 H 712.832 v 424.328 h -424.34 v 424.342 h 424.34 V 656.148 H 1137.17 V 231.82"
+				style="fill:#575d6c;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path16"
+			/>
+			<path
+				d="M 288.496,231.82 H 712.832 V 656.148 H 288.496 Z"
+				style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path18"
+			/>
+			<path
+				d="M 1561.51,656.148 H 1137.17 V 1080.49 H 712.832 v 424.33 h 424.338 v -424.33 h 424.34 V 656.148"
+				style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path20"
+			/>
+			<path
+				d="M 1561.51,656.148 H 1137.17 V 1080.49 H 712.832 v 424.33 h 424.338 v -424.33 h 424.34 V 656.148"
+				style="fill:#b2b1b9;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path22"
+			/>
+			<path
+				d="m 712.832,656.148 h 424.34 v 424.34 h -424.34 z"
+				style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path24"
+			/>
+			<path
+				d="m 712.832,656.148 h 424.34 v 424.34 h -424.34 z"
+				style="fill:#cbc9ce;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path26"
+			/>
+			<path
+				d="m 1561.5,1080.49 h -424.33 v 424.33 h 424.33 v -424.33"
+				style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+				id="path28"
+			/>
+		</g>
+	</g>
+</svg>

frontend/src/lib/components/icons/index.ts

@@ -19,6 +19,7 @@ import Slack from './Slack.svelte'
 import TogglIcon from './TogglIcon.svelte'
 import WindmillIcon from './WindmillIcon.svelte'
 import MailchimpIcon from './MailchimpIcon.svelte'
+import SendgridIcon from './SendgridIcon.svelte'
 
 export const APP_TO_ICON_COMPONENT =  {
 	postgresql: PostgresIcon,
@@ -42,7 +43,8 @@ export const APP_TO_ICON_COMPONENT =  {
 	matrix: MatrixIcon,
 	windmill: WindmillIcon,
 	http: HttpIcon,
-	mailchimp: MailchimpIcon
+	mailchimp: MailchimpIcon,
+	sendgrid: SendgridIcon,
 } as const
 
 export {
@@ -67,4 +69,5 @@ export {
 	TogglIcon,
 	WindmillIcon,
 	MailchimpIcon,
+	SendgridIcon,
 }