open jar and game properly

src/ui/components/ServerLaunchSection.css

@@ -14,4 +14,26 @@
 #serverControls .Checkbox label {
   color: #fff;
   font-weight: bold;
+}
+
+.ServerLaunchButtons {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+
+  height: 100%;
+}
+
+#officialPlay {
+  width: 60%
+}
+
+#serverLaunch {
+  width: 5%;
+}
+
+.ServerIcon {
+  height: 20px;
+  filter: invert(28%) sepia(28%) saturate(1141%) hue-rotate(352deg) brightness(96%) contrast(88%);
 }

src/ui/components/ServerLaunchSection.tsx

@@ -5,6 +5,7 @@ import { getConfig, saveConfig } from '../../utils/configuration'
 import { translate } from '../../utils/language'
 import { invoke } from '@tauri-apps/api/tauri'
 
+import Server from '../../resources/icons/server.svg'
 import './ServerLaunchSection.css'
 
 interface IProps {
@@ -61,13 +62,28 @@ export default class ServerLaunchSection extends React.Component<IProps, IState>
     await invoke('run_program', { path: config.game_path })
   }
 
+  async launchServer() {
+    const config = await getConfig()
+
+    if (!config.grasscutter_path) return
+
+    // Launch the jar
+    await invoke('run_jar', { path: config.grasscutter_path })
+  }
+
   render() {
     return (
       <div id="playButton">
         <div id="serverControls">
           <Checkbox id="enableGC" label={this.state.checkboxLabel} onChange={this.toggleGrasscutter} checked={this.state.grasscutterEnabled}/>
         </div>
-        <BigButton text={this.state.buttonLabel} onClick={this.playGame} id="officialPlay" />
+        <div className="ServerLaunchButtons">
+          <BigButton onClick={this.playGame} id="officialPlay">{this.state.buttonLabel}</BigButton>
+          <BigButton onClick={this.launchServer} id="serverLaunch">
+            <img className="ServerIcon" src={Server} />
+          </BigButton>
+        </div>
+
       </div>
     )
   }

src/ui/components/common/BigButton.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import './BigButton.css'
 
 interface IProps {
-  text: string;
+  children: React.ReactNode;
   onClick: () => any;
   id: string;
 }
@@ -21,7 +21,7 @@ export default class BigButton extends React.Component<IProps, never> {
   render() {
     return (
       <div className="BigButton" onClick={this.handleClick} id={this.props.id}>
-        <div className="BigButtonText">{this.props.text}</div>
+        <div className="BigButtonText">{this.props.children}</div>
       </div>
     )
   }