Drill 23: Real project — Pinia and a capstone app

import { defineStore } from 'pinia'
import { ref, computed } from 'vue'

export const useCourses = defineStore('courses', () => {
  const items = ref([])
  const query = ref('')
  const filtered = computed(() =>
    items.value.filter((course) => course.title.toLowerCase().includes(query.value.toLowerCase())),
  )

  async function load() {
    const response = await fetch('/api/courses')
    items.value = await response.json()
  }

  return { items, query, filtered, load }
})