From f302ba4bfdf0a94b637d917fc218695963f4c831 Mon Sep 17 00:00:00 2001
From: Nitrrine <nitrrine@team.lodine.xyz>
Date: Sat, 13 Jul 2024 17:53:22 +0500
Subject: [PATCH] Use NE prefix for custom component & Replace External &
 Internal links with NELink

---
 components/InternalLink.vue                 | 14 ------------
 components/{Button.vue => NEButton.vue}     |  0
 components/{ExternalLink.vue => NELink.vue} | 13 ++++++-----
 components/{Select.vue => NESelect.vue}     |  0
 components/ProjectCard.vue                  |  4 ++--
 layouts/default.vue                         | 25 +++++++++++----------
 pages/flags.vue                             |  4 ++--
 pages/index.vue                             |  6 +++--
 8 files changed, 28 insertions(+), 38 deletions(-)
 delete mode 100644 components/InternalLink.vue
 rename components/{Button.vue => NEButton.vue} (100%)
 rename components/{ExternalLink.vue => NELink.vue} (54%)
 rename components/{Select.vue => NESelect.vue} (100%)

diff --git a/components/InternalLink.vue b/components/InternalLink.vue
deleted file mode 100644
index a388f04..0000000
--- a/components/InternalLink.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<template>
-  <NuxtLink
-    :to="to"
-    class="inline-flex flex-row items-center gap-1 font-bold text-[var(--brand-blue)]"
-  >
-    <slot />
-  </NuxtLink>
-</template>
-
-<script setup>
-const props = defineProps({
-  to: String,
-})
-</script>
diff --git a/components/Button.vue b/components/NEButton.vue
similarity index 100%
rename from components/Button.vue
rename to components/NEButton.vue
diff --git a/components/ExternalLink.vue b/components/NELink.vue
similarity index 54%
rename from components/ExternalLink.vue
rename to components/NELink.vue
index 24911e9..5eefbba 100644
--- a/components/ExternalLink.vue
+++ b/components/NELink.vue
@@ -1,18 +1,19 @@
 <template>
-  <a
-    :href="to"
-    target="_blank"
-    rel="noopener noreferrer"
-    class="inline-flex flex-row items-center gap-1 font-bold text-[var(--brand-blue)]"
+  <NuxtLink
+    :to="to"
+    :target="external ? '_blank' : ''"
+    :rel="external ? 'noopener noreferrer' : ''"
+    class="inline-flex flex-row items-center gap-1 font-bold text-[var(--brand-blue)] duration-300 active:scale-95"
   >
     <LucideExternalLink v-if="showIcon" />
     <slot />
-  </a>
+  </NuxtLink>
 </template>
 
 <script setup>
 const props = defineProps({
   to: String,
+  external: Boolean,
   showIcon: Boolean,
 })
 </script>
diff --git a/components/Select.vue b/components/NESelect.vue
similarity index 100%
rename from components/Select.vue
rename to components/NESelect.vue
diff --git a/components/ProjectCard.vue b/components/ProjectCard.vue
index 49dab42..5fa8f03 100644
--- a/components/ProjectCard.vue
+++ b/components/ProjectCard.vue
@@ -20,9 +20,9 @@
     </div>
     <!-- Buttons -->
     <div class="flex flex-row flex-wrap gap-3 mb-5">
-      <Button v-for="(link, index) in urls" :to="link" secondary external>
+      <NEButton v-for="(link, index) in urls" :to="link" secondary external>
         <LucideDownload />{{ index }}
-      </Button>
+      </NEButton>
     </div>
   </div>
 </template>
diff --git a/layouts/default.vue b/layouts/default.vue
index 08944b6..6a364e0 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -46,10 +46,11 @@
             <div
               class="flex flex-col gap-1 font-[500] text-[var(--text-colour)] text-sm"
             >
-              <ExternalLink
+              <NELink
                 class="font-medium text-white hover:underline"
                 to="https://github.com/blryface/notessential"
-                >{{ $t("layout.footer.open_source") }}</ExternalLink
+                external
+                >{{ $t("layout.footer.open_source") }}</NELink
               >
             </div>
           </div>
@@ -62,14 +63,14 @@
               }}</span>
               <span
                 >{{ $t("layout.footer.credit_creator") }}
-                <ExternalLink to="https://blurryface.xyz"
-                  >Blurryface</ExternalLink
+                <NELink to="https://blurryface.xyz" external
+                  >Blurryface</NELink
                 ></span
               >
               <span
                 >{{ $t("layout.footer.credit_designed") }}
-                <ExternalLink to="https://worldwidepixel.ca"
-                  >WorldWidePixel</ExternalLink
+                <NELink to="https://worldwidepixel.ca" external
+                  >WorldWidePixel</NELink
                 ></span
               >
             </div>
@@ -79,11 +80,11 @@
               <span class="font-bold text-base">{{
                 $t("layout.footer.resources")
               }}</span>
-              <InternalLink to="/contributing"
+              <NELink to="/contributing"
                 ><LucidePenBox class="h-5" />{{
                   $t("layout.footer.contributing")
                 }}
-              </InternalLink>
+              </NELink>
             </div>
             <div
               class="flex flex-col gap-2 font-[500] text-[var(--text-colour)] text-sm"
@@ -91,12 +92,12 @@
               <span class="font-bold text-base">{{
                 $t("layout.footer.interact")
               }}</span>
-              <ExternalLink to="https://crowdin.com/project/notessential"
+              <NELink to="https://crowdin.com/project/notessential" external
                 ><LucideGlobe class="h-5" />Crowdin
-              </ExternalLink>
-              <ExternalLink to="https://discord.gg/wncdz7e8jy"
+              </NELink>
+              <NELink to="https://discord.gg/wncdz7e8jy" external
                 ><LucideMessageCircle class="h-5" />Discord
-              </ExternalLink>
+              </NELink>
             </div>
           </div>
         </div>
diff --git a/pages/flags.vue b/pages/flags.vue
index 72a8792..87e4470 100644
--- a/pages/flags.vue
+++ b/pages/flags.vue
@@ -19,7 +19,7 @@
 
         <p>Available langagues:</p>
 
-        <Select v-on:change="handleLanguageChange">
+        <NESelect v-on:change="handleLanguageChange">
           <option
             v-for="locale in availableLocales"
             :value="locale.code"
@@ -27,7 +27,7 @@
           >
             {{ locale.name }}
           </option>
-        </Select>
+        </NESelect>
       </div>
     </div>
   </div>
diff --git a/pages/index.vue b/pages/index.vue
index 61d9afd..1cf5391 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -11,13 +11,15 @@
     </span>
     <!-- THE WORD 'MINECRAFT' AND THE 'NOTESSENTIAL' NAME SHOULD NOT BE LOCALISED. -->
 
+    <Link to="/" show-icon>test.com</Link>
+
     <p class="text-2xl">
       {{ $t("landing.reason") }}
     </p>
 
-    <Button class="w-fit sm:px-20 px-15 py-8" to="/alternatives">
+    <NEButton class="w-fit sm:px-20 px-15 py-8" to="/alternatives">
       <LucideArrowUpRight /> {{ $t("landing.buttons.alternatives") }}
-    </Button>
+    </NEButton>
   </div>
 </template>