ever-dev

function waitForElementLoad(selector) {
  return new Promise((resolve, reject) => {
    let el = document.querySelector(selector);
    if (el) {
      resolve(el);
      return;
    }
    new MutationObserver((mutationRecords, observer) => {
      // Query for elements matching the specified selector
      Array.from(document.querySelectorAll(selector)).forEach(element => {

ever-dev

type GetDictValue<T extends string, O> = T extends `${infer A}.${infer B}`
  ? A extends keyof O
    ? GetDictValue<B, O[A]>
    : never
  : T extends keyof O
  ? O[T]
  : never;

ever-dev

const useChangesEffect = (callback, dependencies, dependencyNames = null) => {
  const prevValues = useRef(dependencies);

  useEffect(() => {
    const changes = [];
    for (let i = 0; i < prevValues.current.length; i++) {
      if (!shallowEqual(prevValues.current[i], dependencies[i])) {
        changes.push(dependencyNames ? dependencyNames[i] : i);
      }
    }

ever-dev

import ProcessExecuteService from './processExecuteService.js';


const process = new ProcessExecuteService(
  2,
  [
    // parallel
    [
      // series
      [

ever-dev

import "./styles.less";

export default function LoadingScreen() {
  return (
    <div className="tw-w-screen tw-h-screen tw-flex tw-items-center tw-justify-center">
      <div className="loading tw-relative">
        <div className="gear one">
          <svg id="blue" viewBox="0 0 100 100" fill="#94DDFF">
            <path d="M97.6,55.7V44.3l-13.6-2.9c-0.8-3.3-2.1-6.4-3.9-9.3l7.6-11.7l-8-8L67.9,20c-2.9-1.7-6-3.1-9.3-3.9L55.7,2.4H44.3l-2.9,13.6c-3.3,0.8-6.4,2.1-9.3,3.9l-11.7-7.6l-8,8L20,32.1c-1.7,2.9-3.1,6-3.9,9.3L2.4,44.3v11.4l13.6,2.9c0.8,3.3,2.1,6.4,3.9,9.3l-7.6,11.7l8,8L32.1,80c2.9,1.7,6,3.1,9.3,3.9l2.9,13.6h11.4l2.9-13.6c3.3-0.8,6.4-2.1,9.3-3.9l11.7,7.6l8-8L80,67.9c1.7-2.9,3.1-6,3.9-9.3L97.6,55.7z M50,65.6c-8.7,0-15.6-7-15.6-15.6s7-15.6,15.6-15.6s15.6,7,15.6,15.6S58.7,65.6,50,65.6z" />
          </svg>

ever-dev

import * as React from "react";
import * as ReactDOM from "react-dom";
import { ConfirmDialog } from "./dialog";

export function renderConfirmDialog(
    title: string,
    subTitle: string,
    confirmLabel: string,
    cancelLabel: string,
): Promise<boolean> {

ever-dev

import React, {
  Suspense,
  Fragment,
  lazy
} from 'react';
import {
  Switch,
  Redirect,
  Route
} from 'react-router-dom';

ever-dev

I really liked @tjvantoll article Handling Failed HTTP Responses With fetch(). The one thing I found annoying with it, though, is that response.statusText always returns the generic error message associated with the error code. Most APIs, however, will generally return some kind of useful, more human friendly message in the body.

Here's a modification that will capture this message. The key is that rather than throwing an error, you just throw the response and then process it in the catch block to extract the message in the body:

fetch("/api/foo")
  .then( response => {
    if (!response.ok) { throw response }
    return response.json()  //we only get here if there is no error
 })

ever-dev

const arr = [...];

arr.reduce((p, cur) => {
  return p.then(()=> {
    return doSomething(cur);
  });
}, Promise.resolve());

ever-dev

<template>
  <section :class="content.type" fluid class="content-container">
    <!-- Content Header -->
    <v-row>
      <v-col v-if="content.showTitle" cols="12">
        <p class="heading text-left text-xs-center d-flex align-center mb-5">
          <v-icon
            v-if="content.type === 'changelog'"
            :class="{ open: collapse }"
            @click="toggleCollapse()"