Species icons (#43)

GenerateNU · Nov 24, 2024 · 8db2494 · 8db2494
1 parent 23911e1
commit 8db2494
Show file tree

Hide file tree

Showing 16 changed files with 278 additions and 80 deletions.
diff --git a/backend/src/controllers/species/get.ts b/backend/src/controllers/species/get.ts
@@ -1,6 +1,6 @@
 import express from 'express';
-import { Species } from '../../models/species';
 import Fuse from 'fuse.js';
+import { Species } from '../../models/species';
 
 export const getById = async (req: express.Request, res: express.Response) => {
   const id = req.params.id;
@@ -24,7 +24,6 @@ export const searchSpecies = async (
   res: express.Response,
 ) => {
   const allSpecies = await Species.find();
-  console.log(allSpecies.length);
   //More options can be added later
   //https://www.fusejs.io/api/options.html
   const fuse = new Fuse(allSpecies, {

diff --git a/backend/src/models/species.ts b/backend/src/models/species.ts
@@ -8,6 +8,15 @@ const SpeciesSchema = new mongoose.Schema({
   scientificName: { type: String },
   introduction: { type: String },
   imageUrls: [String],
+  iconUrl: { type: String, required: true },
+  species: { type: String, required: true },
+  genus: { type: String },
+  family: { type: String },
+  order: { type: String },
+  class: { type: String },
+  phylum: { type: String },
+  kingdom: { type: String },
+  domain: { type: String },
 });
 
 export const Species = mongoose.model('Species', SpeciesSchema);
diff --git a/backend/src/models/taxon.ts b/backend/src/models/taxon.ts
@@ -0,0 +1,9 @@
+import mongoose from 'mongoose';
+
+const TaxonSchema = new mongoose.Schema({
+  name: { type: String, required: true },
+  rank: { type: String, required: true },
+  iconUri: { type: String },
+});
+
+export const Taxons = mongoose.model('Taxon', TaxonSchema);
diff --git a/backend/src/routes/species.ts b/backend/src/routes/species.ts
@@ -1,10 +1,10 @@
 import express from 'express';
-import { isAuthenticated } from '../middlewares/authMiddleware';
 import {
   getById,
   getByScientificName,
   searchSpecies,
 } from '../controllers/species/get';
+import { isAuthenticated } from '../middlewares/authMiddleware';
 
 /**
  * @swagger

diff --git a/frontend/app/(app)/(postcreation)/components/fish-search.tsx b/frontend/app/(app)/(postcreation)/components/fish-search.tsx
@@ -1,19 +1,17 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
+import { useFormContext } from 'react-hook-form';
 import {
-  TextInput,
-  View,
   Image,
+  ScrollView,
   Text,
+  TextInput,
   TouchableOpacity,
-  ScrollView,
+  View,
 } from 'react-native';
-import { useFormContext } from 'react-hook-form';
-import { useState, useEffect } from 'react';
+import { searchSpecies } from '../../../../api/species';
 import Tag from '../../../../components/tag';
-import { apiConfig } from '../../../../api/apiContext';
-import { SpeciesContent } from '../../../../types/species';
 import { TagData } from '../../../../types/divelog';
-import { searchSpecies } from '../../../../api/species';
+import { SpeciesContent } from '../../../../types/species';
 
 export default function FishSearch() {
   const { setValue, watch } = useFormContext();

diff --git a/frontend/app/(app)/(postcreation)/components/post-creation-form.tsx b/frontend/app/(app)/(postcreation)/components/post-creation-form.tsx
@@ -1,17 +1,17 @@
+import { faAngleLeft } from '@fortawesome/free-solid-svg-icons';
+import { router } from 'expo-router';
 import React, { useState } from 'react';
-import { View, Text, Modal } from 'react-native';
-import { useFormContext, Controller } from 'react-hook-form';
-import ImagePicker from '../../../../components/image-picker';
+import { Controller, useFormContext } from 'react-hook-form';
+import { Modal, Text, View } from 'react-native';
+import { postDiveLog } from '../../../../api/divelog';
 import BigText from '../../../../components/bigtext';
 import Button from '../../../../components/button';
-import PageButton from './page-button';
-import { router } from 'expo-router';
-import Tag from '../../../../components/tag';
-import Map from '../../../../components/map';
 import IconButton from '../../../../components/icon-button';
-import { faAngleLeft } from '@fortawesome/free-solid-svg-icons';
-import { Location, FormFields, TagData } from '../../../../types/divelog';
-import { postDiveLog } from '../../../../api/divelog';
+import ImagePicker from '../../../../components/image-picker';
+import Map from '../../../../components/map';
+import Tag from '../../../../components/tag';
+import { FormFields, Location, TagData } from '../../../../types/divelog';
+import PageButton from './page-button';
 
 export default function PostCreationForm() {
   const [modalVisible, setModalVisible] = useState(false);

diff --git a/frontend/app/(app)/user/components/menu.tsx b/frontend/app/(app)/user/components/menu.tsx
@@ -1,17 +1,17 @@
 import React, { useState } from 'react';
-import { View, Text, TouchableOpacity, FlatList } from 'react-native';
+import { FlatList, Text, TouchableOpacity, View } from 'react-native';
 import { useAuthStore } from '../../../../auth/authStore';
+import DiveLog from '../../../../components/divelog/divelog';
+import PopulatedInfoPopupButton from '../../../../components/populated-info-popup';
+import { PROFILE_PHOTO } from '../../../../consts/profile';
 import {
   useUserById,
   useUserDiveLogs,
   useUserSpecies,
 } from '../../../../hooks/user';
-import Species from './species';
 import DiveLogSkeleton from './skeleton/divelog-skeleton';
 import SpeciesSkeleton from './skeleton/species-skeleton';
-import { PROFILE_PHOTO } from '../../../../consts/profile';
-import PopulatedInfoPopupButton from '../../../../components/populated-info-popup';
-import DiveLog from '../../../../components/divelog/divelog';
+import Species from './species';
 
 const Menu = ({ id }: { id: string }) => {
   const [category, setCategory] = useState('Dives');
@@ -67,7 +67,7 @@ const Menu = ({ id }: { id: string }) => {
   const renderSpecies = ({ item }: { item: any }) => {
     return (
       <PopulatedInfoPopupButton key={item._id} speciesId={item.scientificName}>
-        <Species />
+        <Species image={item.iconUrl} />
       </PopulatedInfoPopupButton>
     );
   };

diff --git a/frontend/app/(app)/user/components/species.tsx b/frontend/app/(app)/user/components/species.tsx
@@ -1,6 +1,5 @@
-import { Text, TouchableOpacity } from 'react-native';
-import Fish from '../../../../assets/species.svg';
 import React from 'react';
+import { Image, Text, TouchableOpacity } from 'react-native';
 
 interface SpeciesProps {
   text?: string;
@@ -15,7 +14,13 @@ const Species: React.FC<SpeciesProps> = React.memo(
         onPress={onPress}
         className="bg-water mb-3 rounded-md flex flex-col w-[32%] justify-center items-center pt-[2%] pb-[5%]"
       >
-        <Fish height={80} width={80} />
+        <Image
+          height={80}
+          width={80}
+          source={{
+            uri: image,
+          }}
+        />
         <Text className="text-center px-2 font-bold text-xs sm:text-sm md:text-md">
           {text}
         </Text>

diff --git a/frontend/components/info-popup.tsx b/frontend/components/info-popup.tsx
@@ -1,15 +1,15 @@
+import { useEffect, useRef } from 'react';
 import {
-  View,
-  Text,
-  Image,
-  ScrollView,
   Animated,
-  Easing,
   Dimensions,
+  Easing,
+  Image,
   Pressable,
+  ScrollView,
+  Text,
+  View,
 } from 'react-native';
 import { useInfoPopup } from '../contexts/info-popup-context';
-import { useEffect, useRef } from 'react';
 
 const InfoPopup = () => {
   const { speciesContent, isOpen, setClose } = useInfoPopup();
@@ -55,9 +55,11 @@ const InfoPopup = () => {
             </Text>
           </View>
           <Image
-            className=" h-16 w-32"
+            className=" h-32 w-32"
             source={{
-              uri: 'https://www.fisheries.noaa.gov/s3/2022-09/640x427-Snapper-Red-NOAAFisheries.png',
+              uri:
+                speciesContent.iconUrl ||
+                'https://dodo.ac/np/images/0/00/Black_Bass_NH_Icon.png',
             }}
           />
         </View>

diff --git a/frontend/contexts/info-popup-context.tsx b/frontend/contexts/info-popup-context.tsx
@@ -9,6 +9,7 @@ const defaultContent: SpeciesContent = {
   articleTitle: 'Title',
   articleUrl: 'wwww.wikipedia.org/stuff',
   imageUrls: [],
+  iconUrl: 'https://dodo.ac/np/images/0/00/Black_Bass_NH_Icon.png',
   locations: [],
 };
 

diff --git a/frontend/types/species.ts b/frontend/types/species.ts
@@ -1,11 +1,20 @@
 export type SpeciesContent = {
   _id: string;
-  aphiaId: { type: String };
-  articleUrl: { type: String };
-  articleTitle: { type: String };
+  aphiaId: string;
+  articleUrl: string;
+  articleTitle: string;
   commonNames: string[];
-  scientificName: { type: String };
-  introduction: { type: String };
-  imageUrls: [String];
+  scientificName: string;
+  introduction: string;
+  imageUrls: string[];
+  iconUrl: string;
+  species: string;
+  genus: string;
+  family: string;
+  order: string;
+  class: string;
+  phylum: string;
+  kingdom: string;
+  domain: string;
   visibility: boolean;
 };
diff --git a/scripts/README.md b/scripts/README.md
@@ -21,7 +21,7 @@ Make sure you are located in the `scripts/` directory and run the following
 commands.
 
 ```bash
-python -m venv venv
+python3 -m venv venv
 source venv/bin/activate
 pip install -r requirements.txt
 ```

diff --git a/scripts/icon_mapping.py b/scripts/icon_mapping.py
@@ -0,0 +1,123 @@
+ICON_MAPPING = {
+  "Q726399": "https://dodo.ac/np/images/0/0b/Betta_NH_Icon.png",
+  "Q127282": "https://dodo.ac/np/images/0/00/Black_Bass_NH_Icon.png",
+  "Q60500115": "https://dodo.ac/np/images/4/47/Butterfly_Fish_NH_Icon.png",
+  "Q1137485": "https://dodo.ac/np/images/e/e0/Barreleye_NH_Icon.png",
+  "Q501720": "https://dodo.ac/np/images/4/4f/Clown_Fish_NH_Icon.png",
+  "Q192662": "https://dodo.ac/np/images/7/7f/Anchovy_%28Fish%29_NH_Icon.png",
+  "Q647004": "https://dodo.ac/np/images/0/0c/Bluegill_NH_Icon.png",
+  "Q201701": "https://dodo.ac/np/images/9/95/Blowfish_NH_Icon.png",
+  "Q133325": "https://dodo.ac/np/images/d/db/Cherry_Salmon_NH_Icon.png",
+  "Q5045578": "https://dodo.ac/np/images/5/5d/Carp_NH_Icon.png",
+  "Q13930943": "https://dodo.ac/np/images/d/d5/Barred_Knifejaw_NH_Icon.png",
+  "Q9948893": "https://dodo.ac/np/images/b/b1/Arapaima_NH_Icon.png",
+  "Q905232": "https://dodo.ac/np/images/2/2a/Blue_Marlin_NH_Icon.png",
+  "Q214145": "https://dodo.ac/np/images/c/cd/Angelfish_NH_Icon.png",
+  "Q546243": "https://dodo.ac/np/images/6/67/Arowana_NH_Icon.png",
+  "Q548682": "https://dodo.ac/np/images/8/80/Char_NH_Icon.png",
+  "Q345772": "https://dodo.ac/np/images/4/4d/Bitterling_NH_Icon.png",
+  "Q20738632": "https://dodo.ac/np/images/4/45/Coelacanth_NH_Icon.png",
+  "Q1133124": "https://dodo.ac/np/images/9/96/Crawfish_NH_Icon.png",
+  "Q2081138": "https://dodo.ac/np/images/1/1f/Dab_NH_Icon.png",
+  "Q59576": "https://dodo.ac/np/images/0/0d/Catfish_NH_Icon.png",
+  "Q312225": "https://dodo.ac/np/images/d/db/Dace_NH_Icon.png",
+  "Q128685": "https://dodo.ac/np/images/2/26/Ribbon_Eel_NH_Icon.png",
+  "Q184238": "https://dodo.ac/np/images/f/fc/Golden_Trout_NH_Icon.png",
+  "Q208490": "https://dodo.ac/np/images/e/ec/Hammerhead_Shark_NH_Icon.png",
+  "Q53636": "https://dodo.ac/np/images/2/2f/Frog_NH_Icon.png",
+  "Q181871": "https://dodo.ac/np/images/9/91/Sturgeon_NH_Icon.png",
+  "Q1399107": "https://dodo.ac/np/images/b/b3/Olive_Flounder_NH_Icon.png",
+  "Q1551152": "https://dodo.ac/np/images/c/cb/Surgeonfish_NH_Icon.png",
+  "Q1770703": "https://dodo.ac/np/images/e/ef/Tilapia_NH_Icon.png",
+  "Q849721": "https://dodo.ac/np/images/d/d6/Mahi-Mahi_NH_Icon.png",
+  "Q1078201": "https://dodo.ac/np/images/5/50/Oarfish_NH_Icon.png",
+  "Q1854941": "https://dodo.ac/np/images/3/35/Ranchu_Goldfish_NH_Icon.png",
+  "Q913333": "https://dodo.ac/np/images/4/42/Neon_Tetra_NH_Icon.png",
+  "Q1303295": "https://dodo.ac/np/images/4/46/Saddled_Bichir_NH_Icon.png",
+  "Q618552": "https://dodo.ac/np/images/5/50/Giant_Snakehead_NH_Icon.png",
+  "Q833503": "https://dodo.ac/np/images/e/e1/King_Salmon_NH_Icon.png",
+  "Q74363": "https://dodo.ac/np/images/d/dc/Sea_Horse_NH_Icon.png",
+  "Q194031": "https://dodo.ac/np/images/f/f2/Crucian_Carp_NH_Icon.png",
+  "Q9292308": "https://dodo.ac/np/images/3/34/Football_Fish_NH_Icon.png",
+  "Q139783": "https://dodo.ac/np/images/1/17/Giant_Trevally_NH_Icon.png",
+  "Q132133": "https://dodo.ac/np/images/e/ea/Killifish_NH_Icon.png",
+  "Q1431202": "https://dodo.ac/np/images/e/ea/Killifish_NH_Icon.png",
+  "Q2359231": "https://dodo.ac/np/images/e/ea/Killifish_NH_Icon.png",
+  "Q387587": "https://dodo.ac/np/images/e/ee/Puffer_Fish_NH_Icon.png",
+  "Q14443": "https://dodo.ac/np/images/f/fe/Dorado_NH_Icon.png",
+  "Q134268": "https://dodo.ac/np/images/0/0b/Nibble_Fish_NH_Icon.png",
+  "Q901804": "https://dodo.ac/np/images/8/85/Zebra_Turkeyfish_NH_Icon.png",
+  "Q3246258": "https://dodo.ac/np/images/2/2d/Koi_NH_Icon.png",
+  "Q4468": "https://dodo.ac/np/images/e/ec/Freshwater_Goby_NH_Icon.png",
+  "Q35076": "https://dodo.ac/np/images/3/3e/Moray_Eel_NH_Icon.png",
+  "Q3404184": "https://dodo.ac/np/images/4/45/Saw_Shark_NH_Icon.png",
+  "Q188879": "https://dodo.ac/np/images/c/ca/Salmon_NH_Icon.png",
+  "Q757287": "https://dodo.ac/np/images/7/7f/Sea_Bass_NH_Icon.png",
+  "Q237800": "https://dodo.ac/np/images/7/71/Goldfish_NH_Icon.png",
+  "Q177879": "https://dodo.ac/np/images/a/a5/Loach_NH_Icon.png",
+  "Q506144": "https://dodo.ac/np/images/a/a2/Gar_NH_Icon.png",
+  "Q10908": "https://dodo.ac/np/images/b/bb/Tadpole_NH_Icon.png",
+  "Q18372588": "https://dodo.ac/np/images/c/c6/Piranha_NH_Icon.png",
+  "Q140490": "https://dodo.ac/np/images/e/eb/Stringfish_NH_Icon.png",
+  "Q2938003": "https://dodo.ac/np/images/2/20/Great_White_Shark_NH_Icon.png",
+  "Q191674": "https://dodo.ac/np/images/9/9f/Pike_NH_Icon.png",
+  "Q796580": "https://dodo.ac/np/images/9/9b/Ray_NH_Icon.png",
+  "Q4610": "https://dodo.ac/np/images/9/9d/Mitten_Crab_NH_Icon.png",
+  "Q223044": "https://dodo.ac/np/images/e/eb/Soft-Shelled_Turtle_NH_Icon.png",
+  "Q1031983": "https://dodo.ac/np/images/f/f7/Sea_Butterfly_NH_Icon.png",
+  "Q239771": "https://dodo.ac/np/images/d/de/Suckerfish_NH_Icon.png",
+  "Q215185": "https://dodo.ac/np/images/4/4b/Tuna_NH_Icon.png",
+  "Q3502483": "https://dodo.ac/np/images/0/0f/Pond_Smelt_NH_Icon.png",
+  "Q1178471": "https://dodo.ac/np/images/e/eb/Ocean_Sunfish_NH_Icon.png",
+  "Q650212": "https://dodo.ac/np/images/b/b1/Snapping_Turtle_NH_Icon.png",
+  "Q501728": "https://dodo.ac/np/images/a/a3/Horse_Mackerel_NH_Icon.png",
+  "Q1141512": "https://dodo.ac/np/images/e/e7/Rainbowfish_NH_Icon.png",
+  "Q80378": "https://dodo.ac/np/images/4/4f/Whale_Shark_NH_Icon.png",
+  "Q2702507": "https://dodo.ac/np/images/e/e2/Pale_Chub_NH_Icon.png",
+  "Q1889210": "https://dodo.ac/np/images/c/c1/Red_Snapper_NH_Icon.png",
+  "Q568755": "https://dodo.ac/np/images/6/6a/Sweetfish_NH_Icon.png",
+  "Q463057": "https://dodo.ac/np/images/3/38/Guppy_NH_Icon.png",
+  "Q600262": "https://dodo.ac/np/images/6/67/Yellow_Perch_NH_Icon.png",
+  "Q81900": "https://dodo.ac/np/images/b/bf/Squid_NH_Icon.png",
+  "Q860437": "https://dodo.ac/np/images/3/30/Napoleonfish_NH_Icon.png",
+  "Q386633": "https://dodo.ac/np/images/6/6c/Mussel_NH_Icon.png",
+  "Q25368": "https://dodo.ac/np/images/4/4d/Oyster_NH_Icon.png",
+  "Q334855": "https://dodo.ac/np/images/7/7d/Mantis_Shrimp_NH_Icon.png",
+  "Q150628": "https://dodo.ac/np/images/a/a4/Acorn_Barnacle_NH_Icon.png",
+  "Q1038113": "https://dodo.ac/np/images/a/a9/Lobster_NH_Icon.png",
+  "Q1936093": "https://dodo.ac/np/images/6/65/Dungeness_Crab_NH_Icon.png",
+  "Q1517781": "https://dodo.ac/np/images/d/d3/Sweet_Shrimp_NH_Icon.png",
+  "Q1329239": "https://dodo.ac/np/images/5/5b/Horseshoe_Crab_NH_Icon.png",
+  "Q264543": "https://dodo.ac/np/images/8/8c/Seaweed_NH_Icon.png",
+  "Q2717246": "https://dodo.ac/np/images/7/78/Snow_Crab_NH_Icon.png",
+  "Q190093": "https://dodo.ac/np/images/0/04/Abalone_NH_Icon.png",
+  "Q1311395": "https://dodo.ac/np/images/5/55/Scallop_NH_Icon.png",
+  "Q2400989": "https://dodo.ac/np/images/f/f9/Moon_Jellyfish_NH_Icon.png",
+  "Q25349": "https://dodo.ac/np/images/6/6c/Sea_Star_NH_Icon.png",
+  "Q24115": "https://dodo.ac/np/images/5/5e/Whelk_NH_Icon.png",
+  "Q277658": "https://dodo.ac/np/images/0/05/Slate_Pencil_Urchin_NH_Icon.png",
+  "Q206338": "https://dodo.ac/np/images/0/00/Giant_Isopod_NH_Icon.png",
+  "Q83483": "https://dodo.ac/np/images/9/9c/Sea_Urchin_NH_Icon.png",
+  "Q124900": "https://dodo.ac/np/images/0/07/Flatworm_NH_Icon.png",
+  "Q900924": "https://dodo.ac/np/images/6/60/Gazami_Crab_NH_Icon.png",
+  "Q303718": "https://dodo.ac/np/images/d/d0/Firefly_Squid_NH_Icon.png",
+  "Q147256": "https://dodo.ac/np/images/e/e9/Sea_Anemone_NH_Icon.png",
+  "Q40152": "https://dodo.ac/np/images/5/58/Octopus_NH_Icon.png",
+  "Q127470": "https://dodo.ac/np/images/9/9b/Sea_Cucumber_NH_Icon.png",
+  "Q578204": "https://dodo.ac/np/images/6/65/Tiger_Prawn_NH_Icon.png",
+  "Q671668": "https://dodo.ac/np/images/6/61/Sea_Pineapple_NH_Icon.png",
+  "Q2207194": "https://dodo.ac/np/images/a/ac/Umbrella_Octopus_NH_Icon.png",
+  "Q872853": "https://dodo.ac/np/images/9/98/Chambered_Nautilus_NH_Icon.png",
+  "Q1310166": "https://dodo.ac/np/images/9/93/Turban_Shell_NH_Icon.png",
+  "Q2509902": "https://dodo.ac/np/images/a/ac/Vampire_Squid_NH_Icon.png",
+  "Q972256": "https://dodo.ac/np/images/5/54/Sea_Slug_NH_Icon.png",
+  "Q1861297": "https://dodo.ac/np/images/9/9d/Red_King_Crab_NH_Icon.png",
+  "Q1140748": "https://dodo.ac/np/images/0/0a/Pearl_Oyster_NH_Icon.png",
+  "Q724328": "https://dodo.ac/np/images/a/aa/Spotted_Garden_Eel_NH_Icon.png",
+  "Q3017714": "https://dodo.ac/np/images/c/ca/Gigas_Giant_Clam_NH_Icon.png",
+  "Q2327807": "https://dodo.ac/np/images/a/a9/Sea_Pig_NH_Icon.png",
+  "Q1936864": "https://dodo.ac/np/images/e/e7/Sea_Grapes_NH_Icon.png",
+  "Q916760": "https://dodo.ac/np/images/8/8c/Spiny_Lobster_NH_Icon.png",
+  "Q2605155": "https://dodo.ac/np/images/f/f3/Spider_Crab_NH_Icon.png",
+  "Q152351": "https://dodo.ac/np/images/6/6a/Venus%27_Flower_Basket_NH_Icon.png"
+}