From 06951eb5ff568c10f905c96cf5a2589a4ccf6b1f Mon Sep 17 00:00:00 2001
From: Brandon Egger <brandonegger64@gmail.com>
Date: Thu, 16 Mar 2023 22:22:37 -0500
Subject: [PATCH] add free icon for free apps

---
 src/components/ResourceTable.tsx | 46 +++++++++++++++++++++++---------
 src/utils/enumWordLut.ts         | 10 +++----
 2 files changed, 38 insertions(+), 18 deletions(-)

diff --git a/src/components/ResourceTable.tsx b/src/components/ResourceTable.tsx
index 6ed4650..114a6cf 100644
--- a/src/components/ResourceTable.tsx
+++ b/src/components/ResourceTable.tsx
@@ -10,13 +10,31 @@ import { ChevronDownIcon } from '@heroicons/react/24/outline';
 const ResourceEntry = ({resource}: {resource: AuditoryResource}) => {
     const ResourceInfo = ({resource}: {resource: AuditoryResource}) => {
         const PriceIcons = ({type}: {type: PaymentType}) => {
-    
-            return (
-                <div className="space-x-1" title="Weekly recurring subscription">
-                    <ArrowPathRoundedSquareIcon className="inline h-6 w-6" />
-                    <CurrencyDollarIcon className="inline h-6 w-6 text-lime-800"/>
-                </div>
-            )
+            switch(type) {
+                case "FREE": {
+                    return (
+                        <div className="pt-2 space-x-1" title="Free">
+                            <span className="bg-amber-100 italic rounded-lg border border-neutral-900 text-black px-2 py-[1px]">
+                                free
+                            </span>
+                        </div>
+                    )
+                }
+                case "SUBSCRIPTION_MONTHLY": {
+                    <div className="space-x-1" title="Monthly recurring subscription">
+                        <ArrowPathRoundedSquareIcon className="inline h-6 w-6" />
+                        <CurrencyDollarIcon className="inline h-6 w-6 text-lime-800"/>
+                    </div>
+                }
+                case "SUBSCRIPTION_WEEKLY": {
+                    return (
+                        <div className="space-x-1" title="Weekly recurring subscription">
+                            <ArrowPathRoundedSquareIcon className="inline h-6 w-6" />
+                            <CurrencyDollarIcon className="inline h-6 w-6 text-lime-800"/>
+                        </div>
+                    )
+                }
+            }
         }
     
         const PlatformInfo = ({platformLinks}: {platformLinks: PlatformLink[]}) => {
@@ -102,11 +120,13 @@ const ResourceEntry = ({resource}: {resource: AuditoryResource}) => {
     
         return (
             <div className="m-2 flex space-y-4 flex-col">
-                <div className='rounded-lg bg-gray-100 drop-shadow border border-neutral-900'>
-                    <ul className="divide-y-2">
-                        {skillsComponents}
-                    </ul>
-                </div>
+                { skillsComponents.length > 0 ?
+                    <div className='rounded-lg bg-gray-100 drop-shadow border border-neutral-900'>
+                        <ul className="divide-y-2">
+                            {skillsComponents}
+                        </ul>
+                    </div> : <></>
+                }
                 <SkillRanking skillLevels={skillLevels} />
             </div>
         )
@@ -117,7 +137,7 @@ const ResourceEntry = ({resource}: {resource: AuditoryResource}) => {
             <td className="max-w-xs">
                 <ResourceInfo resource={resource} />
             </td>
-            <td className="w-1/4 align-center">
+            <td className="w-1/4 align-top">
                 <ResourceSkills skills={resource.skills} skillLevels={resource.skill_levels} />
             </td>
             <td className="align-top hidden sm:table-cell">
diff --git a/src/utils/enumWordLut.ts b/src/utils/enumWordLut.ts
index 9a9ce43..ea681c3 100644
--- a/src/utils/enumWordLut.ts
+++ b/src/utils/enumWordLut.ts
@@ -27,25 +27,25 @@ export const translateEnumPlatform = (value: Platform) => {
 export const translateEnumSkill = (value: Skill) => {
     switch(value) {
         case "ENVIRONMENT": {
-            return "not done";
+            return "Environmental Sounds";
         }
         case "BACKGROUND": {
             return "not done";
         }
         case "DISCOURSE": {
-            return "not done";
+            return "Discourse Level";
         }
         case "MUSIC": {
-            return "Music"
+            return "Music Appreciation"
         }
         case "PHONEMES": {
-            return "not done";
+            return "Word Recognition (phonemes)";
         }
         case "SENTENCES": {
             return "Sentences"
         }
         case "WORDS": {
-            return "Word Recognition"
+            return "Words (stressed syllables)"
         }
     }
 }
\ No newline at end of file