From 5ce8c0f979717a86d69ef59a54c47f20397cfd0f Mon Sep 17 00:00:00 2001
From: Kushizaki <kushimegu288@gmail.com>
Date: Mon, 18 Aug 2025 13:52:23 +0900
Subject: [PATCH] =?UTF-8?q?=E8=B3=AA=E5=95=8F=E4=B8=80=E8=A6=A7=E3=81=AB?=
 =?UTF-8?q?=E9=96=A2=E3=81=99=E3=82=8Bvue=E3=83=95=E3=82=A1=E3=82=A4?=
 =?UTF-8?q?=E3=83=AB=E5=89=8A=E9=99=A4=E3=81=A8=E3=81=9D=E3=82=8C=E3=81=AB?=
 =?UTF-8?q?=E4=BC=B4=E3=81=86application.js=E3=81=AE=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/javascript/VueMounter.js            |  76 ----------------
 app/javascript/components/question.vue  | 113 -----------------------
 app/javascript/components/questions.vue | 115 ------------------------
 app/javascript/packs/application.js     |   7 --
 4 files changed, 311 deletions(-)
 delete mode 100644 app/javascript/VueMounter.js
 delete mode 100644 app/javascript/components/question.vue
 delete mode 100644 app/javascript/components/questions.vue

diff --git a/app/javascript/VueMounter.js b/app/javascript/VueMounter.js
deleted file mode 100644
index 900407b9ec5..00000000000
--- a/app/javascript/VueMounter.js
+++ /dev/null
@@ -1,76 +0,0 @@
-import Vue from 'vue'
-import store from './check-store.js'
-
-export default class VueMounter {
-  constructor() {
-    this.components = {}
-  }
-
-  addComponent(component) {
-    const name = component.name
-    this.components[name] = component
-  }
-
-  mount() {
-    document.addEventListener('DOMContentLoaded', () => {
-      const elements = document.querySelectorAll('[data-vue]')
-      if (elements.length > 0) {
-        elements.forEach((element) => {
-          const name = element.dataset.vue
-          const props = this._convertProps(element.dataset)
-          const component = this.components[name]
-
-          new Vue({
-            store,
-            render: (h) => h(component, { props: props })
-          }).$mount(`[data-vue="${name}"]`)
-        })
-      }
-    })
-  }
-
-  _convertProps(props) {
-    const objects = {}
-
-    Object.keys(props)
-      .filter((key) => key.match(/^vue.+/))
-      .forEach((key) => {
-        const rawKey = key.replace(/^vue/, '')
-        const keyWithType = this._camelCase(rawKey)
-        const matches = keyWithType.match(/:(.+)$/)
-
-        const type = matches ? matches[1] : undefined
-        const propKey = matches ? keyWithType.replace(/:.+$/, '') : keyWithType
-        const value = matches ? this._parse(props[key], type) : props[key]
-
-        objects[propKey] = value
-      })
-    return objects
-  }
-
-  _parse(value, type) {
-    if (type === 'number') {
-      return Number(value)
-    } else if (type === 'boolean') {
-      const v = value.toLowerCase()
-      if (v === 'false' || v === 'nil' || v === '') {
-        return false
-      } else {
-        return true
-      }
-    } else if (type === 'json') {
-      return JSON.parse(value)
-    } else if (type === 'string') {
-      return String(value)
-    } else {
-      return value
-    }
-  }
-
-  _camelCase(string) {
-    string = string.charAt(0).toLowerCase() + string.slice(1)
-    return string.replace(/[-_](.)/g, (_, group1) => {
-      return group1.toUpperCase()
-    })
-  }
-}
diff --git a/app/javascript/components/question.vue b/app/javascript/components/question.vue
deleted file mode 100644
index e8b76b6d75c..00000000000
--- a/app/javascript/components/question.vue
+++ /dev/null
@@ -1,113 +0,0 @@
-<template lang="pug">
-.card-list-item(:class='questionClass')
-  .card-list-item__inner
-    .card-list-item__user
-      a.card-list-item__user-link(:href='question.user.url')
-        span(:class='["a-user-role", roleClass, joiningStatusClass]')
-          img.card-list-item__user-icon.a-user-icon(
-            :title='question.user.icon_title',
-            :alt='question.user.icon_title',
-            :src='question.user.avatar_url')
-    .card-list-item__rows
-      .card-list-item__row
-        .card-list-item-title
-          .a-list-item-badge.is-wip(v-if='question.wip')
-            span
-              | WIP
-          h1.card-list-item-title__title(itemprop='name')
-            a.card-list-item-title__link.a-text-link(
-              :href='question.url',
-              itemprop='url') {{ question.title }}
-
-      .card-list-item__row(v-if='question.practice')
-        .card-list-item-meta
-          .card-list-item-meta__items
-            .card-list-item-meta__item
-              a.a-meta.is-practice(
-                :href='practiceUrl',
-                v-if='practiceUrl !== null')
-                | {{ question.practice.title }}
-
-      .card-list-item__row
-        .card-list-item-meta
-          .card-list-item-meta__items
-            .card-list-item-meta__item(v-if='question.wip')
-              .a-meta
-                | 質問作成中
-            .card-list-item-meta__item
-              a.a-user-name(:href='`/users/${question.user.id}`')
-                | {{ question.user.long_name }}
-
-      .card-list-item__row
-        .card-list-item-meta
-          .card-list-item-meta__items
-            .card-list-item-meta__item(v-if='!question.wip')
-              time.a-meta
-                span.a-meta__label
-                  | 公開
-                span.a-meta__value
-                  | {{ publishedAt }}
-            .card-list-item-meta__item(v-if='!question.wip')
-              time.a-meta
-                span.a-meta__label
-                  | 更新
-                span.a-meta__value
-                  | {{ updatedAt }}
-            .card-list-item-meta__item
-              .a-meta(:class='[urgentClass]')
-                | 回答・コメント（{{ question.answers.size }}）
-    .stamp.is-circle.is-solved(v-if='question.has_correct_answer')
-      .stamp__content.is-icon 解
-      .stamp__content.is-icon 決
-</template>
-<script>
-import dayjs from 'dayjs'
-import ja from 'dayjs/locale/ja'
-dayjs.locale(ja)
-
-export default {
-  props: {
-    question: { type: Object, required: true }
-  },
-  computed: {
-    updatedAt() {
-      return dayjs(this.question.updated_at).format('YYYY年MM月DD日(dd) HH:mm')
-    },
-    publishedAt() {
-      return dayjs(this.question.published_at).format(
-        'YYYY年MM月DD日(dd) HH:mm'
-      )
-    },
-    hasAnswers() {
-      return this.question.answers.size > 0
-    },
-    roleClass() {
-      return `is-${this.question.user.primary_role}`
-    },
-    joiningStatusClass() {
-      return this.question.user.joining_status === 'new-user'
-        ? 'is-new-user'
-        : ''
-    },
-    urgentClass() {
-      return {
-        'is-important': !this.hasAnswers
-      }
-    },
-    questionClass() {
-      if (this.question.has_correct_answer) {
-        return 'is-solved'
-      } else if (this.question.wip) {
-        return 'is-wip'
-      } else {
-        return ''
-      }
-    },
-    practiceUrl() {
-      return this.question.practice === undefined
-        ? null
-        : `/practices/${this.question.practice.id}`
-    }
-  }
-}
-</script>
diff --git a/app/javascript/components/questions.vue b/app/javascript/components/questions.vue
deleted file mode 100644
index cab652836fb..00000000000
--- a/app/javascript/components/questions.vue
+++ /dev/null
@@ -1,115 +0,0 @@
-<template lang="pug">
-div
-  nav.pagination(v-if='totalPages > 1')
-    pager(v-bind='pagerProps')
-  div(v-if='questions === null')
-    loadingListPlaceholder
-  .o-empty-message(v-else-if='questions.length === 0')
-    .o-empty-message__icon
-      i.fa-regular.fa-sad-tear
-    p.o-empty-message__text
-      | {{ emptyMessage }}
-  .card-list.a-card(v-else)
-    .card-list__items
-      question(
-        v-for='question in questions',
-        :key='question.id',
-        :question='question')
-  nav.pagination(v-if='totalPages > 1')
-    pager(v-bind='pagerProps')
-</template>
-
-<script>
-import LoadingListPlaceholder from 'loading-list-placeholder.vue'
-import Pager from 'pager.vue'
-import Question from 'components/question.vue'
-
-export default {
-  name: 'Questions',
-  components: {
-    loadingListPlaceholder: LoadingListPlaceholder,
-    pager: Pager,
-    question: Question
-  },
-  props: {
-    emptyMessage: { type: String, required: true },
-    selectedTag: { type: String, default: null, required: false },
-    userId: { type: Number, default: null, required: false },
-    practiceId: { type: Number, default: null, required: false }
-  },
-  data() {
-    return {
-      questions: null,
-      currentPage: this.pageParam(),
-      totalPages: null
-    }
-  },
-  computed: {
-    newParams() {
-      const params = new URL(location.href).searchParams
-      params.set('page', this.currentPage)
-      if (this.selectedTag) params.set('tag', this.selectedTag)
-      if (this.userId) params.set('user_id', this.userId)
-      if (this.practiceId) params.set('practice_id', this.practiceId)
-      return params
-    },
-    newURL() {
-      return `${location.pathname}?${this.newParams}`
-    },
-    questionsAPI() {
-      const params = this.newParams
-      return `/api/questions.json?${params}`
-    },
-    pagerProps() {
-      return {
-        initialPageNumber: this.currentPage,
-        pageCount: this.totalPages,
-        pageRange: 9,
-        clickHandle: this.clickCallback
-      }
-    }
-  },
-  created() {
-    window.onpopstate = () => {
-      this.currentPage = this.pageParam()
-      this.getQuestions()
-    }
-    this.getQuestions()
-  },
-  methods: {
-    pageParam() {
-      const url = new URL(location.href)
-      const page = url.searchParams.get('page')
-      return parseInt(page || 1)
-    },
-    clickCallback(pageNum) {
-      this.currentPage = pageNum
-      history.pushState(null, null, this.newURL)
-      this.questions = null
-      this.getQuestions()
-      window.scrollTo(0, 0)
-    },
-    getQuestions() {
-      fetch(this.questionsAPI, {
-        method: 'GET',
-        headers: { 'X-Requested-With': 'XMLHttpRequest' },
-        credentials: 'same-origin',
-        redirect: 'manual'
-      })
-        .then((response) => {
-          return response.json()
-        })
-        .then((json) => {
-          this.questions = []
-          json.questions.forEach((r) => {
-            this.questions.push(r)
-          })
-          this.totalPages = parseInt(json.totalPages)
-        })
-        .catch((error) => {
-          console.warn(error)
-        })
-    }
-  }
-}
-</script>
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index a42ec30f151..9ef515d81ec 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -85,15 +85,8 @@ import '../action_completed_button.js'
 import '../toast.js'
 import '../tag.js'
 
-import VueMounter from '../VueMounter.js'
-import Questions from '../components/questions.vue'
-
 import '../stylesheets/application'
 
-const mounter = new VueMounter()
-mounter.addComponent(Questions)
-mounter.mount()
-
 // Support component names relative to this directory:
 const componentRequireContext = require.context('components', true)
 const ReactRailsUJS = require('react_ujs')