Add delay button for 3dmigoto

src/ui/components/common/DirInput.css

@@ -1,5 +1,5 @@
 .DirInput {
-  display: flex;
+  display:inline-flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;

src/ui/components/common/SmallButton.css

@@ -0,0 +1,32 @@
+.SmallButtonSection {
+  display: inline-block;
+  margin-left: 20px;
+  vertical-align: middle;
+}
+
+.SmallButtonButton {
+  height: 20px;
+  filter: drop-shadow(0px 0px 5px rgb(0 0 0 / 20%));
+}
+
+.SmallButtonButton:hover {
+  cursor: pointer;
+}
+
+.SmallButtonButton img {
+  height: 100%;
+}
+
+.SmallButtonContents {
+  text-align: center;
+  position: relative;
+}
+
+.SmallButtonContents .MiniDialog {
+  position: absolute;
+
+  bottom: 40px;
+  right: -450%;
+  width: 200px;
+  height: 120px;
+}

src/ui/components/common/SmallButton.tsx

@@ -0,0 +1,39 @@
+import React from 'react'
+
+import './SmallButton.css'
+import Wrench from '../../../resources/icons/wrench.svg'
+import { translate } from '../../../utils/language'
+
+interface IProps {
+  children?: React.ReactNode[] | React.ReactNode
+  onClick: () => unknown
+  id?: string
+  contents?: string
+}
+
+export default class SmallButton extends React.Component<IProps> {
+  constructor(props: IProps) {
+    super(props)
+
+    this.handleClick = this.handleClick.bind(this)
+  }
+
+  async showAlert() {
+    if (this.props.contents) alert(await translate(this.props.contents))
+  }
+
+  handleClick() {
+    this.props.onClick()
+    this.showAlert()
+  }
+
+  render() {
+    return (
+      <div className="SmallButtonSection">
+        <div className="SmallButtonButton" onClick={this.handleClick}>
+          <img src={Wrench} />
+        </div>
+      </div>
+    )
+  }
+}

src/ui/components/menu/Options.tsx

@@ -16,6 +16,7 @@ import DownloadHandler from '../../../utils/download'
 import * as meta from '../../../utils/rsa'
 import HelpButton from '../common/HelpButton'
 import TextInput from '../common/TextInput'
+import SmallButton from '../common/SmallButton'
 
 interface IProps {
   closeFn: () => void
@@ -85,6 +86,7 @@ export default class Options extends React.Component<IProps, IState> {
     this.setCustomBackground = this.setCustomBackground.bind(this)
     this.toggleEncryption = this.toggleEncryption.bind(this)
     this.removeRSA = this.removeRSA.bind(this)
+    this.addMigotoDelay = this.addMigotoDelay.bind(this)
   }
 
   async componentDidMount() {
@@ -278,6 +280,12 @@ export default class Options extends React.Component<IProps, IState> {
     await meta.unpatchGame()
   }
 
+  async addMigotoDelay() {
+    invoke('set_migoto_delay', {
+      migotoPath: this.state.migoto_path,
+    })
+  }
+
   async installCert() {
     await invoke('generate_ca_files', {
       path: (await dataDir()) + 'cultivation',
@@ -422,6 +430,8 @@ export default class Options extends React.Component<IProps, IState> {
                 <Tr text="swag.migoto" />
               </div>
               <div className="OptionValue" id="menuOptionsDirMigoto">
+                <SmallButton onClick={this.addMigotoDelay} id="migotoDelay" contents='help.add_delay'>
+                </SmallButton>
                 <DirInput onChange={this.setMigoto} value={this.state?.migoto_path} extensions={['exe']} />
               </div>
             </div>