Merge pull request #60 from fontlet/update-new-versions

feature: Update new font versions

src/actions/_utils.js

@@ -12,10 +12,16 @@ export const getLocalCacheInstance = () =>
 export const fetchResourceJSON = () => get(FL_RESOURCE_URL);
 
 export const getPlatformInfo = () => {
-  const osTypeMap = { Windows_NT: "win", Darwin: "darwin", Linux: "linux" };
-  const osType = os.type();
-  const type = includes(Object.keys(osTypeMap), osType) ? osType : "linux";
-  return { type: osTypeMap[type] };
+  const platformTypeMap = {
+    Windows_NT: "win",
+    Darwin: "darwin",
+    Linux: "linux"
+  };
+  const platformType = os.type();
+  const type = includes(Object.keys(platformTypeMap), platformType)
+    ? platformType
+    : "linux";
+  return { type: platformTypeMap[type] };
 };
 
 // Url remove last part of.

src/actions/fonts/index.js

@@ -1,23 +1,34 @@
 import { getPlatformInfo, getLocalCacheInstance } from "../_utils";
 import install from "./installer";
 import uninstall from "./uninstaller";
+import update from "./updater";
 
-const os = getPlatformInfo();
+const platform = getPlatformInfo();
 
 export const installFont = (font, cb) => {
-  const osType = os.type;
-  install[osType](font, cb);
+  const platformType = platform.type;
+  install[platformType](font, cb);
 };
 
 export const uninstallFont = (font, cb) => {
-  const osType = os.type;
-  uninstall[osType](font, cb);
+  const platformType = platform.type;
+  uninstall[platformType](font, cb);
+};
+
+export const updateFont = (font, cb) => {
+  const platformType = platform.type;
+  update[platformType](font, cb);
 };
 
 export const addInstalledFontToLocalCache = async (font, cb = () => {}) => {
   try {
     const localCache = getLocalCacheInstance();
-    await localCache.insert({ type: "INSTALLED", id: font.id });
+    await localCache.insert({
+      type: "INSTALLED",
+      id: font.id,
+      familyName: font.familyName,
+      version: font.version
+    });
     cb(null, font);
   } catch (error) {
     cb({ message: "Failed to update localCache!", params: error }, null);
@@ -36,3 +47,21 @@ export const removeUninstalledFontFromLocalCache = async (
     cb({ message: "Failed to update localCache!", params: error }, null);
   }
 };
+
+export const updateInstalledFontToLocalCache = async (font, cb = () => {}) => {
+  try {
+    const localCache = getLocalCacheInstance();
+    await localCache.update(
+      { type: "INSTALLED", id: font.id },
+      {
+        type: "INSTALLED",
+        id: font.id,
+        familyName: font.familyName,
+        version: font.version
+      }
+    );
+    cb(null, font);
+  } catch (error) {
+    cb({ message: "Failed to update localCache!", params: error }, null);
+  }
+};

src/actions/fonts/updater/darwin.js

@@ -0,0 +1,24 @@
+import uninstall from "../uninstaller/darwin";
+import install from "../installer/darwin";
+
+const darwinUpdater = async (font, cb) => {
+  // Uninstall font first
+  uninstall(font, uninsErr => {
+    if (uninsErr) {
+      cb({ message: "Updating failed!", params: uninsErr }, null);
+      return;
+    }
+
+    // Update new version
+    install(font, insErr => {
+      if (insErr) {
+        cb({ message: "Updating failed!", params: insErr }, null);
+        return;
+      }
+
+      cb(null, font);
+    });
+  });
+};
+
+export default darwinUpdater;

src/actions/fonts/updater/index.js

@@ -0,0 +1,11 @@
+import darwinUpdater from "./darwin";
+import winUpdater from "./win";
+import linuxUpdater from "./linux";
+
+const update = {
+  win: winUpdater,
+  darwin: darwinUpdater,
+  linux: linuxUpdater
+};
+
+export default update;

src/actions/fonts/updater/linux.js

@@ -0,0 +1,24 @@
+import uninstall from "../uninstaller/linux";
+import install from "../installer/linux";
+
+const linuxUpdater = async (font, cb) => {
+  // Uninstall font first
+  uninstall(font, uninsErr => {
+    if (uninsErr) {
+      cb({ message: "Updating failed!", params: uninsErr }, null);
+      return;
+    }
+
+    // Update new version
+    install(font, insErr => {
+      if (insErr) {
+        cb({ message: "Updating failed!", params: insErr }, null);
+        return;
+      }
+
+      cb(null, font);
+    });
+  });
+};
+
+export default linuxUpdater;

src/actions/fonts/updater/win.js

@@ -0,0 +1,24 @@
+import uninstall from "../uninstaller/win";
+import install from "../installer/win";
+
+const winUpdater = async (font, cb) => {
+  // Uninstall font first
+  uninstall(font, uninsErr => {
+    if (uninsErr) {
+      cb({ message: "Updating failed!", params: uninsErr }, null);
+      return;
+    }
+
+    // Update new version
+    install(font, insErr => {
+      if (insErr) {
+        cb({ message: "Updating failed!", params: insErr }, null);
+        return;
+      }
+
+      cb(null, font);
+    });
+  });
+};
+
+export default winUpdater;

src/actions/init.js

@@ -1,4 +1,5 @@
 import each from "lodash/each";
+import find from "lodash/find";
 import { getLocalCacheInstance, fetchResourceJSON } from "./_utils";
 
 const init = async (cb = () => {}) => {
@@ -24,8 +25,19 @@ const init = async (cb = () => {}) => {
       flags[id] = null;
     });
 
+    // set isUpdateAvailable flag
+    const fonts = resourceJson.fonts.map(font => {
+      const fontInstalled = find(installedFonts || [], f => f.id === font.id);
+      if (!fontInstalled) return { ...font, isUpdateAvailable: false };
+      return {
+        ...font,
+        isUpdateAvailable: font.version !== fontInstalled.version
+      };
+    });
+
     cb(null, {
       ...resourceJson,
+      fonts,
       user,
       installedFonts: installedFonts || [],
       flags,

src/components/App.js

@@ -16,6 +16,7 @@ const App = ({
   registerUser,
   installFont,
   uninstallFont,
+  updateFont,
   registering,
   loading
 }) => {
@@ -31,6 +32,7 @@ const App = ({
           flags={flags}
           installedFonts={installedFonts}
           installFont={installFont}
+          updateFont={updateFont}
           uninstallFont={uninstallFont}
         />
       </Fragment>

src/components/Gallery.js

@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import styled from "styled-components";
-import { Switch, Card, Elevation } from "@blueprintjs/core";
+import { Button, Switch, Card, Elevation } from "@blueprintjs/core";
 import find from "lodash/find";
 
 import Loading from "./common/Loading";
@@ -95,6 +95,14 @@ const ToggleButtonWrapper = styled.div`
   align-items: center;
 `;
 
+const UpdateButtonWrapper = styled.div`
+font-size: 17px;
+color: #867f7f;
+margin-left: 20px;
+margin-bottom: 0px;
+
+`;
+
 class Gallery extends Component {
   handleSwitchAction = (font, installed) => {
     const { installFont, uninstallFont } = this.props;
@@ -105,18 +113,25 @@ class Gallery extends Component {
     installFont(font);
   };
 
+  handleUpdateAction = font => {
+    const { updateFont } = this.props;
+    updateFont(font);
+  };
+
   renderFontItem = font => {
     const {
       familyName,
       id,
       foundry,
       coverImageUrl,
       version,
-      fontStyles
+      fontStyles,
+      isUpdateAvailable
     } = font;
     const { installedFonts, flags } = this.props;
     const installedFont = find(installedFonts, f => f.id === id);
     const installed = !!installedFont;
+    const showUpdateBtn = installed && isUpdateAvailable;
 
     return (
       <CardContent className="card-style" key={id}>
@@ -129,8 +144,19 @@ class Gallery extends Component {
               <VersionDetails>
                 <Name>{familyName}</Name>
                 <Foundry>from {foundry}</Foundry>
-                <Version>v {version}</Version>
                 <Variant>{fontStyles.length} fonts in family</Variant>
+                <Version>v {version}</Version>
+                {showUpdateBtn && (
+                  <UpdateButtonWrapper>
+                  <Button 
+                    className="bp3-button" 
+                    icon="refresh"
+                    text="Update"
+                    active="true"
+                    onClick={() => this.handleUpdateAction(font)}
+                    />
+                </UpdateButtonWrapper>
+                )}
               </VersionDetails>
             </VersionContent>
 
@@ -141,6 +167,7 @@ class Gallery extends Component {
                 large
                 onChange={() => this.handleSwitchAction(font, installed)}
               />
+
             </ToggleButtonWrapper>
           </SettingsContent>
         </Content>

src/containers/App.js

@@ -8,8 +8,10 @@ import { registerUser } from "../actions/user";
 import {
   installFont,
   uninstallFont,
+  updateFont,
   addInstalledFontToLocalCache,
-  removeUninstalledFontFromLocalCache
+  removeUninstalledFontFromLocalCache,
+  updateInstalledFontToLocalCache
 } from "../actions/fonts/index";
 
 import Alert from "../libs/alert";
@@ -103,12 +105,52 @@ class AppContainer extends React.Component {
     });
   };
 
+  update = font => {
+    this.setFlag(font, true);
+    // Uninstall the font first.
+    updateFont(font, error => {
+      if (error) {
+        // this.setState({ error });
+        this.setFlag(font, false);
+        Alert.error(`${font.familyName} updating failed!.`);
+        return;
+      }
+
+      // Update localCache
+      updateInstalledFontToLocalCache(font, lCError => {
+        if (lCError) {
+          this.setState({
+            error: lCError
+          });
+          this.setFlag(font, false);
+          Alert.error(`${font.familyName} updating failed!.`);
+          return;
+        }
+
+        // Remove older version
+        const installedFonts = filter(
+          // eslint-disable-next-line
+          this.state.installedFonts,
+          f => f.id !== font.id
+        );
+        // Update new version
+        installedFonts.push(font);
+        this.setState({
+          installedFonts
+        });
+        this.setFlag(font, false);
+        Alert.success(`${font.familyName} updated successfully!.`);
+      });
+    });
+  };
+
   uninstall = font => {
     this.setFlag(font, true);
     uninstallFont(font, error => {
       if (error) {
         // this.setState({ error });
         this.setFlag(font, false);
+        Alert.error(`${font.familyName} uninstalling failed!.`);
         return;
       }
 
@@ -141,6 +183,7 @@ class AppContainer extends React.Component {
         registerUser={this.registerUser}
         installFont={this.install}
         uninstallFont={this.uninstall}
+        updateFont={this.update}
       />
     );
   }