From 36178928bb066764e3da09a64e370b088370bb51 Mon Sep 17 00:00:00 2001
From: Donny Bertucci <bertuccd@oregonstate.edu>
Date: Fri, 1 Dec 2023 11:30:42 -0800
Subject: [PATCH] feat: copy amandas code (#97)

---
 frontend/src/routes/upload/+page.svelte | 39 ++++++++++++++++++++++++-
 1 file changed, 38 insertions(+), 1 deletion(-)

diff --git a/frontend/src/routes/upload/+page.svelte b/frontend/src/routes/upload/+page.svelte
index c6211b84..0403f57d 100644
--- a/frontend/src/routes/upload/+page.svelte
+++ b/frontend/src/routes/upload/+page.svelte
@@ -1,10 +1,31 @@
 <script lang="ts">
 	import { Backend, UploadError } from "$lib/backend";
-	import { Fileupload, Button, Input, Label, Helper } from "flowbite-svelte";
+	import {
+		Fileupload,
+		Button,
+		Input,
+		Label,
+		Helper,
+		Dropdown,
+		DropdownItem,
+	} from "flowbite-svelte";
+	import { ChevronDownSolid } from "flowbite-svelte-icons";
 	import { goto } from "$app/navigation";
 	import { formatProteinName, fileToString } from "$lib/format";
 	import ArticleEditor from "$lib/ArticleEditor.svelte";
 
+	type Organism = {
+		genus: string;
+		species: string;
+	};
+
+	const organisms: Organism[] = [
+		{ genus: "Ganaspis", species: "hookeri" },
+		{ genus: "Leptopilina", species: "boulardi" },
+		{ genus: "Leptopilina", species: "heterotoma" },
+	];
+
+	let organism: Organism;
 	let name: string = "";
 	let content: string = "";
 	let files: FileList | undefined; // bind:files on the Fileupload
@@ -35,6 +56,22 @@
 			{/if}
 		</div>
 
+		<!-- Species dropdown (hardcoded, not hooked up to backend for now) -->
+		<div>
+			<Label for="organism-name" class="blcok mb-2">Organism</Label>
+			<Button>Select Organism<ChevronDownSolid size="xs" class="ml-2" /></Button
+			>
+			<Dropdown>
+				{#each organisms as dropdownOrganism}
+					<DropdownItem
+						on:click={() => {
+							organism = dropdownOrganism;
+						}}>{dropdownOrganism.genus} {dropdownOrganism.species}</DropdownItem
+					>
+				{/each}
+			</Dropdown>
+		</div>
+
 		<div>
 			<ArticleEditor bind:content bind:refs />
 		</div>