fix: improve last updated time feature (#1036)

v1/lib/core/DocsLayout.js

@@ -41,9 +41,11 @@ class DocsLayout extends React.Component {
     const id = metadata.localized_id;
     const defaultTitle = metadata.title;
     let DocComponent = Doc;
+
     if (this.props.Doc) {
       DocComponent = this.props.Doc;
     }
+
     let updateTime;
     if (this.props.config.enableUpdateTime) {
       const filepath = docs.getFilePath(metadata);
@@ -88,6 +90,15 @@ class DocsLayout extends React.Component {
               version={metadata.version}
               language={metadata.language}
             />
+            {this.props.config.enableUpdateTime &&
+              updateTime && (
+                <div className="docLastUpdateTimestamp">
+                  <em>
+                    <strong>Last updated: </strong>
+                    {updateTime}
+                  </em>
+                </div>
+              )}
             <div className="docs-prevnext">
               {metadata.previous_id && (
                 <a
@@ -123,13 +134,6 @@ class DocsLayout extends React.Component {
                 </a>
               )}
             </div>
-            {this.props.config.enableUpdateTime &&
-              updateTime && (
-                <p style={{fontSize: '12px', textAlign: 'right'}}>
-                  <strong>Last updated: </strong>
-                  {updateTime}
-                </p>
-              )}
           </Container>
           {hasOnPageNav && (
             <nav className="onPageNav docOnPageNav">

v1/lib/core/utils.js

@@ -38,22 +38,25 @@ function idx(target, keyPaths) {
   );
 }
 
-function isNormalInteger(str) {
-  return /^\d+$/.test(str);
-}
-
 function getGitLastUpdated(filepath) {
+  function isTimestamp(str) {
+    return /^\d+$/.test(str);
+  }
+
+  // Wrap in try/catch in case the shell commands fail (e.g. project doesn't use Git, etc).
+  try {
     // To differentiate between content change and file renaming / moving, use --summary
     // To follow the file history until before it is moved (when we create new version), use
-  // --follow
+    // --follow.
-  const silentState = shell.config.silent; // save old silent state
+    const silentState = shell.config.silent; // Save old silent state.
     shell.config.silent = true;
     const result = shell
       .exec(`git log --follow --summary --format=%ct ${filepath}`)
       .stdout.trim();
     shell.config.silent = silentState;
 
-  // Format the log results to be ['1234567', 'rename ...', '1234566', 'move ...', '1234565', '1234564']
+    // Format the log results to be
+    // ['1234567', 'rename ...', '1234566', 'move ...', '1234565', '1234564']
     const records = result
       .toString('utf-8')
       .replace(/\n\s*\n/g, '\n')
@@ -61,15 +64,20 @@ function getGitLastUpdated(filepath) {
       .filter(String);
 
     const timeSpan = records.find((item, index, arr) => {
-    const isTimestamp = isNormalInteger(item);
+      const currentItemIsTimestamp = isTimestamp(item);
       const isLastTwoItem = index + 2 >= arr.length;
-    const nextItemIsTimestamp = isNormalInteger(arr[index + 1]);
+      const nextItemIsTimestamp = isTimestamp(arr[index + 1]);
-    return isTimestamp && (isLastTwoItem || nextItemIsTimestamp);
+      return currentItemIsTimestamp && (isLastTwoItem || nextItemIsTimestamp);
     });
+
     if (timeSpan) {
       const date = new Date(parseInt(timeSpan, 10) * 1000);
       return date.toLocaleString();
     }
+  } catch (error) {
+    console.error(error);
+  }
+
   return null;
 }
 

v1/lib/static/css/main.css

@@ -1500,7 +1500,7 @@ input::placeholder {
 
 @media only screen and (min-width: 1024px) {
   .docMainWrapper {
-    max-width:100% !important ;
+    max-width: 100% !important ;
     margin: 0;
   }
 
@@ -1535,6 +1535,14 @@ input::placeholder {
     display: none;
   }
 }
+
+.docLastUpdateTimestamp {
+  font-size: 13px;
+  font-style: italic;
+  margin: 20px 0;
+  text-align: right;
+}
+
 /* End of Docs Main */
 
 /* Start of Docs Navigation */
@@ -2041,7 +2049,6 @@ input::placeholder {
   }
 }
 
-
 @media only screen and (min-width: 1024px) {
   .separateOnPageNav.sideNavVisible .navPusher .docMainContainer {
     flex-basis: 784px;