diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index 3b56ba1..f636e24 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -5,8 +5,11 @@
   </component>
   <component name="ChangeListManager">
     <list default="true" id="5e320804-68c9-4504-97d5-d421de3438b2" name="Changes" comment="">
+      <change beforePath="$PROJECT_DIR$/.idea/php.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/php.xml" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/.idea/prettier.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/prettier.xml" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/pages/schedule/index.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/schedule/index.vue" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/pages/lists/[id].vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/lists/[id].vue" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/types/movielist.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/types/movielist.ts" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -62,7 +65,7 @@
     "RunOnceActivity.git.unshallow": "true",
     "WebServerToolWindowFactoryState": "false",
     "code.cleanup.on.save": "true",
-    "git-widget-placeholder": "schedule-page-updates",
+    "git-widget-placeholder": "main",
     "last_opened_file_path": "/home/tiradoe/Projects/movie-night/web/src/types",
     "list.type.of.created.stylesheet": "CSS",
     "node.js.detected.package.eslint": "true",
diff --git a/src/pages/schedule/index.vue b/src/pages/schedule/index.vue
index 88a56de..a33fa64 100644
--- a/src/pages/schedule/index.vue
+++ b/src/pages/schedule/index.vue
@@ -1,28 +1,17 @@
 <template>
   <div class="p-5 sm:p-0">
-    <div v-if="schedule && schedule?.showings.length < 1" class="p-5">
-      <span>No Showings Found</span>
-    </div>
     <ul class="flex flex-col gap-5">
-      <li
-        v-for="showing in schedule?.showings"
-        class="p-5 movie-card neon-border"
-      >
+      <li v-for="showing in showings" class="p-5 movie-card neon-border">
         <div class="sm:grid grid-cols-2 lg:grid-cols-3">
-          <img
-            :src="showing.movie.poster"
-            alt="Movie Poster"
-            class="mx-auto mb-5 sm:mb-0 sm:mx-0 neon-border bg-black schedule-poster"
+          <img :src="showing.poster"
+               alt="Movie Poster"
+               class="mx-auto mb-5 sm:mb-0 sm:mx-0 neon-border bg-black schedule-poster"
           />
 
           <div class="self-center text-left">
-            <h5 class="text-center sm:text-left mb-3 text-xl">
-              {{ showing.movie.title }}
-            </h5>
-            <h5 class="text-center sm:text-left mb-3">
-              {{ formatDate(showing.showtime) }}
-            </h5>
-            <span class="">{{ showing.movie.plot }}</span>
+            <h5 class="text-center sm:text-left mb-3 text-xl">{{ showing.title }}</h5>
+            <h5 class="text-center sm:text-left mb-3">{{ formatDate(showing.showtime) }}</h5>
+            <span class="">{{ showing.plot }}</span>
           </div>
         </div>
       </li>
@@ -30,26 +19,22 @@
 
     <!-- PREVIOUS SHOWINGS -->
     <div id="previous-showings" class="mt-5 list-group">
-      <span
-        class="block mb-5 hover-pointer underline"
-        @click="getSchedule(true)"
-      >
+      <span class="block mb-5 hover-pointer underline" @click="getShowings(true)">
         Previous Showings
       </span>
       <span id="loader" class="hidden">Loading...</span>
       <ul class="flex flex-col gap-5">
-        <li v-for="showing in past_showings" class="p-5 movie-card neon-border">
+        <li v-for="showing in previous_showings" class="p-5 movie-card neon-border">
           <div class="sm:grid grid-cols-2 lg:grid-cols-3">
-            <img
-              :src="showing.movie.poster"
-              alt="Movie Poster"
-              class="mx-auto mb-5 sm:mb-0 sm:mx-0 neon-border bg-black schedule-poster"
+            <img :src="showing.poster"
+                 alt="Movie Poster"
+                 class="mx-auto mb-5 sm:mb-0 sm:mx-0 neon-border bg-black schedule-poster"
             />
 
             <div class="self-center text-left">
-              <h5 class="text-xl mb-3">{{ showing.movie.title }}</h5>
+              <h5 class="text-xl mb-3">{{ showing.title }}</h5>
               <h5 class="mb-3">{{ formatDate(showing.showtime) }}</h5>
