querysub 0.515.0 → 0.516.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "querysub",
-  "version": "0.515.0",
+  "version": "0.516.0",
   "main": "index.js",
   "license": "MIT",
   "note1": "note on node-forge fork, see https://github.com/digitalbazaar/forge/issues/744 for details",

package/src/deployManager/components/ServicesListPage.tsx

@@ -1,16 +1,16 @@
 import { SocketFunction } from "socket-function/SocketFunction";
 import { qreact } from "../../4-dom/qreact";
-import { DEFAULT_OVERLAP_TIME, MachineServiceController, ServiceConfig } from "../machineSchema";
+import { DEFAULT_OVERLAP_TIME, MachineServiceController, ServiceConfig, getLiveServiceParameters } from "../machineSchema";
 import { css } from "typesafecss";
 import { t } from "../../2-proxy/schema2";
 import { Querysub } from "../../4-querysub/Querysub";
 import { currentViewParam, selectedServiceIdParam } from "../urlParams";
-import { formatNiceDateTime, formatTime, formatVeryNiceDateTime } from "socket-function/src/formatting/format";
-import { sort, timeInMinute } from "socket-function/src/misc";
+import { formatDateTimeDetailed, formatNiceDateTime, formatTime, formatVeryNiceDateTime } from "socket-function/src/formatting/format";
+import { sort, timeInMinute, timeInSecond } from "socket-function/src/misc";
 import { cache } from "socket-function/src/caching";
 import { Anchor } from "../../library-components/ATag";
 import { isPublic } from "../../config";
-import { UpdateButtons, UpdateServiceButtons } from "./deployButtons";
+import { PendingDeployInfo, UpdateButtons, UpdateServiceButtons } from "./deployButtons";
 import { isDefined } from "../../misc";
 import { formatDateJSX } from "../../misc/formatJSX";
 import { Tools } from "./Tools";
@@ -26,6 +26,8 @@ export class ServicesListPage extends qreact.Component {
 
         if (!serviceList) return <div>Loading services...</div>;
 
+        let now = Querysub.nowDelayed(timeInSecond);
+
         let services = serviceList.map(serviceId => [serviceId, controller.getServiceConfig(serviceId)] as const);
         sort(services, x => -(x[1]?.info.lastUpdatedTime || Date.now()) - (x[1]?.parameters.deploy && (Number.MAX_SAFE_INTEGER / 2) || 0));
 
@@ -140,10 +142,32 @@ export class ServicesListPage extends qreact.Component {
                                 <div className={css.vbox(4)}>
                                     <div>Updated {formatDateJSX(config.info.lastUpdatedTime)} AGO</div>
                                     {config.parameters.overlapTime && <div className={css.colorhsl(210, 50, 50).fontSize(14).fontWeight("bold")}>Deploy overlap: {formatTime(config.parameters.overlapTime)}</div> || undefined}
+                                    {(() => {
+                                        let releaseTime = config.parameters.releaseTime || 0;
+                                        if (!releaseTime || releaseTime <= now || !config.oldParameters) return undefined;
+                                        let live = getLiveServiceParameters(config) as Record<string, unknown>;
+                                        let next = config.parameters as Record<string, unknown>;
+                                        let diffLines: string[] = [];
+                                        for (let key of new Set([...Object.keys(live), ...Object.keys(next)])) {
+                                            if (key === "releaseTime") continue;
+                                            let oldValue = JSON.stringify(live[key]);
+                                            let newValue = JSON.stringify(next[key]);
+                                            if (oldValue !== newValue) {
+                                                diffLines.push(`${key}: ${oldValue} -> ${newValue}`);
+                                            }
+                                        }
+                                        return <div
+                                            className={css.colorhsl(35, 80, 45).fontSize(14).fontWeight("bold")}
+                                            title={`Deploys at ${formatDateTimeDetailed(releaseTime)}\n\n${diffLines.join("\n")}`}
+                                        >
+                                            🕐 Deploys in {formatTime(releaseTime - now)}
+                                        </div>;
+                                    })()}
                                 </div>
                             </div>
                         </Anchor>
                         <UpdateServiceButtons service={config} />
+                        <PendingDeployInfo service={config} />
                     </div>
                         ;
                 })}

package/src/deployManager/components/deployButtons.tsx

@@ -5,7 +5,8 @@ import { Querysub } from "../../4-querysub/Querysub";
 import { DEFAULT_OVERLAP_TIME, MachineServiceController, MachineInfo, ServiceConfig } from "../machineSchema";
 import { showFullscreenModal } from "../../5-diagnostics/FullscreenModal";
 import { css } from "../../4-dom/css";
-import { formatTime } from "socket-function/src/formatting/format";
+import { formatDateTimeDetailed, formatTime } from "socket-function/src/formatting/format";
+import { timeInSecond } from "socket-function/src/misc";
 import { formatDateJSX } from "../../misc/formatJSX";
 import { MachineController } from "../machineController";
 import { deepCloneJSON } from "socket-function/src/misc";
@@ -192,6 +193,36 @@ export class UpdateServiceButtons extends qreact.Component<{
     }
 }
 
+/** Shows a service's scheduled (not yet live) deploy, in the same style as the update buttons (but blue, and not clickable): when it goes live, and the new vs currently live commit. */
+export class PendingDeployInfo extends qreact.Component<{
+    service: ServiceConfig;
+}> {
+    render() {
+        let service = this.props.service;
+        let releaseTime = service.parameters.releaseTime || 0;
+        let now = Querysub.nowDelayed(timeInSecond);
+        const oldParameters = service.oldParameters;
+        if (!releaseTime || releaseTime <= now || !oldParameters) return undefined;
+
+        return <div
+            className={css.pad2(12, 8).bord2(210, 60, 40).fontWeight("bold").vbox(2).alignItems("center").alignSelf("stretch").hsl(210, 70, 90)}
+            title={formatDateTimeDetailed(releaseTime)}
+        >
+            <div>
+                {bigEmoji("🕐", -4)} <span>Deploys in {formatTime(releaseTime - now)}</span>
+            </div>
+            <div className={css.hbox(5)}>
+                <b>New</b>
+                <RenderGitRefInfo gitRef={service.parameters.gitRef} />
+            </div>
+            <div className={css.hbox(5)}>
+                <b>Current</b>
+                <RenderGitRefInfo gitRef={oldParameters.gitRef} />
+            </div>
+        </div>;
+    }
+}
+
 export class DeployMachineButtons extends qreact.Component<{
     machines: MachineInfo[];
 }> {