Finalise text in reasonsWhy, i18n support coming later

components/NumberedList.vue

@@ -6,9 +6,11 @@
       </span>
       <span class="text-4xl sm:text-5xl font-bold"> {{ item.title }} </span>
     </div>
-    <span class="text-xl" v-for="paragraph in item.body">
-      {{ paragraph }}
-    </span>
+    <span
+      v-html="useFormatting(paragraph)"
+      class="text-xl"
+      v-for="paragraph in item.body"
+    />
   </div>
 </template>
 

components/TitledSection.vue

@@ -10,24 +10,12 @@
     <div v-for="(info, title) in data" class="text-xl indent-4">
       <span v-if="numbered"> {{ title + 1 }}. </span>
       <span v-else class="font-bold select-none"> &bull;&nbsp; </span>
-      <span v-if="!URLRegex.test(info)">
-        {{ info }}
-      </span>
-      <span v-else v-html="info.replace(URLRegex, getLinksFromText)" />
+      <span v-html="useUrls(info)" />
     </div>
   </div>
 </template>
 
 <script setup>
-const URLRegex = new RegExp(
-  /(http|ftp|https):\/\/([\w_-]+(?:(?:\.[\w_-]+)+))([\w.,@?^=%&:\/~+#-]*[\w@?^=%&\/~+#-])/,
-)
-
-const getLinksFromText = function (text) {
-  const newText = `<a class="text-[var(--brand-blue)]" href="${text}">${text}</a>`
-  return newText
-}
-
 const props = defineProps({
   data: Object,
   title: String,

composables/formatter.ts

@@ -0,0 +1,28 @@
+export const useUrls = (text: string) => {
+  const URLRegex = new RegExp(
+    /(http|ftp|https):\/\/([\w_-]+(?:(?:\.[\w_-]+)+))([\w.,@?^=%&:\/~+#-]*[\w@?^=%&\/~+#-])/,
+  )
+
+  const returnableText = (text: string) => {
+    return `<a target="_blank" class="text-[var(--brand-blue)]" href="${text}">${text}</a>`
+  }
+
+  try {
+    return text.replace(URLRegex, returnableText)
+  } catch {
+    return text ?? "undefined"
+  }
+}
+
+export const useUnorderedList = (text: string) => {
+  if (text.startsWith("- ")) {
+    return "<li>" + text.replace("- ", "") + "</li>"
+  }
+  return text
+}
+
+export const useFormatting = (text: string) => {
+  let finalText = useUrls(text)
+  finalText = useUnorderedList(finalText)
+  return finalText
+}

package.json

@@ -7,7 +7,8 @@
     "dev": "nuxt dev",
     "generate": "nuxt generate",
     "preview": "nuxt preview",
-    "postinstall": "nuxt prepare"
+    "postinstall": "nuxt prepare",
+    "format": "prettier --write ."
   },
   "dependencies": {
     "@nuxtjs/i18n": "^8.3.1",

pages/experiments.vue

@@ -29,22 +29,6 @@
           </option>
         </NESelect>
       </div>
-      <div
-        class="flex flex-col gap-2 border-2 rounded-xl p-5 border-[var(--text-colour)]"
-      >
-        <span class="flex items-center gap-2 font-bold text-lg">
-          <LucideShieldQuestion /> Why not Essential?
-        </span>
-        <p>
-          Current Selection: <span class="font-bold">{{ whyNot }}</span>
-        </p>
-        <NEButton
-          class="w-fit cursor-pointer"
-          @click="whyNot = !whyNot"
-          secondary
-          >Set to {{ !whyNot }}</NEButton
-        >
-      </div>
     </div>
   </div>
 </template>
@@ -54,8 +38,6 @@ useSeoMeta({
   title: "Experiments",
 })
 
-const whyNot = useCookie("whyNotEssential", { default: () => false })
-
 const { locale, locales, setLocale } = useI18n()
 
 const availableLocales = computed(() => {

pages/index.vue

@@ -20,25 +20,32 @@
     </NEButton>
 
     <PageHero
-      v-if="whyNot === true && showReasons === true"
+      v-if="showReasons === true"
       title="WHY?"
       subTitle="Many people wonder why not to use Essential. We hope to make the reasons
       clear."
     />
 
-    <NumberedList
-      v-if="whyNot === true && showReasons === true"
-      :data="reasonsWhy"
-    />
+    <NumberedList v-if="showReasons === true" :data="reasonsWhy" />
 
-    <span v-if="whyNot === true">
+    <span>
       In case it wasn't clear, don't harrass any people affiliated with
       Essential. We simply find that the flaws with Essential make it
       undesirable in most modded Minecraft circumstances. We do not have any
       conflicts with anybody at Essential.
     </span>
+    <span>
+      Please report any problems on our
+      <NELink to="https://github.com/notessentialsite" :external="true"
+        >Github</NELink
+      >
+      or
+      <NELink to="https://discord.gg/wncdz7e8jy" :external="true"
+        >Discord.</NELink
+      ></span
+    >
 
-    <span v-if="whyNot === true" class="flex flex-row gap-2"
+    <span class="flex flex-row gap-2"
       >with<LucideHeart class="stroke-[var(--brand-blue)]" /> from all at the
       NotEssential team
     </span>
@@ -51,9 +58,6 @@ const minecraftText = ref("MINECRAFT")
 if (Math.floor(Math.random() * 10000) === 0) {
   minecraftText.value = "MINCERAFT"
 }
-
-const whyNot = useCookie("whyNotEssential", { default: () => false })
-
 const showReasons = ref(false)
 if (process.client) {
   onMounted(() => {
@@ -67,6 +71,8 @@ const reasonsWhy = [
     body: [
       "Essential's large-sweeping modifications to the game cause many side effects, mainly incompatibility with other mods.",
       "While Essential's desision to go source-available (not the same as open-source) may help improve compatibility issues, it's too soon to tell.",
+      "For uninitiated users, open-source differs from source-available in that any user can send a request to fix an issue or add a new feature, which source-available doesn't let you do.",
+      "We have a gallery of people saying that removing Essential has fixed an issue they experienced, you can find this at https://notessentialsite.github.io/gallery/",
     ],
   },
   {
@@ -80,9 +86,9 @@ const reasonsWhy = [
     title: "Microtransactions",
     body: [
       'In a game that is primarily played by children, Essential advertises its cosmetics shop, featuring microtransactions where you can buy "Essential Coins".',
-      "While Essential does need money to support their devs and some of their features, a store with microtransactions seems very predatory considering the context.",
+      "While Essential does need money to support their devs and some of their features, a store with special currency microtransactions seems very predatory considering the context.",
       'Additionally, they have a system where you can purchase coins only in "bundles" which encourages over-purchase of coins, potentially wasting the remaining coins.',
-      "This isn't exclusive to Essential, as it's a problem for Minecraft Bedrock Edition, as well as other (mainly mobile/gacha) games. This, however, makes it seem like they know what they are doing.",
+      "This isn't exclusive to Essential, as it's a problem for Minecraft Bedrock Edition (which is a major annoyance point for most players), as well as other (mainly mobile/gacha) games. This, however, makes it seem like they know what they are doing.",
     ],
   },
   {
@@ -91,14 +97,23 @@ const reasonsWhy = [
       "Essential requires that you accept the ToS in order to use the mod. This can come across as a red flag to some, as generally this is only present as a confirmation that you don't mind your data being harvested.",
       "While Essential's Privacy Policy states the data they collect (and it's not very significant to most people), most people will not be reading the policy, especially with the required legalese to cover their bases.",
       "Additionally, this is a game played by kids, the cohort that are most likely clueless on what a Terms of Service or Privacy Policy is, and don't understand the data they are giving out by agreeing and especially don't understand the language being used, even if kids are legally not allowed to agree to contracts in some areas.",
-      "For full clarity, this is what Essential says (verbatim) they collect on their Privacy Policy (updated 27/8/2024): Minecraft UUID, Minecraft & modloader versions, Mod Checksums using MD5, User interfaces the player enters during their session, Cosmetics that players choose to preview, Essential config values (with random A/B testing), Servers you join (if you choose to enable it in privacy settings), and computer specs.",
+      "For full clarity, Essential says, on their Privacy Policy (checked 27/8/2024), they collect:",
+      "- Minecraft UUID, Minecraft & modloader versions",
+      "- Mod Checksums using MD5",
+      "- User interfaces the player enters during their session",
+      "- Cosmetics that players choose to preview",
+      "- Essential config values (with random A/B testing)",
+      "- Servers you join (if you choose to enable it in privacy settings)",
+      "- Your computer specs",
+      "Their privacy policy can be found at https://essential.gg/privacy-policy, which may be updated at any point after the writing of this.",
     ],
   },
   {
     title: "Too much bloat",
     body: [
-      'For a mod that advertises itself as the "essential tool for Minecraft", it has too many things included.',
+      'For a mod that advertises itself as the "essential tool for Minecraft", it has too many features included within.',
       "The concept of an all-in-one mod isn't bad, but as a mod that should easily fit with other mods, having too many features causes too many potential conflicts.",
+      "Being an all-in-one mod has downsides too, most notably that if a feature is crashing, the only easy solution for most users is removing the entire mod.",
       "The problems mentioned previously regarding compatibility with other mods certainly doesn't help Essential's case either.",
     ],
   },