AllDialogからHelpDialogを切り出す

[jdkfx]

内容

• HelpDialogについて、useDialogPluginComponentを使って、AllDialogから切り出してみる

関連 Issue

ref #1551

スクリーンショット・動画など

その他

• 実験的にやってみた内容なので、クローズするかもしれません。
• エラーが出ているので修正しなければいけないのだが、よく分からず止まっている。
• メニューバーからヘルプを開いた際に、一番最初のソフトウェアの利用規約部分が真っ白になっていた。

[voicevox-preview-pages]

🚀 プレビュー用ページを作成しました 🚀

• 📝 エディタ
• 📖 Storybook

更新時点でのコミットハッシュ：7e5a632

[madosuki]

https://github.com/jdkfx/voicevox/blob/refactoring/%231551_use_dialog_plugin_component/src/components/Dialog/HelpDialog/HelpDialog.vue#L131C1-L132C74

const policy = ref<string>();
void store.actions.GET_POLICY_TEXT().then((obj) => (policy.value = obj));

ここのところref()だと初期値はundefinedになっていて更新は非同期関数で行われています。恐らく読み込みが間に合っていない状態でHelpMarkdownViewSection.vueに渡されているためエラーが出たのだと思います。
なので、ref()になっているところをref("読み込み中")など適当な文字列で初期化するようにした上で、HelpMarkdownViewSection.vue内でprops.markdownをwatchして更新処理を入れれば行けるかもしれません。

[jdkfx]

ここのところref()だと初期値はundefinedになっていて更新は非同期関数で行われています。恐らく読み込みが間に合っていない状態でHelpMarkdownViewSection.vueに渡されているためエラーが出たのだと思います。

ありがとうございます！解決しました！

[madosuki]

https://github.com/jdkfx/voicevox/blob/refactoring/%231551_use_dialog_plugin_component/src/components/Dialog/HelpDialog/HelpDialog.vue#L129

https://github.com/jdkfx/voicevox/blob/refactoring/%231551_use_dialog_plugin_component/src/components/Dialog/HelpDialog/HelpDialog.vue#L132
https://github.com/jdkfx/voicevox/blob/refactoring/%231551_use_dialog_plugin_component/src/components/Dialog/HelpDialog/HelpDialog.vue#L137
https://github.com/jdkfx/voicevox/blob/refactoring/%231551_use_dialog_plugin_component/src/components/Dialog/HelpDialog/HelpDialog.vue#L140C1-L140C31
ついでにこれらも同様に初期化するようにしておいた方が良いかと思います。

[jdkfx]

@madosuki

ついでにこれらも同様に初期化するようにしておいた方が良いかと思います。

console上では特に問題なさそうだったので修正を入れてませんでしたが、一応入れておきます！ありがとうございます！

[Hiroshiba]

おー！！良いですね！！！！！
どんどんダイアログ系のコード削っていけそうな雰囲気を感じました！！！

[Hiroshiba]

LGTM！！！

行数が減ってるのは意外でした！！！どんどん削っていきたい！！！！！

あ、もし続きも挑戦してくださる場合、できそうなら数個一気に削っていただいても大丈夫です！
もちろん1個ずつでも大丈夫です、もし作業する時に煩わしければという意図だったので･･･！