-              <span class="">{{ showing.movie.plot }}</span>
+              <span class="">{{ showing.plot }}</span>
             </div>
           </div>
         </li>
@@ -58,88 +43,59 @@
   </div>
 </template>
 
-<script lang="ts" setup>
-import type { Showing } from "~/types/showing";
-import type { Schedule } from "~/types/schedule";
+<script>
+export default {
+  name: "index",
+  data: () => ({
+    showings: [],
+    previous_showings: [],
+    got_previous: false,
+    months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
+  }),
+  methods: {
+    formatDate: function (date_string) {
+      console.log(date_string)
+      let parsed_date = new Date(Date.parse(date_string));
+      let month = this.months[parsed_date.getMonth()];
 
-const schedule = defineModel<Schedule>("schedule");
-const past_showings = defineModel<Showing[]>("past_showings", {
-  default: [],
-});
-const got_previous = ref(false);
-const months = [
-  "January",
-  "February",
-  "March",
-  "April",
-  "May",
-  "June",
-  "July",
-  "August",
-  "September",
-  "October",
-  "November",
-  "December",
-];
-
-const formatDate = function (date_string: string) {
-  let parsed_date = new Date(Date.parse(date_string));
-  let month = months[parsed_date.getMonth()];
-
-  return `${month} ${parsed_date.getDate()}, ${parsed_date.getFullYear()}`;
-};
-
-const getSchedule = async function (previous = false) {
-  let config = useRuntimeConfig();
-  if (got_previous.value) {
-    return false;
-  }
-
-  document.getElementById("loader")?.classList.toggle("hidden");
-
-  let params = "";
-  if (previous) params = "?past_showings=true";
-
-  const { data, error } = await useFetch<Schedule>(
-    `${config.public.apiURL}/schedules/1${params}`,
-    {
-      method: "GET",
-      headers: {
-        Accept: "application/json",
-        "Content-type": "application/json",
-        Authorization: `Token ${useCookie("token").value}`,
-      },
+      return `${month} ${parsed_date.getDate()}, ${parsed_date.getFullYear()}`
     },
-  );
-
-  if (error.value) {
-    if (error.value.statusCode === 401) {
-      navigateTo("/");
-    }
-    if (error.value.statusCode === 404) {
-      alert("Schedule not found");
-      navigateTo("/");
-    }
-  } else {
-    if (!data.value) {
-      alert("Schedule not found");
-      navigateTo("/");
-    } else {
-      if (previous) {
-        past_showings.value = data.value.past_showings;
-      } else {
-        schedule.value = data.value;
+    getShowings: function (previous = false) {
+      let config = useRuntimeConfig()
+      if (this.got_previous) {
+        return false;
       }
-      document.getElementById("loader")?.classList.toggle("hidden");
+
+      document.getElementById("loader").classList.toggle("hidden")
+
+      let params = "";
+      if (previous) params = "?previous=true";
+
+      return fetch(`${config.public.apiURL}/schedules/1${params}`, {
+        method: "GET",
+        headers: {"Content-type": "application/json"}
+      })
+          .then(response => response.json())
+          .then(showings => {
+
+            if (previous) {
+              this.got_previous = true;
+              this.previous_showings = showings;
+            } else {
+              this.showings = showings
+            }
+            document.getElementById("loader").classList.toggle("hidden")
+          })
+          .catch(err => console.log(err));
+
     }
+  },
+  mounted() {
+    this.getShowings()
   }
-
-  return schedule;
-};
-
-onMounted(() => {
-  getSchedule();
-});
+}
 </script>
 
-<style scoped></style>
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/types/schedule.ts b/src/types/schedule.ts
deleted file mode 100644
index 917aaa2..0000000
--- a/src/types/schedule.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import type { Showing } from "~/types/showing";
-
-export type Schedule = {
-  id: number;
-  name: string;
-  public: boolean;
-  owner: number;
-  showings: Showing[];
-  past_showings: Showing[];
-};
diff --git a/src/types/showing.ts b/src/types/showing.ts
deleted file mode 100644
index daa29f6..0000000
--- a/src/types/showing.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import type { Movie } from "~/types/movie";
-
-export type Showing = {
-  owner: number;
-  public: boolean;
-  movie: Movie;
-  showtime: string;
-};