From 4e4fa273649acac8ef2f64996e5f8cac5463101c Mon Sep 17 00:00:00 2001
From: neil <neil@neils-MacBook-Pro.local>
Date: Wed, 21 Dec 2022 13:08:55 +0800
Subject: [PATCH] #101 news and essential workshops should open browser

---
 .../components/EssentialWorkshops/EssentialWorkshops.svelte  | 2 +-
 .../src/components/FeaturedCourses/FeaturedCourses.svelte    | 1 +
 modules/gui/src/components/News/News.svelte                  | 2 +-
 modules/ui/src/Gallery/Gallery.svelte                        | 3 ++-
 modules/ui/src/Posts/Posts.svelte                            | 5 ++++-
 5 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/modules/gui/src/components/EssentialWorkshops/EssentialWorkshops.svelte b/modules/gui/src/components/EssentialWorkshops/EssentialWorkshops.svelte
index 4d48bd8..d559d35 100644
--- a/modules/gui/src/components/EssentialWorkshops/EssentialWorkshops.svelte
+++ b/modules/gui/src/components/EssentialWorkshops/EssentialWorkshops.svelte
@@ -16,7 +16,7 @@
 
 <PanelHeader title="Essential Workshops" ctaLabel="View all" ctaLink="/" />
 {#if courses.length}
-	<Posts posts={courses} />
+	<Posts posts={courses} linkTarget="_blank" />
 {:else}
 	<section class="h-64 border border-gray bg-black p-4">
 		<Preloader />
diff --git a/modules/gui/src/components/FeaturedCourses/FeaturedCourses.svelte b/modules/gui/src/components/FeaturedCourses/FeaturedCourses.svelte
index 4febfe4..7e76fe8 100644
--- a/modules/gui/src/components/FeaturedCourses/FeaturedCourses.svelte
+++ b/modules/gui/src/components/FeaturedCourses/FeaturedCourses.svelte
@@ -23,4 +23,5 @@
 		imageUrl: course.banner_image_url,
 		link: course.link
 	}))}
+	linkTarget="_blank"
 />
diff --git a/modules/gui/src/components/News/News.svelte b/modules/gui/src/components/News/News.svelte
index 91069ab..800aa9f 100644
--- a/modules/gui/src/components/News/News.svelte
+++ b/modules/gui/src/components/News/News.svelte
@@ -16,7 +16,7 @@
 
 <PanelHeader title="Open-source News" ctaLabel="Read more articles >" ctaLink="/" />
 {#if news.length}
-	<Posts posts={news} />
+	<Posts posts={news} linkTarget="_blank" />
 {:else}
 	<section class="h-64 border border-gray bg-black p-4">
 		<Preloader />
diff --git a/modules/ui/src/Gallery/Gallery.svelte b/modules/ui/src/Gallery/Gallery.svelte
index 1c1d5ef..5aec659 100644
--- a/modules/ui/src/Gallery/Gallery.svelte
+++ b/modules/ui/src/Gallery/Gallery.svelte
@@ -6,6 +6,7 @@
 	import GalleryItem from './GalleryItem.svelte';
 
 	export let title = '';
+	export let linkTarget = '';
 
 	interface GalleryItemShape {
 		imageUrl: string;
@@ -77,7 +78,7 @@
 			<section class="absolute top-0 flex h-full" style={styleFeaturedPackages}>
 				{#each items as item}
 					<div class="h-full" style={`width:${width}px`}>
-						<a href={item.link}>
+						<a href={item.link} target={linkTarget} rel="noopener">
 							<GalleryItem {...item} {width} />
 						</a>
 					</div>
diff --git a/modules/ui/src/Posts/Posts.svelte b/modules/ui/src/Posts/Posts.svelte
index 62c1d3a..f3bbde4 100644
--- a/modules/ui/src/Posts/Posts.svelte
+++ b/modules/ui/src/Posts/Posts.svelte
@@ -2,6 +2,7 @@
 	import '../app.css';
 	import type { AirtablePost } from '../types';
 
+	export let linkTarget = '';
 	export let posts: AirtablePost[] = [];
 </script>
 
@@ -15,7 +16,9 @@
 				<section class="w-2/3 p-4 font-sono">
 					<h1 class="text-xl text-primary">{article.title}</h1>
 					<p class="my-4 text-sm line-clamp-4">{article.short_description}</p>
-					<a href={article.link} class="text-sm text-primary underline">Read more ...</a>
+					<a href={article.link} target={linkTarget} class="text-sm text-primary underline"
+						>Read more ...</a
+					>
 				</section>
 			</article>
 		</li>