💅🏼 Check for updates feature (#10)

dev-drprasad · Feb 3, 2021 · 975b633 · 975b633
1 parent 12c9f4f
commit 975b633
Show file tree

Hide file tree

Showing 13 changed files with 218 additions and 106 deletions.
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -44,6 +44,10 @@ jobs:
       if: ${{ matrix.os == 'ubuntu-20.04' }}
     - name: Checkout code
       uses: actions/checkout@v2
+    - name: Vars
+      id: vars
+      run: echo ::set-output name=tag::${GITHUB_REF/refs\/tags\//}
+      shell: bash
     - name: Install Project Dep
       run: |
         go mod download
@@ -66,7 +70,7 @@ jobs:
     - name: Setup Account
       run: mkdir -p ~/.wails && echo '{"email":"[email protected]","name":"REDDY PRASAD"}' > ~/.wails/wails.json
     - name: Build GUI
-      run: wails build -p
+      run: wails build -p -ldflags "-X main.CurrentVersionStr=${{ steps.vars.outputs.tag }}"
     - name: Make DMG
       run: npx create-dmg ./build/hsk00.app ./build
       continue-on-error: true

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -27,6 +27,10 @@ jobs:
       if: ${{ matrix.os == 'ubuntu-20.04' }}
     - name: Checkout code
       uses: actions/checkout@v2
+    - name: Vars
+      id: vars
+      run: echo ::set-output name=tag::${GITHUB_REF/refs\/tags\//}
+      shell: bash
     - name: Install Project Dep
       run: |
         go mod download
@@ -49,7 +53,7 @@ jobs:
     - name: Setup Account
       run: mkdir -p ~/.wails && echo '{"email":"[email protected]","name":"REDDY PRASAD"}' > ~/.wails/wails.json
     - name: Build GUI
-      run: wails build -p
+      run: wails build -p -ldflags "-X main.CurrentVersionStr=${{ steps.vars.outputs.tag }}"
     - name: Make DMG
       run: npx create-dmg ./build/hsk00.app ./build
       continue-on-error: true

diff --git a/NOTES.md b/NOTES.md
@@ -32,3 +32,7 @@
 - online-convert.com
 - https://hackmii.com/2010/04/sunplus-the-biggest-chip-company-youve-never-heard-of/
 - https://www.dl-sounds.com/royalty-free
+
+### DUMPS
+
+- https://yadi.sk/d/rTNU4YlXHUIRyg
diff --git a/README.md b/README.md
@@ -14,9 +14,9 @@ Add/Replace games to your "Data Frog Y2 (568 in 1)" console.
 
 There is no install step. You just download and run.
 
-- [Mac OS X GUI](https://github.com/dev-drprasad/hsk00/releases/download/latest/hsk00-osx.dmg)
-- [Windows GUI](https://github.com/dev-drprasad/hsk00/releases/download/latest/hsk00-windows.exe) (require windows7 SP1 or later)
-- [Linux GUI](https://github.com/dev-drprasad/hsk00/releases/download/latest/hsk00-linux-gui.tar.gz) (Should work with all popular distros)
+- [Mac OS X GUI](https://github.com/dev-drprasad/hsk00/releases/latest/download/hsk00-osx.dmg)
+- [Windows GUI](https://github.com/dev-drprasad/hsk00/releases/latest/download/hsk00-windows.exe) (require windows7 SP1 or later)
+- [Linux GUI](https://github.com/dev-drprasad/hsk00/releases/latest/download/hsk00-linux-gui.tar.gz) (Should work with all popular distros)
 
 ### Can't launch ?
 

diff --git a/frontend/src/App.js b/frontend/src/App.js
@@ -1,10 +1,11 @@
 import React, { useCallback, useEffect, useState } from "react";
 import "./App.scss";
 import Alert from "./Alert";
-import GitHubIcon from "./GitHubIcon";
 import { ReactComponent as Spinner } from "./spinner.svg";
 import { useTranslation } from "react-i18next";
+import Footer from "./Footer";
 import GameList from "./GameList";
+
 const initialState = {
   rootDir: "",
   modified: false,
@@ -81,10 +82,6 @@ function App() {
       .catch(setError);
   }, [rootDir, categoryID]);
 
-  const handleGHClick = () => {
-    window.backend.Runtime.OpenURL("https://github.com/dev-drprasad/hsk00/");
-  };
-
   const handleGameToggleDelete = (id) => () => {
     const g = { ...games[id], deleted: !games[id].deleted };
     if (g.hsk) {
@@ -156,82 +153,75 @@ function App() {
   ].map((c, i) => ({ label: `${t("Category")} ${i + 1} (${c})`, value: i }));
 
   return (
-    <React.Fragment>
-      <div className="App">
-        <div className="FormItem">
-          <div className="label" htmlFor="rootDir">
-            {t("Choose root directory")} :
-          </div>
-          <div className="group RootDirGroup">
-            <input
-              className="FormControl Input"
-              name="rootDir"
-              placeholder={`${t("Choose root directory")} (SD Card)`}
-              onChange={handleRootDirChange}
-              value={rootDir}
-            />
-            <button className="FormControl btn" onClick={handleSelectRootClick}>
-              {t("Choose")}
-            </button>
-          </div>
-          <span className="FormError">{errors.rootDir}</span>
+    <div className="App">
+      <div className="FormItem">
+        <div className="label" htmlFor="rootDir">
+          {t("Choose root directory")} :
+        </div>
+        <div className="group RootDirGroup">
+          <input
+            className="FormControl Input"
+            name="rootDir"
+            placeholder={`${t("Choose root directory")} (SD Card)`}
+            onChange={handleRootDirChange}
+            value={rootDir}
+          />
+          <button className="FormControl btn" onClick={handleSelectRootClick}>
+            {t("Choose")}
+          </button>
         </div>
-        <div className="FormItem">
-          <div className="label" htmlFor="rootDir">
-            {t("Select game category")} :
-          </div>
-          <div>
-            <select
-              className="FormControl Select CategorySelect"
-              name="categoryID"
-              onChange={handleCategoryChange}
-              value={categoryID}
-            >
-              <option value={-1}>----------</option>
-              {categoryOptions.map(({ label, value }) => (
-                <option key={label} value={value}>
-                  {label}
-                </option>
-              ))}
-            </select>
-          </div>
-          <span className="FormError">{errors.rootDir}</span>
+        <span className="FormError">{errors.rootDir}</span>
+      </div>
+      <div className="FormItem">
+        <div className="label" htmlFor="rootDir">
+          {t("Select game category")} :
         </div>
-        <div className="FormItem games-list">
-          <label className="label" htmlFor="rootDir">
-            {t("Games")} {totalGamesLabel}:
-          </label>
-          <div className="list-actions">
-            <button className="FormControl btn btn-sm" onClick={refreshGameList} disabled={!rootDir || categoryID === -1}>
-              {t("Reset")}
-            </button>
-            <button
-              className="FormControl btn btn-sm btn-primary"
-              onClick={handleSelectGamesClick}
-              disabled={!rootDir || categoryID === -1}
-            >
-              + {t("Add")}
-            </button>
-          </div>
-          <GameList games={games} onToggleDelete={handleGameToggleDelete} />
-          <span className="FormError">{errors.rootDir}</span>
+        <div>
+          <select
+            className="FormControl Select CategorySelect"
+            name="categoryID"
+            onChange={handleCategoryChange}
+            value={categoryID}
+          >
+            <option value={-1}>----------</option>
+            {categoryOptions.map(({ label, value }) => (
+              <option key={label} value={value}>
+                {label}
+              </option>
+            ))}
+          </select>
         </div>
-        <Alert type={message?.type} message={message?.content} />
-        <div className="FormItem SubmitButtonWrapper">
-          <button className="FormControl SubmitButton btn btn-primary" disabled={!modified || saving} onClick={handleSubmit}>
-            {t("Save Changes")}
-            {saving && <Spinner className="spinner" />}
+        <span className="FormError">{errors.rootDir}</span>
+      </div>
+      <div className="FormItem games-list">
+        <label className="label" htmlFor="rootDir">
+          {t("Games")} {totalGamesLabel}:
+        </label>
+        <div className="list-actions">
+          <button className="FormControl btn btn-sm" onClick={refreshGameList} disabled={!rootDir || categoryID === -1}>
+            {t("Reset")}
+          </button>
+          <button
+            className="FormControl btn btn-sm btn-primary"
+            onClick={handleSelectGamesClick}
+            disabled={!rootDir || categoryID === -1}
+          >
+            + {t("Add")}
           </button>
         </div>
+        <GameList games={games} onToggleDelete={handleGameToggleDelete} />
+        <span className="FormError">{errors.rootDir}</span>
       </div>
-      <span onClick={handleGHClick} className="github-link">
-        <GitHubIcon />
-      </span>
-      <select className="language-select FormControl form-control-sm" onChange={(e) => i18n.changeLanguage(e.target.value)}>
-        <option value="en">English</option>
-        <option value="ru">русский</option>
-      </select>
-    </React.Fragment>
+      <Alert type={message?.type} message={message?.content} />
+      <div className="FormItem SubmitButtonWrapper">
+        <button className="FormControl SubmitButton btn btn-primary" disabled={!modified || saving} onClick={handleSubmit}>
+          {t("Save Changes")}
+          {saving && <Spinner className="spinner" />}
+        </button>
+      </div>
+
+      <Footer onLangChange={(l) => i18n.changeLanguage(l)} />
+    </div>
   );
 }
 

diff --git a/frontend/src/App.scss b/frontend/src/App.scss
@@ -1,16 +1,8 @@
 @import "variables.scss";
 
-.github-link {
-  position: absolute;
-  bottom: 0.5rem;
-  right: 1rem;
-  font-size: 1.2rem;
-  color: #cccccc;
-}
-
 .App {
   padding: 0.5rem 1rem;
-  height: 100%;
+  height: 100vh;
   position: relative;
 }
 .group > :first-child {
@@ -172,12 +164,3 @@
   border-radius: 0.5em;
   outline: none;
 }
-
-.language-select {
-  position: absolute;
-  bottom: 0.5rem;
-  left: 1rem;
-
-  width: 20%;
-  color: #cccccc;
-}
diff --git a/frontend/src/Footer.jsx b/frontend/src/Footer.jsx
@@ -0,0 +1,45 @@
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import GitHubIcon from "./GitHubIcon";
+import "./Footer.scss";
+
+function Footer({ onLangChange }) {
+  const { t } = useTranslation("translation");
+  const [version, setVersion] = useState({ current: undefined, latest: undefined, hasUpdate: false });
+
+  const handleUpdateClick = (e) => {
+    e.preventDefault();
+    window.backend.Runtime.OpenURL("https://github.com/dev-drprasad/hsk00/releases/latest");
+  };
+
+  const handleGHClick = () => {
+    window.backend.Runtime.OpenURL("https://github.com/dev-drprasad/hsk00/");
+  };
+
+  useEffect(() => {
+    window.backend.Runtime.GetVersion().then(setVersion).catch(console.error);
+  }, []);
+
+  return (
+    <>
+      <select className="language-select FormControl form-control-sm" onChange={(e) => onLangChange(e.target.value)}>
+        <option value="en">English</option>
+        <option value="ru">русский</option>
+      </select>
+
+      <span className="version">
+        {version.current}{" "}
+        {version.hasUpdate && (
+          <a onClick={handleUpdateClick} href="https://github.com/dev-drprasad/hsk00/releases/latest">
+            ({"🎉"} {t("update available")} : {version.latest})
+          </a>
+        )}
+      </span>
+      <span onClick={handleGHClick} className="github-link">
+        <GitHubIcon />
+      </span>
+    </>
+  );
+}
+
+export default Footer;
diff --git a/frontend/src/Footer.scss b/frontend/src/Footer.scss
@@ -0,0 +1,31 @@
+@import "variables.scss";
+
+.language-select {
+  bottom: 0.5rem;
+  left: 1rem;
+  width: 20%;
+  color: #cccccc;
+  position: absolute;
+}
+
+.version {
+  position: absolute;
+  bottom: 0.5rem;
+  width: 100%;
+  text-align: center;
+  line-height: 1.3rem;
+  font-size: 0.85em;
+  z-index: -1;
+
+  > a {
+    color: inherit;
+  }
+}
+
+.github-link {
+  position: absolute;
+  bottom: 0.5rem;
+  right: 1rem;
+  font-size: 1.2rem;
+  color: #cccccc;
+}
diff --git a/frontend/src/GameList.scss b/frontend/src/GameList.scss
@@ -7,14 +7,12 @@
   > ul {
     margin: 0;
     overflow: auto;
-    height: 14.4rem;
+    height: 14rem; // 7 items * height of li
     > li {
-      list-style: none;
       padding: 0 1rem;
-      height: 2.4rem;
-      line-height: 2.4rem;
+      height: 2rem;
+      line-height: 2rem;
       position: relative;
-      z-index: 10000;
 
       &.unsaved {
         font-weight: 700;

diff --git a/frontend/src/translation/en.json b/frontend/src/translation/en.json
@@ -16,5 +16,6 @@
   "Fight Game": "Fight Game",
   "Racing Game": "Racing Game",
   "Puzzle Game": "Puzzle Game",
-  "unsaved": "unsaved"
+  "unsaved": "unsaved",
+  "update available": "update available"
 }
diff --git a/frontend/src/translation/ru.json b/frontend/src/translation/ru.json
@@ -17,5 +17,6 @@
   "Racing Game": "Racing Game",
   "Puzzle Game": "Puzzle Game",
   "unsaved": "неспасенный",
-  "Category": "Категория"
+  "Category": "Категория",
+  "update available": "обновления доступны"
 }
diff --git a/go.mod b/go.mod
@@ -3,6 +3,7 @@ module github.com/dev-drprasad/hsk00
 go 1.15
 
 require (
+	github.com/Masterminds/semver v1.4.2
 	github.com/dev-drprasad/qt v1.0.4
 	github.com/fogleman/gg v1.3.0
 	github.com/golang/freetype v0.0.0-20170609003504-e2365dfdc4a0