Merge pull request #144 from MaySoMusician/feature/lessons-vuex-store

新Lessons形式に対応する

Author: NEKOYASAN

src/store/modules/classData.ts

@@ -6,49 +6,20 @@ import {
 } from 'vuex-class-component'
 import firebase from '@/plugins/firebase'
 import { AppStore } from '@/store/modules/app'
-import Timestamp = firebase.firestore.Timestamp
+import { classData } from '@/types/store/classData'
 
 const VuexModule = createModule({
   namespaced: 'classData',
   strict: false,
   target: 'nuxt'
 })
 
-type ClassId = string
-type ClassName = string
-type Lessons = Lesson[]
+export class ClassDataStore extends VuexModule implements classData.ClassData {
+  classId: classData.ClassId = ''
+  className: string = ''
+  lessons: classData.Lesson[] = []
 
-interface Lesson {
-  subject: string
-  content: string
-  startTime: Date
-  endTime: Date
-}
-
-interface RawLesson {
-  subject: string
-  content: string
-  startTime: Timestamp
-  endTime: Timestamp
-}
-
-interface RawClassData {
-  className: ClassName
-  lessons: Lessons
-}
-
-interface ClassData {
-  classId: ClassId
-  className: ClassName
-  lessons: Lessons
-}
-
-export class ClassDataStore extends VuexModule implements ClassData {
-  classId: ClassId = ''
-  className: ClassName = ''
-  lessons: Lessons = []
-
-  public get lessonsOnCurrentDate(): Lessons {
+  public get lessonsOnCurrentDate(): classData.Lesson[] {
     const appStore = createProxy(this.$store, AppStore)
 
     // Generate a new Date object with a specified date & time
@@ -73,57 +44,58 @@ export class ClassDataStore extends VuexModule implements ClassData {
   }
 
   @mutation
-  private setClassId(classId: ClassId) {
+  private setClassData({ classId, className, lessons }: classData.ClassData) {
     this.classId = classId
-  }
-
-  @mutation
-  private setDataFromRawClassData({ className, lessons }: RawClassData) {
     this.className = className
     this.lessons = lessons
   }
 
   @action
-  public async loadClassData(classId: ClassId) {
-    let className = ''
-    const lessons: Lesson[] = []
-    await firebase
+  public async loadClassData(classId: classData.ClassId) {
+    const lessons: classData.Lesson[] = []
+
+    const classDataDocument = firebase
       .firestore()
       .collection('classData')
       .doc(classId)
+
+    // classData ドキュメントのフィールドを取得
+    const classDataSnapshot = await classDataDocument.get()
+
+    if (!classDataSnapshot.exists) throw new Error('クラスIDが間違っています')
+    const classData = classDataSnapshot.data() as classData.ClassData
+    const className = classData.className
+
+    // classData ドキュメント下の lessons コレクションを取得
+    const classDataLessonsSnapshot = await classDataDocument
       .collection('Lessons')
       .orderBy('startTime')
       .get()
-      .then(querySnapshot => {
-        querySnapshot.forEach(function(doc) {
-          const data = doc.data() as RawLesson
-          const reformatData = {
-            subject: data.subject,
-            content: data.content,
-            startTime: data.startTime.toDate(),
-            endTime: new Date()
-          }
-          lessons.push(reformatData)
-        })
-      })
-      .catch(() => {
-        return Promise.reject(new Error('クラスIDが間違っています'))
-      })
-
-    await firebase
-      .firestore()
-      .collection('classData')
-      .doc(classId)
-      .get()
-      .then(snapshot => {
-        if (!snapshot.exists)
-          return Promise.reject(new Error('クラスIDが間違っています'))
 
-        const data = snapshot.data() as ClassData
-        className = data.className
+    try {
+      classDataLessonsSnapshot.forEach(doc => {
+        const retrieved = doc.data() as classData.database.Lesson
+        const converted: classData.Lesson = {
+          startTime: retrieved.startTime.toDate(),
+          endTime: retrieved.endTime.toDate(),
+          title: retrieved.title,
+          subject: retrieved.subject,
+          goal: retrieved.goal,
+          description: retrieved.description,
+          videos: retrieved.videos,
+          pages: retrieved.pages,
+          materials: retrieved.materials,
+          isHidden: retrieved.isHidden
+        }
+
+        lessons.push(converted)
       })
-    this.setClassId(classId)
-    this.setDataFromRawClassData({
+    } catch {
+      throw new Error('クラスIDが間違っています')
+    }
+
+    this.setClassData({
+      classId,
       className,
       lessons
     })

src/types/store/classData.d.ts

@@ -0,0 +1,62 @@
+import firebase from '@/plugins/firebase'
+import FireStoreTimestamp = firebase.firestore.Timestamp
+
+declare namespace classData {
+  // 汎用的な型の定義
+  export type UrlString = string
+  export type ColorCodeString = string
+
+  // ID型の定義
+  export type ClassId = string
+  export type LessonId = string // unused
+
+  export interface ClassData {
+    classId: ClassId
+    className: string
+    lessons: Lesson[]
+  }
+
+  export interface Lesson {
+    startTime: Date
+    endTime: Date
+    title: string
+    subject: Subject
+    goal: string
+    description: string
+    videos: Video[]
+    pages: string
+    materials: Material[]
+    isHidden: boolean
+  }
+
+  export interface Subject {
+    name: string
+    color: ColorCodeString
+  }
+
+  export interface Video {
+    title: string
+    url: UrlString
+    thumbnailUrl: UrlString
+  }
+
+  export interface Material {
+    title: string
+    url: UrlString
+  }
+
+  namespace database {
+    export interface Lesson {
+      startTime: FireStoreTimestamp
+      endTime: FireStoreTimestamp
+      title: string
+      subject: Subject
+      goal: string
+      description: string
+      videos: Video[]
+      pages: string
+      materials: Material[]
+      isHidden: boolean
+    }
+  }
+}