refactor: Update PoolRequirementPool component to remove a course

[phrogwrld]

// $lib/components/degreeTracker/PoolRequirementPool.svelte
<script lang="ts">

  import { enhance } from '$app/forms';
  import { poolCourses } from '$lib/stores/degreeTracker';
  //       ^~~~~~~~~~~         ^~~~~~~~~~~~~~~~~~~~~~~~~~~   The problem

  export let requirement: ProgramRequirement;
  let courses: CourseWithRequirement[];
  export let completedCoursesStore: any;
  export let courseGradesStore: any;
  export let onAddCourse: (requirementId: string) => void;

  poolCourses.subscribe((value) => {
    courses = value;
  });
</script>

I get problems, specifically Cannot find module '$lib/stores/degreeTracker' imported from 'C:/Users/phrog/Documents/Code/CSSProjects/advising-proj/src/lib/components/degreeTracker/PoolRequirementPool.svelte'

If this improves the performance of the code, readability and such i have no problems with it.

[phrogwrld]

<script lang="ts">

// Form submission handling
async function handleSubmit(event: Event) {
    event.preventDefault();
    const formEl = event.target as HTMLFormElement;

    const formData = new FormData(formEl);

    try {
      const response = await fetch(formEl.action, {
        method: 'POST',
        body: formData
      });

      if (response.ok) {
        courses = courses.filter((course) => course.id !== formData.get('courseId'));
        // Update the state with the new data
        const newData = await response.json();
        console.log('newData:', newData);
        // data = newData; // Update the data object with the new data
      } else {
        console.error('Form submission failed');
      }
    } catch (error) {
      console.error('Form submission error:', error);
    }
  }
</script>

// ...

<form method="POST" action="?/removeCourse" on:submit|preventDefault={handleSubmit}>
  <input type="hidden" name="courseId" value={course.id} />
  <input type="hidden" name="requirementId" value={requirement.id} />
     <button type="submit" class="ml-2 text-red-500 hover:text-red-700">
        <TrashIcon />
     </button>
</form>

This should definitely be using use:enhance instead of a on:submit action. Definitely returning the new data is the fix to the problem we were having. Maybe make the server script return a success message and the new data instead?

[phrogwrld]

Everything else looks fine, once the reactivity hasn't break. But those two problems needs to be fixed before the merge can happen

[aquonbovell]

forgot to add the file to the commit; and the reactivity is working