twenty-frontend 0.3.4 → 0.3.5

data/build/js/main/projects.js

@@ -461,746 +461,345 @@ if (true) {
 } else {}
 
 
-/***/ }),
-
-/***/ 952:
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
-
-
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.ParamContext = void 0;
-const react_1 = __webpack_require__(294);
-exports.ParamContext = (0, react_1.createContext)({});
+/***/ })
 
+/******/ 	});
+/************************************************************************/
+/******/ 	// The module cache
+/******/ 	var __webpack_module_cache__ = {};
+/******/ 	
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/ 		// Check if module is in cache
+/******/ 		var cachedModule = __webpack_module_cache__[moduleId];
+/******/ 		if (cachedModule !== undefined) {
+/******/ 			return cachedModule.exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = __webpack_module_cache__[moduleId] = {
+/******/ 			// no module.id needed
+/******/ 			// no module.loaded needed
+/******/ 			exports: {}
+/******/ 		};
+/******/ 	
+/******/ 		// Execute the module function
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+/******/ 	
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/create fake namespace object */
+/******/ 	(() => {
+/******/ 		var getProto = Object.getPrototypeOf ? (obj) => (Object.getPrototypeOf(obj)) : (obj) => (obj.__proto__);
+/******/ 		var leafPrototypes;
+/******/ 		// create a fake namespace object
+/******/ 		// mode & 1: value is a module id, require it
+/******/ 		// mode & 2: merge all properties of value into the ns
+/******/ 		// mode & 4: return value when already ns object
+/******/ 		// mode & 16: return value when it's Promise-like
+/******/ 		// mode & 8|1: behave like require
+/******/ 		__webpack_require__.t = function(value, mode) {
+/******/ 			if(mode & 1) value = this(value);
+/******/ 			if(mode & 8) return value;
+/******/ 			if(typeof value === 'object' && value) {
+/******/ 				if((mode & 4) && value.__esModule) return value;
+/******/ 				if((mode & 16) && typeof value.then === 'function') return value;
+/******/ 			}
+/******/ 			var ns = Object.create(null);
+/******/ 			__webpack_require__.r(ns);
+/******/ 			var def = {};
+/******/ 			leafPrototypes = leafPrototypes || [null, getProto({}), getProto([]), getProto(getProto)];
+/******/ 			for(var current = mode & 2 && value; typeof current == 'object' && !~leafPrototypes.indexOf(current); current = getProto(current)) {
+/******/ 				Object.getOwnPropertyNames(current).forEach((key) => (def[key] = () => (value[key])));
+/******/ 			}
+/******/ 			def['default'] = () => (value);
+/******/ 			__webpack_require__.d(ns, def);
+/******/ 			return ns;
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/define property getters */
+/******/ 	(() => {
+/******/ 		// define getter functions for harmony exports
+/******/ 		__webpack_require__.d = (exports, definition) => {
+/******/ 			for(var key in definition) {
+/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 				}
+/******/ 			}
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
+/******/ 	(() => {
+/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	(() => {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = (exports) => {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/************************************************************************/
+var __webpack_exports__ = {};
+// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
+(() => {
 
-/***/ }),
+// EXTERNAL MODULE: ./node_modules/react-dom/client.js
+var client = __webpack_require__(745);
+;// CONCATENATED MODULE: ./node_modules/tslib/tslib.es6.mjs
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
 
-/***/ 609:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
 
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol */
 
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var extendStatics = function(d, b) {
+  extendStatics = Object.setPrototypeOf ||
+      ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+      function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+  return extendStatics(d, b);
 };
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.App = void 0;
-const react_1 = __importDefault(__webpack_require__(294));
-const client_1 = __webpack_require__(430);
-const Context_1 = __webpack_require__(952);
-function App({ children }) {
-    const client = new client_1.ApolloClient({
-        uri: "/graphql",
-        cache: new client_1.InMemoryCache(),
-    });
-    const params = Object.fromEntries(location.hash
-        .substring(1, location.hash.length)
-        .split(",")
-        .map(e => e.split("=")));
-    return (react_1.default.createElement(Context_1.ParamContext.Provider, { value: params },
-        react_1.default.createElement(client_1.ApolloProvider, { client: client }, children)));
+
+function __extends(d, b) {
+  if (typeof b !== "function" && b !== null)
+      throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+  extendStatics(d, b);
+  function __() { this.constructor = d; }
+  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
 }
-exports.App = App;
 
+var tslib_es6_assign = function() {
+  tslib_es6_assign = Object.assign || function __assign(t) {
+      for (var s, i = 1, n = arguments.length; i < n; i++) {
+          s = arguments[i];
+          for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+      return t;
+  }
+  return tslib_es6_assign.apply(this, arguments);
+}
 
-/***/ }),
+function __rest(s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+      t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+      for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+          if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+              t[p[i]] = s[p[i]];
+      }
+  return t;
+}
 
-/***/ 46:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+function __decorate(decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
 
+function __param(paramIndex, decorator) {
+  return function (target, key) { decorator(target, key, paramIndex); }
+}
 
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.NavBar = void 0;
-const react_1 = __importStar(__webpack_require__(294));
-const Context_1 = __webpack_require__(952);
-const ProjectSelect_1 = __webpack_require__(818);
-const BASE_CLASSNAMES = ["block", "w-3/4", "no-underline", "p-3", "mt-2"];
-const ACTIVE_CLASSNAMES = [
-    ...BASE_CLASSNAMES,
-    "rounded",
-    "bg-secondary",
-    "text-primary",
-].join(" ");
-const INACTIVE_CLASSNAMES = [
-    ...BASE_CLASSNAMES,
-    "text-accent",
-    "hover-bg-secondary",
-].join(" ");
-const find = (path, bar) => {
-    let item = null;
-    Object.values(bar)
-        .flat()
-        .forEach(i => {
-        if (i.href === path) {
-            item = i;
-        }
-    });
-    return item;
+function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
+  function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
+  var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
+  var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
+  var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
+  var _, done = false;
+  for (var i = decorators.length - 1; i >= 0; i--) {
+      var context = {};
+      for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
+      for (var p in contextIn.access) context.access[p] = contextIn.access[p];
+      context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
+      var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
+      if (kind === "accessor") {
+          if (result === void 0) continue;
+          if (result === null || typeof result !== "object") throw new TypeError("Object expected");
+          if (_ = accept(result.get)) descriptor.get = _;
+          if (_ = accept(result.set)) descriptor.set = _;
+          if (_ = accept(result.init)) initializers.unshift(_);
+      }
+      else if (_ = accept(result)) {
+          if (kind === "field") initializers.unshift(_);
+          else descriptor[key] = _;
+      }
+  }
+  if (target) Object.defineProperty(target, contextIn.name, descriptor);
+  done = true;
 };
-function NavBar() {
-    const params = (0, react_1.useContext)(Context_1.ParamContext);
-    const bar = {
-        Tasks: [
-            { text: "All tasks", href: "/tasks/" },
-            { text: "New task", href: "/tasks/new/" },
-        ],
-        Projects: [{ text: "All projects", href: "/projects" }],
-    };
-    const activeItem = find(location.pathname, bar);
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        ...Object.keys(bar).map(key => {
-            const items = bar[key];
-            return (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement("h3", null, key),
-                react_1.default.createElement("ul", null, ...items.flatMap(item => {
-                    return (react_1.default.createElement("li", null,
-                        react_1.default.createElement("a", { className: activeItem == item
-                                ? ACTIVE_CLASSNAMES
-                                : INACTIVE_CLASSNAMES, href: item.href }, item.text)));
-                }))));
-        }),
-        react_1.default.createElement("h3", null, "Filters"),
-        react_1.default.createElement(ProjectSelect_1.ProjectSelect, { selected: params.projectId, onChange: project => {
-                if (project) {
-                    location.hash = `projectId=${project.id}`;
-                }
-                else {
-                    location.hash = "";
-                }
-                location.reload();
-            } })));
-}
-exports.NavBar = NavBar;
 
+function __runInitializers(thisArg, initializers, value) {
+  var useValue = arguments.length > 2;
+  for (var i = 0; i < initializers.length; i++) {
+      value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
+  }
+  return useValue ? value : void 0;
+};
 
-/***/ }),
+function __propKey(x) {
+  return typeof x === "symbol" ? x : "".concat(x);
+};
 
-/***/ 818:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+function __setFunctionName(f, name, prefix) {
+  if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
+  return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
+};
 
+function __metadata(metadataKey, metadataValue) {
+  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
+}
 
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.ProjectSelect = void 0;
-const react_1 = __importDefault(__webpack_require__(294));
-const useProjects_1 = __webpack_require__(547);
-const Select_1 = __webpack_require__(21);
-function ProjectSelect({ onChange, selected }) {
-    const { data, loading } = (0, useProjects_1.useProjects)();
-    const projects = data?.projects || [];
-    const options = projects.map(project => ({
-        label: (react_1.default.createElement("div", { className: "flex" },
-            react_1.default.createElement("span", { style: { backgroundColor: project.color }, className: "flex w-2/8 rounded w-8 h-8 mr-3 cursor-pointer" }),
-            react_1.default.createElement("span", { className: "flex align-items-center" }, project.name))),
-        value: String(project.id),
-    }));
-    if (loading) {
-        return null;
-    }
-    return (react_1.default.createElement(Select_1.Select, { onChange: (option) => {
-            const project = projects.find(p => String(p.id) == option.value);
-            onChange(project);
-        }, options: options, selected: String(selected), placeholder: "Any project" }));
-    1;
+function __awaiter(thisArg, _arguments, P, generator) {
+  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+  return new (P || (P = Promise))(function (resolve, reject) {
+      function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+      function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+      function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+      step((generator = generator.apply(thisArg, _arguments || [])).next());
+  });
 }
-exports.ProjectSelect = ProjectSelect;
-
-
-/***/ }),
-
-/***/ 65:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
-
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.Projects = void 0;
-const useSetRandomProjectColor_1 = __webpack_require__(565);
-const react_1 = __importStar(__webpack_require__(294));
-const NavBar_1 = __webpack_require__(46);
-const useProjects_1 = __webpack_require__(547);
-function Projects() {
-    const { data, loading } = (0, useProjects_1.useProjects)();
-    const setRandomProjectColor = (0, useSetRandomProjectColor_1.useSetRandomProjectColor)();
-    const projects = data?.projects;
-    (0, react_1.useEffect)(() => {
-        document.title = "Projects";
-    }, []);
-    if (loading) {
-        return;
-    }
-    return (react_1.default.createElement("div", { className: "flex" },
-        react_1.default.createElement("div", { className: "w-1/4" },
-            react_1.default.createElement(NavBar_1.NavBar, null)),
-        react_1.default.createElement("div", { className: "w-3/4" },
-            react_1.default.createElement("h1", { className: "bg-secondary text-primary p-3 rounded" }, "Projects"),
-            react_1.default.createElement("ul", { className: "flex flex-wrap" }, projects.map((project, i) => {
-                return (react_1.default.createElement("li", { className: "flex flex-row p-3 hover-bg-secondary w-full", key: i },
-                    react_1.default.createElement("div", { style: { backgroundColor: project.color }, className: "w-2/8 rounded w-12 h-12 mr-3 cursor-pointer", onClick: async () => {
-                            await setRandomProjectColor({
-                                variables: { projectId: project.id },
-                            });
-                        } }),
-                    react_1.default.createElement("a", { className: "w-6/8 no-underline text-accent block h-14", href: `/tasks/#projectId=${project.id}` },
-                        react_1.default.createElement("span", { className: "block w-full" }, project.name),
-                        react_1.default.createElement("span", { className: "block w-full text-smaller text-secondary" }, project.path))));
-            })))));
+function __generator(thisArg, body) {
+  var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+  return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+  function verb(n) { return function (v) { return step([n, v]); }; }
+  function step(op) {
+      if (f) throw new TypeError("Generator is already executing.");
+      while (g && (g = 0, op[0] && (_ = 0)), _) try {
+          if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+          if (y = 0, t) op = [op[0] & 2, t.value];
+          switch (op[0]) {
+              case 0: case 1: t = op; break;
+              case 4: _.label++; return { value: op[1], done: false };
+              case 5: _.label++; y = op[1]; op = [0]; continue;
+              case 7: op = _.ops.pop(); _.trys.pop(); continue;
+              default:
+                  if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                  if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                  if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                  if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                  if (t[2]) _.ops.pop();
+                  _.trys.pop(); continue;
+          }
+          op = body.call(thisArg, _);
+      } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+      if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+  }
 }
-exports.Projects = Projects;
-
-
-/***/ }),
-
-/***/ 21:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
-
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+var __createBinding = Object.create ? (function(o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
       desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
+  }
+  Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.Select = void 0;
-const react_1 = __importStar(__webpack_require__(294));
-const LI_CLASSNAME = [
-    "flex",
-    "align-items-center",
-    "w-3/4",
-    "hover-bg-secondary",
-    "p-3",
-    "mt-2",
-    "cursor-pointer",
-].join(" ");
-const ACTIVE_CLASSNAME = [
-    LI_CLASSNAME,
-    "rounded",
-    "border",
-    "border-solid",
-    "border-secondary",
-    "text-primary",
-    "bg-secondary"
-].join(" ");
-const Select = ({ onChange, options, selected, placeholder }) => {
-    const selectOptions = [{ label: placeholder, value: "" }, ...options];
-    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
-    const [option, setOption] = (0, react_1.useState)(options.find(o => o.value === selected) || selectOptions[0]);
-    const onClick = (option) => {
-        if (isOpen) {
-            setOption(option);
-            setIsOpen(false);
-            onChange(option);
-        }
-        else {
-            setIsOpen(true);
-        }
-    };
-    const getClassName = (o1, o2) => {
-        if (o1.value === o2.value) {
-            return ACTIVE_CLASSNAME;
-        }
-        else {
-            return (!isOpen && o1.value !== o2.value) ? "hidden" : LI_CLASSNAME;
-        }
-    };
-    (0, react_1.useEffect)(() => {
-        const onDocumentClick = () => {
-            if (isOpen) {
-                setIsOpen(false);
-            }
-        };
-        document.body.addEventListener('click', onDocumentClick);
-        return () => document.body.removeEventListener('click', onDocumentClick);
-    }, [isOpen]);
-    return (react_1.default.createElement("ul", null, selectOptions.map((o, i) => (react_1.default.createElement("li", { key: i, "data-value": o.value, onClick: (e) => [e.stopPropagation(), onClick(o)], className: getClassName(o, option) }, o.label)))));
-};
-exports.Select = Select;
-
 
-/***/ }),
-
-/***/ 565:
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+function __exportStar(m, o) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);
+}
 
+function __values(o) {
+  var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+  if (m) return m.call(o);
+  if (o && typeof o.length === "number") return {
+      next: function () {
+          if (o && i >= o.length) o = void 0;
+          return { value: o && o[i++], done: !o };
+      }
+  };
+  throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+}
 
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.useSetRandomProjectColor = void 0;
-const client_1 = __webpack_require__(430);
-const GQL = (0, client_1.gql) `
-  mutation SetRandomProjectColor($projectId: Int!) {
-    setRandomProjectColor(projectId: $projectId) {
-      project {
-        id
-        color
+function __read(o, n) {
+  var m = typeof Symbol === "function" && o[Symbol.iterator];
+  if (!m) return o;
+  var i = m.call(o), r, ar = [], e;
+  try {
+      while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+  }
+  catch (error) { e = { error: error }; }
+  finally {
+      try {
+          if (r && !r.done && (m = i["return"])) m.call(i);
       }
-      errors
-    }
+      finally { if (e) throw e.error; }
   }
-`;
-function useSetRandomProjectColor() {
-    const [setRandomProjectColor] = (0, client_1.useMutation)(GQL);
-    return ({ variables }) => {
-        return setRandomProjectColor({
-            variables,
-            update(cache, { data }) {
-                const project = data.project;
-                modify(cache, project);
-            },
-        });
-    };
+  return ar;
 }
-exports.useSetRandomProjectColor = useSetRandomProjectColor;
-const modify = (cache, project) => {
-    cache.modify({
-        id: cache.identify(project),
-        fields: {
-            projects(existingProjects = []) {
-                cache.writeFragment({
-                    id: cache.identify(project),
-                    data: { project },
-                    fragment: (0, client_1.gql) `
-            fragment P on Project {
-              color
-            }
-          `,
-                });
-                return [...existingProjects, project];
-            },
-        },
-    });
-};
-
-
-/***/ }),
 
-/***/ 547:
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/** @deprecated */
+function __spread() {
+  for (var ar = [], i = 0; i < arguments.length; i++)
+      ar = ar.concat(__read(arguments[i]));
+  return ar;
+}
 
+/** @deprecated */
+function __spreadArrays() {
+  for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
+  for (var r = Array(s), k = 0, i = 0; i < il; i++)
+      for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
+          r[k] = a[j];
+  return r;
+}
 
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.useProjects = void 0;
-const client_1 = __webpack_require__(430);
-const GQL = (0, client_1.gql) `
-  query Query {
-    projects {
-      id
-      name
-      path
-      color
-    }
+function tslib_es6_spreadArray(to, from, pack) {
+  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+      if (ar || !(i in from)) {
+          if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+          ar[i] = from[i];
+      }
   }
-`;
-function useProjects() {
-    return (0, client_1.useQuery)(GQL);
+  return to.concat(ar || Array.prototype.slice.call(from));
 }
-exports.useProjects = useProjects;
-
 
-/***/ }),
+function __await(v) {
+  return this instanceof __await ? (this.v = v, this) : new __await(v);
+}
 
-/***/ 677:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+function __asyncGenerator(thisArg, _arguments, generator) {
+  if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+  var g = generator.apply(thisArg, _arguments || []), i, q = [];
+  return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
+  function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
+  function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
+  function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
+  function fulfill(value) { resume("next", value); }
+  function reject(value) { resume("throw", value); }
+  function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
+}
 
-
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-const react_1 = __importDefault(__webpack_require__(294));
-const client_1 = __importDefault(__webpack_require__(745));
-const App_1 = __webpack_require__(609);
-const Projects_1 = __webpack_require__(65);
-(function () {
-    const root = document.querySelector(".react-root");
-    client_1.default.createRoot(root).render(react_1.default.createElement(App_1.App, null,
-        react_1.default.createElement(Projects_1.Projects, null)));
-})();
-
-
-/***/ }),
-
-/***/ 430:
-/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
-
-// ESM COMPAT FLAG
-__webpack_require__.r(__webpack_exports__);
-
-// EXPORTS
-__webpack_require__.d(__webpack_exports__, {
-  ApolloCache: () => (/* reexport */ ApolloCache),
-  ApolloClient: () => (/* reexport */ ApolloClient),
-  ApolloConsumer: () => (/* reexport */ ApolloConsumer),
-  ApolloError: () => (/* reexport */ ApolloError),
-  ApolloLink: () => (/* reexport */ ApolloLink),
-  ApolloProvider: () => (/* reexport */ ApolloProvider),
-  Cache: () => (/* reexport */ Cache),
-  DocumentTransform: () => (/* reexport */ DocumentTransform),
-  DocumentType: () => (/* reexport */ DocumentType),
-  HttpLink: () => (/* reexport */ HttpLink),
-  InMemoryCache: () => (/* reexport */ InMemoryCache),
-  MissingFieldError: () => (/* reexport */ MissingFieldError),
-  NetworkStatus: () => (/* reexport */ NetworkStatus),
-  Observable: () => (/* reexport */ Observable),
-  ObservableQuery: () => (/* reexport */ ObservableQuery),
-  checkFetcher: () => (/* reexport */ checkFetcher),
-  concat: () => (/* reexport */ concat),
-  createHttpLink: () => (/* reexport */ createHttpLink),
-  createSignalIfSupported: () => (/* reexport */ createSignalIfSupported),
-  defaultDataIdFromObject: () => (/* reexport */ defaultDataIdFromObject),
-  defaultPrinter: () => (/* reexport */ defaultPrinter),
-  disableExperimentalFragmentVariables: () => (/* reexport */ disableExperimentalFragmentVariables),
-  disableFragmentWarnings: () => (/* reexport */ disableFragmentWarnings),
-  empty: () => (/* reexport */ empty),
-  enableExperimentalFragmentVariables: () => (/* reexport */ enableExperimentalFragmentVariables),
-  execute: () => (/* reexport */ execute),
-  fallbackHttpConfig: () => (/* reexport */ fallbackHttpConfig),
-  from: () => (/* reexport */ from),
-  fromError: () => (/* reexport */ fromError),
-  fromPromise: () => (/* reexport */ fromPromise),
-  getApolloContext: () => (/* reexport */ getApolloContext),
-  gql: () => (/* reexport */ gql),
-  isApolloError: () => (/* reexport */ isApolloError),
-  isNetworkRequestSettled: () => (/* reexport */ isNetworkRequestSettled),
-  isReference: () => (/* reexport */ isReference),
-  makeReference: () => (/* reexport */ makeReference),
-  makeVar: () => (/* reexport */ makeVar),
-  mergeOptions: () => (/* reexport */ mergeOptions),
-  operationName: () => (/* reexport */ operationName),
-  parseAndCheckHttpResponse: () => (/* reexport */ parseAndCheckHttpResponse),
-  parser: () => (/* reexport */ parser),
-  resetApolloContext: () => (/* reexport */ resetApolloContext),
-  resetCaches: () => (/* reexport */ resetCaches),
-  rewriteURIForGET: () => (/* reexport */ rewriteURIForGET),
-  selectHttpOptionsAndBody: () => (/* reexport */ selectHttpOptionsAndBody),
-  selectHttpOptionsAndBodyInternal: () => (/* reexport */ selectHttpOptionsAndBodyInternal),
-  selectURI: () => (/* reexport */ selectURI),
-  serializeFetchParameter: () => (/* reexport */ serializeFetchParameter),
-  setLogVerbosity: () => (/* reexport */ setVerbosity),
-  skipToken: () => (/* reexport */ skipToken),
-  split: () => (/* reexport */ split),
-  throwServerError: () => (/* reexport */ throwServerError),
-  toPromise: () => (/* reexport */ toPromise),
-  useApolloClient: () => (/* reexport */ useApolloClient),
-  useBackgroundQuery: () => (/* reexport */ useBackgroundQuery),
-  useFragment: () => (/* reexport */ useFragment),
-  useLazyQuery: () => (/* reexport */ useLazyQuery),
-  useMutation: () => (/* reexport */ useMutation),
-  useQuery: () => (/* reexport */ useQuery),
-  useReactiveVar: () => (/* reexport */ useReactiveVar),
-  useReadQuery: () => (/* reexport */ useReadQuery),
-  useSubscription: () => (/* reexport */ useSubscription),
-  useSuspenseQuery: () => (/* reexport */ useSuspenseQuery)
-});
-
-;// CONCATENATED MODULE: ./node_modules/tslib/tslib.es6.mjs
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol */
-
-var extendStatics = function(d, b) {
-  extendStatics = Object.setPrototypeOf ||
-      ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-      function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-  return extendStatics(d, b);
-};
-
-function __extends(d, b) {
-  if (typeof b !== "function" && b !== null)
-      throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-  extendStatics(d, b);
-  function __() { this.constructor = d; }
-  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-}
-
-var tslib_es6_assign = function() {
-  tslib_es6_assign = Object.assign || function __assign(t) {
-      for (var s, i = 1, n = arguments.length; i < n; i++) {
-          s = arguments[i];
-          for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-      }
-      return t;
-  }
-  return tslib_es6_assign.apply(this, arguments);
-}
-
-function __rest(s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-      t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function")
-      for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-          if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-              t[p[i]] = s[p[i]];
-      }
-  return t;
-}
-
-function __decorate(decorators, target, key, desc) {
-  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-}
-
-function __param(paramIndex, decorator) {
-  return function (target, key) { decorator(target, key, paramIndex); }
-}
-
-function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
-  function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
-  var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
-  var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
-  var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
-  var _, done = false;
-  for (var i = decorators.length - 1; i >= 0; i--) {
-      var context = {};
-      for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
-      for (var p in contextIn.access) context.access[p] = contextIn.access[p];
-      context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
-      var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
-      if (kind === "accessor") {
-          if (result === void 0) continue;
-          if (result === null || typeof result !== "object") throw new TypeError("Object expected");
-          if (_ = accept(result.get)) descriptor.get = _;
-          if (_ = accept(result.set)) descriptor.set = _;
-          if (_ = accept(result.init)) initializers.unshift(_);
-      }
-      else if (_ = accept(result)) {
-          if (kind === "field") initializers.unshift(_);
-          else descriptor[key] = _;
-      }
-  }
-  if (target) Object.defineProperty(target, contextIn.name, descriptor);
-  done = true;
-};
-
-function __runInitializers(thisArg, initializers, value) {
-  var useValue = arguments.length > 2;
-  for (var i = 0; i < initializers.length; i++) {
-      value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
-  }
-  return useValue ? value : void 0;
-};
-
-function __propKey(x) {
-  return typeof x === "symbol" ? x : "".concat(x);
-};
-
-function __setFunctionName(f, name, prefix) {
-  if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
-  return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
-};
-
-function __metadata(metadataKey, metadataValue) {
-  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
-}
-
-function __awaiter(thisArg, _arguments, P, generator) {
-  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-  return new (P || (P = Promise))(function (resolve, reject) {
-      function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-      function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-      function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-      step((generator = generator.apply(thisArg, _arguments || [])).next());
-  });
-}
-
-function __generator(thisArg, body) {
-  var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-  return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-  function verb(n) { return function (v) { return step([n, v]); }; }
-  function step(op) {
-      if (f) throw new TypeError("Generator is already executing.");
-      while (g && (g = 0, op[0] && (_ = 0)), _) try {
-          if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-          if (y = 0, t) op = [op[0] & 2, t.value];
-          switch (op[0]) {
-              case 0: case 1: t = op; break;
-              case 4: _.label++; return { value: op[1], done: false };
-              case 5: _.label++; y = op[1]; op = [0]; continue;
-              case 7: op = _.ops.pop(); _.trys.pop(); continue;
-              default:
-                  if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                  if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                  if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                  if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                  if (t[2]) _.ops.pop();
-                  _.trys.pop(); continue;
-          }
-          op = body.call(thisArg, _);
-      } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-      if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-  }
-}
-
-var __createBinding = Object.create ? (function(o, m, k, k2) {
-  if (k2 === undefined) k2 = k;
-  var desc = Object.getOwnPropertyDescriptor(m, k);
-  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-  }
-  Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-  if (k2 === undefined) k2 = k;
-  o[k2] = m[k];
-});
-
-function __exportStar(m, o) {
-  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);
-}
-
-function __values(o) {
-  var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-  if (m) return m.call(o);
-  if (o && typeof o.length === "number") return {
-      next: function () {
-          if (o && i >= o.length) o = void 0;
-          return { value: o && o[i++], done: !o };
-      }
-  };
-  throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
-}
-
-function __read(o, n) {
-  var m = typeof Symbol === "function" && o[Symbol.iterator];
-  if (!m) return o;
-  var i = m.call(o), r, ar = [], e;
-  try {
-      while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-  }
-  catch (error) { e = { error: error }; }
-  finally {
-      try {
-          if (r && !r.done && (m = i["return"])) m.call(i);
-      }
-      finally { if (e) throw e.error; }
-  }
-  return ar;
-}
-
-/** @deprecated */
-function __spread() {
-  for (var ar = [], i = 0; i < arguments.length; i++)
-      ar = ar.concat(__read(arguments[i]));
-  return ar;
-}
-
-/** @deprecated */
-function __spreadArrays() {
-  for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
-  for (var r = Array(s), k = 0, i = 0; i < il; i++)
-      for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
-          r[k] = a[j];
-  return r;
-}
-
-function __spreadArray(to, from, pack) {
-  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-      if (ar || !(i in from)) {
-          if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-          ar[i] = from[i];
-      }
-  }
-  return to.concat(ar || Array.prototype.slice.call(from));
-}
-
-function __await(v) {
-  return this instanceof __await ? (this.v = v, this) : new __await(v);
-}
-
-function __asyncGenerator(thisArg, _arguments, generator) {
-  if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
-  var g = generator.apply(thisArg, _arguments || []), i, q = [];
-  return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
-  function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
-  function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
-  function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
-  function fulfill(value) { resume("next", value); }
-  function reject(value) { resume("throw", value); }
-  function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
-}
-
-function __asyncDelegator(o) {
-  var i, p;
-  return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
-  function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }
-}
+function __asyncDelegator(o) {
+  var i, p;
+  return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
+  function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }
+}
 
 function __asyncValues(o) {
   if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
@@ -1313,7 +912,7 @@ function __disposeResources(env) {
   __read,
   __spread,
   __spreadArrays,
-  __spreadArray,
+  __spreadArray: tslib_es6_spreadArray,
   __await,
   __asyncGenerator,
   __asyncDelegator,
@@ -2188,7 +1787,7 @@ function getFragmentQueryDocument(document, fragmentName) {
     }
     // Generate a query document with an operation that simply spreads the
     // fragment inside of it.
-    var query = tslib_es6_assign(tslib_es6_assign({}, document), { definitions: __spreadArray([
+    var query = tslib_es6_assign(tslib_es6_assign({}, document), { definitions: tslib_es6_spreadArray([
             {
                 kind: "OperationDefinition",
                 // OperationTypeNode is an enum
@@ -3814,7 +3413,7 @@ function isApolloError(err) {
 // If the error message has already been set through the
 // constructor or otherwise, this function is a nop.
 var generateErrorMessage = function (err) {
-    var errors = __spreadArray(__spreadArray(__spreadArray([], err.graphQLErrors, true), err.clientErrors, true), err.protocolErrors, true);
+    var errors = tslib_es6_spreadArray(tslib_es6_spreadArray(tslib_es6_spreadArray([], err.graphQLErrors, true), err.clientErrors, true), err.protocolErrors, true);
     if (err.networkError)
         errors.push(err.networkError);
     return (errors
@@ -3904,7 +3503,7 @@ var DeepMerger = /** @class */ (function () {
                 if (mergeDeep_hasOwnProperty.call(target, sourceKey)) {
                     var targetValue = target[sourceKey];
                     if (source[sourceKey] !== targetValue) {
-                        var result = _this.reconciler.apply(_this, __spreadArray([target,
+                        var result = _this.reconciler.apply(_this, tslib_es6_spreadArray([target,
                             source,
                             sourceKey], context, false));
                         // A well-implemented reconciler may return targetValue to indicate
@@ -5490,7 +5089,7 @@ var addTypenameToDocument = Object.assign(function (doc) {
                     return;
                 }
                 // Create and return a new SelectionSet with a __typename Field.
-                return tslib_es6_assign(tslib_es6_assign({}, node), { selections: __spreadArray(__spreadArray([], selections, true), [TYPENAME_FIELD], false) });
+                return tslib_es6_assign(tslib_es6_assign({}, node), { selections: tslib_es6_spreadArray(tslib_es6_spreadArray([], selections, true), [TYPENAME_FIELD], false) });
             },
         },
     });
@@ -7760,11 +7359,69 @@ function isTypeExtensionNode(node) {
   );
 }
 
-;// CONCATENATED MODULE: ./node_modules/@wry/caches/lib/strong.js
-function defaultDispose() { }
-class StrongCache {
-    constructor(max = Infinity, dispose = defaultDispose) {
-        this.max = max;
+;// CONCATENATED MODULE: ./node_modules/optimism/node_modules/@wry/trie/lib/index.js
+// A [trie](https://en.wikipedia.org/wiki/Trie) data structure that holds
+// object keys weakly, yet can also hold non-object keys, unlike the
+// native `WeakMap`.
+// If no makeData function is supplied, the looked-up data will be an empty,
+// null-prototype Object.
+const lib_defaultMakeData = () => Object.create(null);
+// Useful for processing arguments objects as well as arrays.
+const { forEach: lib_forEach, slice: lib_slice } = Array.prototype;
+const { hasOwnProperty: _wry_trie_lib_hasOwnProperty } = Object.prototype;
+class lib_Trie {
+    constructor(weakness = true, makeData = lib_defaultMakeData) {
+        this.weakness = weakness;
+        this.makeData = makeData;
+    }
+    lookup(...array) {
+        return this.lookupArray(array);
+    }
+    lookupArray(array) {
+        let node = this;
+        lib_forEach.call(array, key => node = node.getChildTrie(key));
+        return _wry_trie_lib_hasOwnProperty.call(node, "data")
+            ? node.data
+            : node.data = this.makeData(lib_slice.call(array));
+    }
+    peek(...array) {
+        return this.peekArray(array);
+    }
+    peekArray(array) {
+        let node = this;
+        for (let i = 0, len = array.length; node && i < len; ++i) {
+            const map = this.weakness && lib_isObjRef(array[i]) ? node.weak : node.strong;
+            node = map && map.get(array[i]);
+        }
+        return node && node.data;
+    }
+    getChildTrie(key) {
+        const map = this.weakness && lib_isObjRef(key)
+            ? this.weak || (this.weak = new WeakMap())
+            : this.strong || (this.strong = new Map());
+        let child = map.get(key);
+        if (!child)
+            map.set(key, child = new lib_Trie(this.weakness, this.makeData));
+        return child;
+    }
+}
+function lib_isObjRef(value) {
+    switch (typeof value) {
+        case "object":
+            if (value === null)
+                break;
+        // Fall through to return true...
+        case "function":
+            return true;
+    }
+    return false;
+}
+//# sourceMappingURL=index.js.map
+;// CONCATENATED MODULE: ./node_modules/@wry/caches/lib/strong.js
+function defaultDispose() { }
+class StrongCache {
+    constructor(max = Infinity, dispose = defaultDispose) {
+        this.max = max;
         this.dispose = dispose;
         this.map = new Map();
         this.newest = null;
@@ -8470,7 +8127,7 @@ function dep(options) {
 // In those cases, just write your own custom makeCacheKey functions.
 let defaultKeyTrie;
 function defaultMakeCacheKey(...args) {
-    const trie = defaultKeyTrie || (defaultKeyTrie = new Trie(typeof WeakMap === "function"));
+    const trie = defaultKeyTrie || (defaultKeyTrie = new lib_Trie(typeof WeakMap === "function"));
     return trie.lookupArray(args);
 }
 // If you're paranoid about memory leaks, or you want to avoid using WeakMap
@@ -11006,11 +10663,6 @@ var ApolloClient = /** @class */ (function () {
 }());
 
 //# sourceMappingURL=ApolloClient.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/cache/core/types/Cache.js
-var Cache;
-(function (Cache) {
-})(Cache || (Cache = {}));
-//# sourceMappingURL=Cache.js.map
 ;// CONCATENATED MODULE: ./node_modules/@apollo/client/cache/core/cache.js
 
 
@@ -14065,91 +13717,76 @@ var InMemoryCache = /** @class */ (function (_super) {
 }(ApolloCache));
 
 //# sourceMappingURL=inMemoryCache.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/core/empty.js
-
-var empty = ApolloLink.empty;
-//# sourceMappingURL=empty.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/core/from.js
-
-var from = ApolloLink.from;
-//# sourceMappingURL=from.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/core/split.js
-
-var split = ApolloLink.split;
-//# sourceMappingURL=split.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/core/concat.js
-
-var concat = ApolloLink.concat;
-//# sourceMappingURL=concat.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/core/index.js
-
-
-
-
-
+// EXTERNAL MODULE: ./node_modules/react/index.js
+var react = __webpack_require__(294);
+var react_namespaceObject = /*#__PURE__*/__webpack_require__.t(react, 2);
+;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/context/ApolloContext.js
 
 
 
-//# sourceMappingURL=index.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/http/createSignalIfSupported.js
+// To make sure Apollo Client doesn't create more than one React context
+// (which can lead to problems like having an Apollo Client instance added
+// in one context, then attempting to retrieve it from another different
+// context), a single Apollo context is created and tracked in global state.
+var contextKey = canUseSymbol ? Symbol.for("__APOLLO_CONTEXT__") : "__APOLLO_CONTEXT__";
+function getApolloContext() {
+    invariantWrappers_invariant( true, 45);
+    var context = react.createContext[contextKey];
+    if (!context) {
+        Object.defineProperty(react.createContext, contextKey, {
+            value: (context = react.createContext({})),
+            enumerable: false,
+            writable: false,
+            configurable: true,
+        });
+        context.displayName = "ApolloContext";
+    }
+    return context;
+}
 /**
- * @deprecated
- * This is not used internally any more and will be removed in
- * the next major version of Apollo Client.
+ * @deprecated This function has no "resetting" effect since Apollo Client 3.4.12,
+ * and will be removed in the next major version of Apollo Client.
+ * If you want to get the Apollo Context, use `getApolloContext` instead.
  */
-var createSignalIfSupported = function () {
-    if (typeof AbortController === "undefined")
-        return { controller: false, signal: false };
-    var controller = new AbortController();
-    var signal = controller.signal;
-    return { controller: controller, signal: signal };
-};
-//# sourceMappingURL=createSignalIfSupported.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/http/index.js
-
-
-
+var resetApolloContext = (/* unused pure expression or super */ null && (getApolloContext));
+//# sourceMappingURL=ApolloContext.js.map
+;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/context/ApolloProvider.js
 
 
 
 
+var ApolloProvider = function (_a) {
+    var client = _a.client, children = _a.children;
+    var ApolloContext = getApolloContext();
+    var parentContext = react.useContext(ApolloContext);
+    var context = react.useMemo(function () {
+        return tslib_es6_assign(tslib_es6_assign({}, parentContext), { client: client || parentContext.client });
+    }, [parentContext, client]);
+    invariantWrappers_invariant(context.client, 46);
+    return (react.createElement(ApolloContext.Provider, { value: context }, children));
+};
+//# sourceMappingURL=ApolloProvider.js.map
+;// CONCATENATED MODULE: ./src/js/Context.ts
 
+const ParamContext = (0,react.createContext)({});
 
+;// CONCATENATED MODULE: ./src/js/components/App.tsx
+/* provided dependency */ var React = __webpack_require__(294);
 
-//# sourceMappingURL=index.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/utils/toPromise.js
 
-function toPromise(observable) {
-    var completed = false;
-    return new Promise(function (resolve, reject) {
-        observable.subscribe({
-            next: function (data) {
-                if (completed) {
-                    globalThis.__DEV__ !== false && invariantWrappers_invariant.warn(42);
-                }
-                else {
-                    completed = true;
-                    resolve(data);
-                }
-            },
-            error: reject,
-        });
+function App({ children }) {
+    const client = new ApolloClient({
+        uri: "/graphql",
+        cache: new InMemoryCache(),
     });
+    const params = Object.fromEntries(location.hash
+        .substring(1, location.hash.length)
+        .split(",")
+        .map(e => e.split("=")));
+    return (React.createElement(ParamContext.Provider, { value: params },
+        React.createElement(ApolloProvider, { client: client }, children)));
 }
-//# sourceMappingURL=toPromise.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/link/utils/fromPromise.js
 
-function fromPromise(promise) {
-    return new Observable(function (observer) {
-        promise
-            .then(function (value) {
-            observer.next(value);
-            observer.complete();
-        })
-            .catch(observer.error.bind(observer));
-    });
-}
-//# sourceMappingURL=fromPromise.js.map
 ;// CONCATENATED MODULE: ./node_modules/graphql/jsutils/isObjectLike.mjs
 /**
  * Return true if `value` is object-like. A value is object-like if it's not
@@ -17268,114 +16905,278 @@ var extras = {
 gql["default"] = gql;
 /* harmony default export */ const graphql_tag_lib = ((/* unused pure expression or super */ null && (gql)));
 //# sourceMappingURL=index.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/core/index.js
-/* Core */
-
-
-
-
-
-
+;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/parser/index.js
 
-/* Link */
+var DocumentType;
+(function (DocumentType) {
+    DocumentType[DocumentType["Query"] = 0] = "Query";
+    DocumentType[DocumentType["Mutation"] = 1] = "Mutation";
+    DocumentType[DocumentType["Subscription"] = 2] = "Subscription";
+})(DocumentType || (DocumentType = {}));
+var cache = new Map();
+function operationName(type) {
+    var name;
+    switch (type) {
+        case DocumentType.Query:
+            name = "Query";
+            break;
+        case DocumentType.Mutation:
+            name = "Mutation";
+            break;
+        case DocumentType.Subscription:
+            name = "Subscription";
+            break;
+    }
+    return name;
+}
+// This parser is mostly used to safety check incoming documents.
+function parser(document) {
+    var cached = cache.get(document);
+    if (cached)
+        return cached;
+    var variables, type, name;
+    invariantWrappers_invariant(!!document && !!document.kind, 59, document);
+    var fragments = [];
+    var queries = [];
+    var mutations = [];
+    var subscriptions = [];
+    for (var _i = 0, _a = document.definitions; _i < _a.length; _i++) {
+        var x = _a[_i];
+        if (x.kind === "FragmentDefinition") {
+            fragments.push(x);
+            continue;
+        }
+        if (x.kind === "OperationDefinition") {
+            switch (x.operation) {
+                case "query":
+                    queries.push(x);
+                    break;
+                case "mutation":
+                    mutations.push(x);
+                    break;
+                case "subscription":
+                    subscriptions.push(x);
+                    break;
+            }
+        }
+    }
+    invariantWrappers_invariant(!fragments.length ||
+        queries.length ||
+        mutations.length ||
+        subscriptions.length, 60);
+    invariantWrappers_invariant(
+        queries.length + mutations.length + subscriptions.length <= 1,
+        61,
+        document,
+        queries.length,
+        subscriptions.length,
+        mutations.length
+    );
+    type = queries.length ? DocumentType.Query : DocumentType.Mutation;
+    if (!queries.length && !mutations.length)
+        type = DocumentType.Subscription;
+    var definitions = queries.length ? queries
+        : mutations.length ? mutations
+            : subscriptions;
+    invariantWrappers_invariant(definitions.length === 1, 62, document, definitions.length);
+    var definition = definitions[0];
+    variables = definition.variableDefinitions || [];
+    if (definition.name && definition.name.kind === "Name") {
+        name = definition.name.value;
+    }
+    else {
+        name = "data"; // fallback to using data if no name
+    }
+    var payload = { name: name, type: type, variables: variables };
+    cache.set(document, payload);
+    return payload;
+}
+function verifyDocumentType(document, type) {
+    var operation = parser(document);
+    var requiredOperationName = operationName(type);
+    var usedOperationName = operationName(operation.type);
+    invariantWrappers_invariant(
+        operation.type === type,
+        63,
+        requiredOperationName,
+        requiredOperationName,
+        usedOperationName
+    );
+}
+//# sourceMappingURL=index.js.map
+;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useApolloClient.js
 
 
 
+function useApolloClient(override) {
+    var context = react.useContext(getApolloContext());
+    var client = override || context.client;
+    invariantWrappers_invariant(!!client, 49);
+    return client;
+}
+//# sourceMappingURL=useApolloClient.js.map
+;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useMutation.js
 
-/* Supporting */
-// The verbosity of invariant.{log,warn,error} can be controlled globally
-// (for anyone using the same ts-invariant package) by passing "log",
-// "warn", "error", or "silent" to setVerbosity ("log" is the default).
-// Note that all invariant.* logging is hidden in production.
 
 
-setVerbosity(globalThis.__DEV__ !== false ? "log" : "silent");
-// Note that importing `gql` by itself, then destructuring
-// additional properties separately before exporting, is intentional.
-// Due to the way the `graphql-tag` library is setup, certain bundlers
-// can't find the properties added to the exported `gql` function without
-// additional guidance (e.g. Rollup - see
-// https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module).
-// Instead of having people that are using bundlers with `@apollo/client` add
-// extra bundler config to help `graphql-tag` exports be found (which would be
-// awkward since they aren't importing `graphql-tag` themselves), this
-// workaround of pulling the extra properties off the `gql` function,
-// then re-exporting them separately, helps keeps bundlers happy without any
-// additional config changes.
 
-//# sourceMappingURL=index.js.map
-// EXTERNAL MODULE: ./node_modules/react/index.js
-var react = __webpack_require__(294);
-var react_namespaceObject = /*#__PURE__*/__webpack_require__.t(react, 2);
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/context/ApolloContext.js
 
 
 
-// To make sure Apollo Client doesn't create more than one React context
-// (which can lead to problems like having an Apollo Client instance added
-// in one context, then attempting to retrieve it from another different
-// context), a single Apollo context is created and tracked in global state.
-var contextKey = canUseSymbol ? Symbol.for("__APOLLO_CONTEXT__") : "__APOLLO_CONTEXT__";
-function getApolloContext() {
-    invariantWrappers_invariant( true, 45);
-    var context = react.createContext[contextKey];
-    if (!context) {
-        Object.defineProperty(react.createContext, contextKey, {
-            value: (context = react.createContext({})),
-            enumerable: false,
-            writable: false,
-            configurable: true,
-        });
-        context.displayName = "ApolloContext";
-    }
-    return context;
-}
-/**
- * @deprecated This function has no "resetting" effect since Apollo Client 3.4.12,
- * and will be removed in the next major version of Apollo Client.
- * If you want to get the Apollo Context, use `getApolloContext` instead.
- */
-var resetApolloContext = getApolloContext;
-//# sourceMappingURL=ApolloContext.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/context/ApolloProvider.js
-
-
-
-
-var ApolloProvider = function (_a) {
-    var client = _a.client, children = _a.children;
-    var ApolloContext = getApolloContext();
-    var parentContext = react.useContext(ApolloContext);
-    var context = react.useMemo(function () {
-        return tslib_es6_assign(tslib_es6_assign({}, parentContext), { client: client || parentContext.client });
-    }, [parentContext, client]);
-    invariantWrappers_invariant(context.client, 46);
-    return (react.createElement(ApolloContext.Provider, { value: context }, children));
-};
-//# sourceMappingURL=ApolloProvider.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/context/ApolloConsumer.js
-
-
+function useMutation(mutation, options) {
+    var client = useApolloClient(options === null || options === void 0 ? void 0 : options.client);
+    verifyDocumentType(mutation, DocumentType.Mutation);
+    var _a = react.useState({
+        called: false,
+        loading: false,
+        client: client,
+    }), result = _a[0], setResult = _a[1];
+    var ref = react.useRef({
+        result: result,
+        mutationId: 0,
+        isMounted: true,
+        client: client,
+        mutation: mutation,
+        options: options,
+    });
+    // TODO: Trying to assign these in a useEffect or useLayoutEffect breaks
+    // higher-order components.
+    {
+        Object.assign(ref.current, { client: client, options: options, mutation: mutation });
+    }
+    var execute = react.useCallback(function (executeOptions) {
+        if (executeOptions === void 0) { executeOptions = {}; }
+        var _a = ref.current, options = _a.options, mutation = _a.mutation;
+        var baseOptions = tslib_es6_assign(tslib_es6_assign({}, options), { mutation: mutation });
+        var client = executeOptions.client || ref.current.client;
+        if (!ref.current.result.loading &&
+            !baseOptions.ignoreResults &&
+            ref.current.isMounted) {
+            setResult((ref.current.result = {
+                loading: true,
+                error: void 0,
+                data: void 0,
+                called: true,
+                client: client,
+            }));
+        }
+        var mutationId = ++ref.current.mutationId;
+        var clientOptions = mergeOptions(baseOptions, executeOptions);
+        return client
+            .mutate(clientOptions)
+            .then(function (response) {
+            var _a, _b;
+            var data = response.data, errors = response.errors;
+            var error = errors && errors.length > 0 ?
+                new ApolloError({ graphQLErrors: errors })
+                : void 0;
+            var onError = executeOptions.onError || ((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.onError);
+            if (error && onError) {
+                onError(error, clientOptions);
+            }
+            if (mutationId === ref.current.mutationId &&
+                !clientOptions.ignoreResults) {
+                var result_1 = {
+                    called: true,
+                    loading: false,
+                    data: data,
+                    error: error,
+                    client: client,
+                };
+                if (ref.current.isMounted && !equal(ref.current.result, result_1)) {
+                    setResult((ref.current.result = result_1));
+                }
+            }
+            var onCompleted = executeOptions.onCompleted || ((_b = ref.current.options) === null || _b === void 0 ? void 0 : _b.onCompleted);
+            if (!error) {
+                onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(response.data, clientOptions);
+            }
+            return response;
+        })
+            .catch(function (error) {
+            var _a;
+            if (mutationId === ref.current.mutationId && ref.current.isMounted) {
+                var result_2 = {
+                    loading: false,
+                    error: error,
+                    data: void 0,
+                    called: true,
+                    client: client,
+                };
+                if (!equal(ref.current.result, result_2)) {
+                    setResult((ref.current.result = result_2));
+                }
+            }
+            var onError = executeOptions.onError || ((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.onError);
+            if (onError) {
+                onError(error, clientOptions);
+                // TODO(brian): why are we returning this here???
+                return { data: void 0, errors: error };
+            }
+            throw error;
+        });
+    }, []);
+    var reset = react.useCallback(function () {
+        if (ref.current.isMounted) {
+            var result_3 = { called: false, loading: false, client: client };
+            Object.assign(ref.current, { mutationId: 0, result: result_3 });
+            setResult(result_3);
+        }
+    }, []);
+    react.useEffect(function () {
+        ref.current.isMounted = true;
+        return function () {
+            ref.current.isMounted = false;
+        };
+    }, []);
+    return [execute, tslib_es6_assign({ reset: reset }, result)];
+}
+//# sourceMappingURL=useMutation.js.map
+;// CONCATENATED MODULE: ./src/js/hooks/mutations/useSetRandomProjectColor.tsx
 
-var ApolloConsumer = function (props) {
-    var ApolloContext = getApolloContext();
-    return (react.createElement(ApolloContext.Consumer, null, function (context) {
-        invariantWrappers_invariant(context && context.client, 44);
-        return props.children(context.client);
-    }));
+const GQL = gql `
+  mutation SetRandomProjectColor($projectId: Int!) {
+    setRandomProjectColor(projectId: $projectId) {
+      project {
+        id
+        color
+      }
+      errors
+    }
+  }
+`;
+function useSetRandomProjectColor() {
+    const [setRandomProjectColor] = useMutation(GQL);
+    return ({ variables }) => {
+        return setRandomProjectColor({
+            variables,
+            update(cache, { data }) {
+                const project = data.project;
+                modify(cache, project);
+            },
+        });
+    };
+}
+const modify = (cache, project) => {
+    cache.modify({
+        id: cache.identify(project),
+        fields: {
+            projects(existingProjects = []) {
+                cache.writeFragment({
+                    id: cache.identify(project),
+                    data: { project },
+                    fragment: gql `
+            fragment P on Project {
+              color
+            }
+          `,
+                });
+                return [...existingProjects, project];
+            },
+        },
+    });
 };
-//# sourceMappingURL=ApolloConsumer.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useApolloClient.js
-
-
 
-function useApolloClient(override) {
-    var context = react.useContext(getApolloContext());
-    var client = override || context.client;
-    invariantWrappers_invariant(!!client, 49);
-    return client;
-}
-//# sourceMappingURL=useApolloClient.js.map
 ;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useSyncExternalStore.js
 
 
@@ -17480,129 +17281,30 @@ function checkIfSnapshotChanged(_a) {
     }
 }
 //# sourceMappingURL=useSyncExternalStore.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/parser/index.js
+;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useQuery.js
 
-var DocumentType;
-(function (DocumentType) {
-    DocumentType[DocumentType["Query"] = 0] = "Query";
-    DocumentType[DocumentType["Mutation"] = 1] = "Mutation";
-    DocumentType[DocumentType["Subscription"] = 2] = "Subscription";
-})(DocumentType || (DocumentType = {}));
-var cache = new Map();
-function operationName(type) {
-    var name;
-    switch (type) {
-        case DocumentType.Query:
-            name = "Query";
-            break;
-        case DocumentType.Mutation:
-            name = "Mutation";
-            break;
-        case DocumentType.Subscription:
-            name = "Subscription";
-            break;
-    }
-    return name;
+
+
+
+
+
+
+
+
+
+
+
+var useQuery_hasOwnProperty = Object.prototype.hasOwnProperty;
+function useQuery(query, options) {
+    if (options === void 0) { options = Object.create(null); }
+    return useInternalState(useApolloClient(options.client), query).useQuery(options);
 }
-// This parser is mostly used to safety check incoming documents.
-function parser(document) {
-    var cached = cache.get(document);
-    if (cached)
-        return cached;
-    var variables, type, name;
-    invariantWrappers_invariant(!!document && !!document.kind, 59, document);
-    var fragments = [];
-    var queries = [];
-    var mutations = [];
-    var subscriptions = [];
-    for (var _i = 0, _a = document.definitions; _i < _a.length; _i++) {
-        var x = _a[_i];
-        if (x.kind === "FragmentDefinition") {
-            fragments.push(x);
-            continue;
-        }
-        if (x.kind === "OperationDefinition") {
-            switch (x.operation) {
-                case "query":
-                    queries.push(x);
-                    break;
-                case "mutation":
-                    mutations.push(x);
-                    break;
-                case "subscription":
-                    subscriptions.push(x);
-                    break;
-            }
-        }
-    }
-    invariantWrappers_invariant(!fragments.length ||
-        queries.length ||
-        mutations.length ||
-        subscriptions.length, 60);
-    invariantWrappers_invariant(
-        queries.length + mutations.length + subscriptions.length <= 1,
-        61,
-        document,
-        queries.length,
-        subscriptions.length,
-        mutations.length
-    );
-    type = queries.length ? DocumentType.Query : DocumentType.Mutation;
-    if (!queries.length && !mutations.length)
-        type = DocumentType.Subscription;
-    var definitions = queries.length ? queries
-        : mutations.length ? mutations
-            : subscriptions;
-    invariantWrappers_invariant(definitions.length === 1, 62, document, definitions.length);
-    var definition = definitions[0];
-    variables = definition.variableDefinitions || [];
-    if (definition.name && definition.name.kind === "Name") {
-        name = definition.name.value;
-    }
-    else {
-        name = "data"; // fallback to using data if no name
-    }
-    var payload = { name: name, type: type, variables: variables };
-    cache.set(document, payload);
-    return payload;
-}
-function verifyDocumentType(document, type) {
-    var operation = parser(document);
-    var requiredOperationName = operationName(type);
-    var usedOperationName = operationName(operation.type);
-    invariantWrappers_invariant(
-        operation.type === type,
-        63,
-        requiredOperationName,
-        requiredOperationName,
-        usedOperationName
-    );
-}
-//# sourceMappingURL=index.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useQuery.js
-
-
-
-
-
-
-
-
-
-
-
-
-var useQuery_hasOwnProperty = Object.prototype.hasOwnProperty;
-function useQuery(query, options) {
-    if (options === void 0) { options = Object.create(null); }
-    return useInternalState(useApolloClient(options.client), query).useQuery(options);
-}
-function useInternalState(client, query) {
-    var stateRef = react.useRef();
-    if (!stateRef.current ||
-        client !== stateRef.current.client ||
-        query !== stateRef.current.query) {
-        stateRef.current = new InternalState(client, query, stateRef.current);
+function useInternalState(client, query) {
+    var stateRef = react.useRef();
+    if (!stateRef.current ||
+        client !== stateRef.current.client ||
+        query !== stateRef.current.query) {
+        stateRef.current = new InternalState(client, query, stateRef.current);
     }
     var state = stateRef.current;
     // By default, InternalState.prototype.forceUpdate is an empty function, but
@@ -17835,1290 +17537,395 @@ var InternalState = /** @class */ (function () {
     InternalState.prototype.getObsQueryOptions = function () {
         var toMerge = [];
         var globalDefaults = this.client.defaultOptions.watchQuery;
-        if (globalDefaults)
-            toMerge.push(globalDefaults);
-        if (this.queryHookOptions.defaultOptions) {
-            toMerge.push(this.queryHookOptions.defaultOptions);
-        }
-        // We use compact rather than mergeOptions for this part of the merge,
-        // because we want watchQueryOptions.variables (if defined) to replace
-        // this.observable.options.variables whole. This replacement allows
-        // removing variables by removing them from the variables input to
-        // useQuery. If the variables were always merged together (rather than
-        // replaced), there would be no way to remove existing variables.
-        // However, the variables from options.defaultOptions and globalDefaults
-        // (if provided) should be merged, to ensure individual defaulted
-        // variables always have values, if not otherwise defined in
-        // observable.options or watchQueryOptions.
-        toMerge.push(compact(this.observable && this.observable.options, this.watchQueryOptions));
-        return toMerge.reduce(mergeOptions);
-    };
-    // A function to massage options before passing them to ObservableQuery.
-    InternalState.prototype.createWatchQueryOptions = function (_a) {
-        var _b;
-        if (_a === void 0) { _a = {}; }
-        var skip = _a.skip, ssr = _a.ssr, onCompleted = _a.onCompleted, onError = _a.onError, defaultOptions = _a.defaultOptions, 
-        // The above options are useQuery-specific, so this ...otherOptions spread
-        // makes otherOptions almost a WatchQueryOptions object, except for the
-        // query property that we add below.
-        otherOptions = __rest(_a, ["skip", "ssr", "onCompleted", "onError", "defaultOptions"]);
-        // This Object.assign is safe because otherOptions is a fresh ...rest object
-        // that did not exist until just now, so modifications are still allowed.
-        var watchQueryOptions = Object.assign(otherOptions, { query: this.query });
-        if (this.renderPromises &&
-            (watchQueryOptions.fetchPolicy === "network-only" ||
-                watchQueryOptions.fetchPolicy === "cache-and-network")) {
-            // this behavior was added to react-apollo without explanation in this PR
-            // https://github.com/apollographql/react-apollo/pull/1579
-            watchQueryOptions.fetchPolicy = "cache-first";
-        }
-        if (!watchQueryOptions.variables) {
-            watchQueryOptions.variables = {};
-        }
-        if (skip) {
-            var _c = watchQueryOptions.fetchPolicy, fetchPolicy = _c === void 0 ? this.getDefaultFetchPolicy() : _c, _d = watchQueryOptions.initialFetchPolicy, initialFetchPolicy = _d === void 0 ? fetchPolicy : _d;
-            // When skipping, we set watchQueryOptions.fetchPolicy initially to
-            // "standby", but we also need/want to preserve the initial non-standby
-            // fetchPolicy that would have been used if not skipping.
-            Object.assign(watchQueryOptions, {
-                initialFetchPolicy: initialFetchPolicy,
-                fetchPolicy: "standby",
-            });
-        }
-        else if (!watchQueryOptions.fetchPolicy) {
-            watchQueryOptions.fetchPolicy =
-                ((_b = this.observable) === null || _b === void 0 ? void 0 : _b.options.initialFetchPolicy) ||
-                    this.getDefaultFetchPolicy();
-        }
-        return watchQueryOptions;
-    };
-    InternalState.prototype.getDefaultFetchPolicy = function () {
-        var _a, _b;
-        return (((_a = this.queryHookOptions.defaultOptions) === null || _a === void 0 ? void 0 : _a.fetchPolicy) ||
-            ((_b = this.client.defaultOptions.watchQuery) === null || _b === void 0 ? void 0 : _b.fetchPolicy) ||
-            "cache-first");
-    };
-    // Defining these methods as no-ops on the prototype allows us to call
-    // state.onCompleted and/or state.onError without worrying about whether a
-    // callback was provided.
-    InternalState.prototype.onCompleted = function (data) { };
-    InternalState.prototype.onError = function (error) { };
-    InternalState.prototype.useObservableQuery = function () {
-        // See if there is an existing observable that was used to fetch the same
-        // data and if so, use it instead since it will contain the proper queryId
-        // to fetch the result set. This is used during SSR.
-        var obsQuery = (this.observable =
-            (this.renderPromises &&
-                this.renderPromises.getSSRObservable(this.watchQueryOptions)) ||
-                this.observable || // Reuse this.observable if possible (and not SSR)
-                this.client.watchQuery(this.getObsQueryOptions()));
-        this.obsQueryFields = react.useMemo(function () { return ({
-            refetch: obsQuery.refetch.bind(obsQuery),
-            reobserve: obsQuery.reobserve.bind(obsQuery),
-            fetchMore: obsQuery.fetchMore.bind(obsQuery),
-            updateQuery: obsQuery.updateQuery.bind(obsQuery),
-            startPolling: obsQuery.startPolling.bind(obsQuery),
-            stopPolling: obsQuery.stopPolling.bind(obsQuery),
-            subscribeToMore: obsQuery.subscribeToMore.bind(obsQuery),
-        }); }, [obsQuery]);
-        var ssrAllowed = !(this.queryHookOptions.ssr === false || this.queryHookOptions.skip);
-        if (this.renderPromises && ssrAllowed) {
-            this.renderPromises.registerSSRObservable(obsQuery);
-            if (obsQuery.getCurrentResult().loading) {
-                // TODO: This is a legacy API which could probably be cleaned up
-                this.renderPromises.addObservableQueryPromise(obsQuery);
-            }
-        }
-        return obsQuery;
-    };
-    InternalState.prototype.setResult = function (nextResult) {
-        var previousResult = this.result;
-        if (previousResult && previousResult.data) {
-            this.previousData = previousResult.data;
-        }
-        this.result = nextResult;
-        // Calling state.setResult always triggers an update, though some call sites
-        // perform additional equality checks before committing to an update.
-        this.forceUpdate();
-        this.handleErrorOrCompleted(nextResult, previousResult);
-    };
-    InternalState.prototype.handleErrorOrCompleted = function (result, previousResult) {
-        var _this = this;
-        if (!result.loading) {
-            var error_1 = this.toApolloError(result);
-            // wait a tick in case we are in the middle of rendering a component
-            Promise.resolve()
-                .then(function () {
-                if (error_1) {
-                    _this.onError(error_1);
-                }
-                else if (result.data &&
-                    (previousResult === null || previousResult === void 0 ? void 0 : previousResult.networkStatus) !== result.networkStatus &&
-                    result.networkStatus === NetworkStatus.ready) {
-                    _this.onCompleted(result.data);
-                }
-            })
-                .catch(function (error) {
-                globalThis.__DEV__ !== false && invariantWrappers_invariant.warn(error);
-            });
-        }
-    };
-    InternalState.prototype.toApolloError = function (result) {
-        return isNonEmptyArray(result.errors) ?
-            new ApolloError({ graphQLErrors: result.errors })
-            : result.error;
-    };
-    InternalState.prototype.getCurrentResult = function () {
-        // Using this.result as a cache ensures getCurrentResult continues returning
-        // the same (===) result object, unless state.setResult has been called, or
-        // we're doing server rendering and therefore override the result below.
-        if (!this.result) {
-            this.handleErrorOrCompleted((this.result = this.observable.getCurrentResult()));
-        }
-        return this.result;
-    };
-    InternalState.prototype.toQueryResult = function (result) {
-        var queryResult = this.toQueryResultCache.get(result);
-        if (queryResult)
-            return queryResult;
-        var data = result.data, partial = result.partial, resultWithoutPartial = __rest(result, ["data", "partial"]);
-        this.toQueryResultCache.set(result, (queryResult = tslib_es6_assign(tslib_es6_assign(tslib_es6_assign({ data: data }, resultWithoutPartial), this.obsQueryFields), { client: this.client, observable: this.observable, variables: this.observable.variables, called: !this.queryHookOptions.skip, previousData: this.previousData })));
-        if (!queryResult.error && isNonEmptyArray(result.errors)) {
-            // Until a set naming convention for networkError and graphQLErrors is
-            // decided upon, we map errors (graphQLErrors) to the error options.
-            // TODO: Is it possible for both result.error and result.errors to be
-            // defined here?
-            queryResult.error = new ApolloError({ graphQLErrors: result.errors });
-        }
-        return queryResult;
-    };
-    InternalState.prototype.unsafeHandlePartialRefetch = function (result) {
-        // WARNING: SIDE-EFFECTS IN THE RENDER FUNCTION
-        //
-        // TODO: This code should be removed when the partialRefetch option is
-        // removed. I was unable to get this hook to behave reasonably in certain
-        // edge cases when this block was put in an effect.
-        if (result.partial &&
-            this.queryHookOptions.partialRefetch &&
-            !result.loading &&
-            (!result.data || Object.keys(result.data).length === 0) &&
-            this.observable.options.fetchPolicy !== "cache-only") {
-            Object.assign(result, {
-                loading: true,
-                networkStatus: NetworkStatus.refetch,
-            });
-            this.observable.refetch();
-        }
-    };
-    return InternalState;
-}());
-//# sourceMappingURL=useQuery.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useLazyQuery.js
-
-
-
-
-
-// The following methods, when called will execute the query, regardless of
-// whether the useLazyQuery execute function was called before.
-var EAGER_METHODS = [
-    "refetch",
-    "reobserve",
-    "fetchMore",
-    "updateQuery",
-    "startPolling",
-    "subscribeToMore",
-];
-function useLazyQuery(query, options) {
-    var _a;
-    var execOptionsRef = react.useRef();
-    var optionsRef = react.useRef();
-    var queryRef = react.useRef();
-    var merged = mergeOptions(options, execOptionsRef.current || {});
-    var document = (_a = merged === null || merged === void 0 ? void 0 : merged.query) !== null && _a !== void 0 ? _a : query;
-    // Use refs to track options and the used query to ensure the `execute`
-    // function remains referentially stable between renders.
-    optionsRef.current = merged;
-    queryRef.current = document;
-    var internalState = useInternalState(useApolloClient(options && options.client), document);
-    var useQueryResult = internalState.useQuery(tslib_es6_assign(tslib_es6_assign({}, merged), { skip: !execOptionsRef.current }));
-    var initialFetchPolicy = useQueryResult.observable.options.initialFetchPolicy ||
-        internalState.getDefaultFetchPolicy();
-    var result = Object.assign(useQueryResult, {
-        called: !!execOptionsRef.current,
-    });
-    // We use useMemo here to make sure the eager methods have a stable identity.
-    var eagerMethods = react.useMemo(function () {
-        var eagerMethods = {};
-        var _loop_1 = function (key) {
-            var method = result[key];
-            eagerMethods[key] = function () {
-                if (!execOptionsRef.current) {
-                    execOptionsRef.current = Object.create(null);
-                    // Only the first time populating execOptionsRef.current matters here.
-                    internalState.forceUpdateState();
-                }
-                // @ts-expect-error this is just too generic to type
-                return method.apply(this, arguments);
-            };
-        };
-        for (var _i = 0, EAGER_METHODS_1 = EAGER_METHODS; _i < EAGER_METHODS_1.length; _i++) {
-            var key = EAGER_METHODS_1[_i];
-            _loop_1(key);
-        }
-        return eagerMethods;
-    }, []);
-    Object.assign(result, eagerMethods);
-    var execute = react.useCallback(function (executeOptions) {
-        execOptionsRef.current =
-            executeOptions ? tslib_es6_assign(tslib_es6_assign({}, executeOptions), { fetchPolicy: executeOptions.fetchPolicy || initialFetchPolicy }) : {
-                fetchPolicy: initialFetchPolicy,
-            };
-        var options = mergeOptions(optionsRef.current, tslib_es6_assign({ query: queryRef.current }, execOptionsRef.current));
-        var promise = internalState
-            .executeQuery(tslib_es6_assign(tslib_es6_assign({}, options), { skip: false }))
-            .then(function (queryResult) { return Object.assign(queryResult, eagerMethods); });
-        // Because the return value of `useLazyQuery` is usually floated, we need
-        // to catch the promise to prevent unhandled rejections.
-        promise.catch(function () { });
-        return promise;
-    }, []);
-    return [execute, result];
-}
-//# sourceMappingURL=useLazyQuery.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useMutation.js
-
-
-
-
-
-
-
-function useMutation(mutation, options) {
-    var client = useApolloClient(options === null || options === void 0 ? void 0 : options.client);
-    verifyDocumentType(mutation, DocumentType.Mutation);
-    var _a = react.useState({
-        called: false,
-        loading: false,
-        client: client,
-    }), result = _a[0], setResult = _a[1];
-    var ref = react.useRef({
-        result: result,
-        mutationId: 0,
-        isMounted: true,
-        client: client,
-        mutation: mutation,
-        options: options,
-    });
-    // TODO: Trying to assign these in a useEffect or useLayoutEffect breaks
-    // higher-order components.
-    {
-        Object.assign(ref.current, { client: client, options: options, mutation: mutation });
-    }
-    var execute = react.useCallback(function (executeOptions) {
-        if (executeOptions === void 0) { executeOptions = {}; }
-        var _a = ref.current, options = _a.options, mutation = _a.mutation;
-        var baseOptions = tslib_es6_assign(tslib_es6_assign({}, options), { mutation: mutation });
-        var client = executeOptions.client || ref.current.client;
-        if (!ref.current.result.loading &&
-            !baseOptions.ignoreResults &&
-            ref.current.isMounted) {
-            setResult((ref.current.result = {
-                loading: true,
-                error: void 0,
-                data: void 0,
-                called: true,
-                client: client,
-            }));
-        }
-        var mutationId = ++ref.current.mutationId;
-        var clientOptions = mergeOptions(baseOptions, executeOptions);
-        return client
-            .mutate(clientOptions)
-            .then(function (response) {
-            var _a, _b;
-            var data = response.data, errors = response.errors;
-            var error = errors && errors.length > 0 ?
-                new ApolloError({ graphQLErrors: errors })
-                : void 0;
-            var onError = executeOptions.onError || ((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.onError);
-            if (error && onError) {
-                onError(error, clientOptions);
-            }
-            if (mutationId === ref.current.mutationId &&
-                !clientOptions.ignoreResults) {
-                var result_1 = {
-                    called: true,
-                    loading: false,
-                    data: data,
-                    error: error,
-                    client: client,
-                };
-                if (ref.current.isMounted && !equal(ref.current.result, result_1)) {
-                    setResult((ref.current.result = result_1));
-                }
-            }
-            var onCompleted = executeOptions.onCompleted || ((_b = ref.current.options) === null || _b === void 0 ? void 0 : _b.onCompleted);
-            if (!error) {
-                onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(response.data, clientOptions);
-            }
-            return response;
-        })
-            .catch(function (error) {
-            var _a;
-            if (mutationId === ref.current.mutationId && ref.current.isMounted) {
-                var result_2 = {
-                    loading: false,
-                    error: error,
-                    data: void 0,
-                    called: true,
-                    client: client,
-                };
-                if (!equal(ref.current.result, result_2)) {
-                    setResult((ref.current.result = result_2));
-                }
-            }
-            var onError = executeOptions.onError || ((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.onError);
-            if (onError) {
-                onError(error, clientOptions);
-                // TODO(brian): why are we returning this here???
-                return { data: void 0, errors: error };
-            }
-            throw error;
-        });
-    }, []);
-    var reset = react.useCallback(function () {
-        if (ref.current.isMounted) {
-            var result_3 = { called: false, loading: false, client: client };
-            Object.assign(ref.current, { mutationId: 0, result: result_3 });
-            setResult(result_3);
-        }
-    }, []);
-    react.useEffect(function () {
-        ref.current.isMounted = true;
-        return function () {
-            ref.current.isMounted = false;
-        };
-    }, []);
-    return [execute, tslib_es6_assign({ reset: reset }, result)];
-}
-//# sourceMappingURL=useMutation.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useSubscription.js
-
-
-
-
-
-function useSubscription(subscription, options) {
-    var hasIssuedDeprecationWarningRef = react.useRef(false);
-    var client = useApolloClient(options === null || options === void 0 ? void 0 : options.client);
-    verifyDocumentType(subscription, DocumentType.Subscription);
-    var _a = react.useState({
-        loading: !(options === null || options === void 0 ? void 0 : options.skip),
-        error: void 0,
-        data: void 0,
-        variables: options === null || options === void 0 ? void 0 : options.variables,
-    }), result = _a[0], setResult = _a[1];
-    if (!hasIssuedDeprecationWarningRef.current) {
-        hasIssuedDeprecationWarningRef.current = true;
-        if (options === null || options === void 0 ? void 0 : options.onSubscriptionData) {
-            globalThis.__DEV__ !== false && invariantWrappers_invariant.warn(options.onData ? 52 : 53);
-        }
-        if (options === null || options === void 0 ? void 0 : options.onSubscriptionComplete) {
-            globalThis.__DEV__ !== false && invariantWrappers_invariant.warn(options.onComplete ? 54 : 55);
-        }
-    }
-    var _b = react.useState(function () {
-        if (options === null || options === void 0 ? void 0 : options.skip) {
-            return null;
-        }
-        return client.subscribe({
-            query: subscription,
-            variables: options === null || options === void 0 ? void 0 : options.variables,
-            fetchPolicy: options === null || options === void 0 ? void 0 : options.fetchPolicy,
-            context: options === null || options === void 0 ? void 0 : options.context,
-        });
-    }), observable = _b[0], setObservable = _b[1];
-    var canResetObservableRef = react.useRef(false);
-    react.useEffect(function () {
-        return function () {
-            canResetObservableRef.current = true;
-        };
-    }, []);
-    var ref = react.useRef({ client: client, subscription: subscription, options: options });
-    react.useEffect(function () {
-        var _a, _b, _c, _d;
-        var shouldResubscribe = options === null || options === void 0 ? void 0 : options.shouldResubscribe;
-        if (typeof shouldResubscribe === "function") {
-            shouldResubscribe = !!shouldResubscribe(options);
-        }
-        if (options === null || options === void 0 ? void 0 : options.skip) {
-            if (!(options === null || options === void 0 ? void 0 : options.skip) !== !((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.skip) ||
-                canResetObservableRef.current) {
-                setResult({
-                    loading: false,
-                    data: void 0,
-                    error: void 0,
-                    variables: options === null || options === void 0 ? void 0 : options.variables,
-                });
-                setObservable(null);
-                canResetObservableRef.current = false;
-            }
-        }
-        else if ((shouldResubscribe !== false &&
-            (client !== ref.current.client ||
-                subscription !== ref.current.subscription ||
-                (options === null || options === void 0 ? void 0 : options.fetchPolicy) !== ((_b = ref.current.options) === null || _b === void 0 ? void 0 : _b.fetchPolicy) ||
-                !(options === null || options === void 0 ? void 0 : options.skip) !== !((_c = ref.current.options) === null || _c === void 0 ? void 0 : _c.skip) ||
-                !equal(options === null || options === void 0 ? void 0 : options.variables, (_d = ref.current.options) === null || _d === void 0 ? void 0 : _d.variables))) ||
-            canResetObservableRef.current) {
-            setResult({
-                loading: true,
-                data: void 0,
-                error: void 0,
-                variables: options === null || options === void 0 ? void 0 : options.variables,
-            });
-            setObservable(client.subscribe({
-                query: subscription,
-                variables: options === null || options === void 0 ? void 0 : options.variables,
-                fetchPolicy: options === null || options === void 0 ? void 0 : options.fetchPolicy,
-                context: options === null || options === void 0 ? void 0 : options.context,
-            }));
-            canResetObservableRef.current = false;
-        }
-        Object.assign(ref.current, { client: client, subscription: subscription, options: options });
-    }, [client, subscription, options, canResetObservableRef.current]);
-    react.useEffect(function () {
-        if (!observable) {
-            return;
-        }
-        var subscriptionStopped = false;
-        var subscription = observable.subscribe({
-            next: function (fetchResult) {
-                var _a, _b;
-                if (subscriptionStopped) {
-                    return;
-                }
-                var result = {
-                    loading: false,
-                    // TODO: fetchResult.data can be null but SubscriptionResult.data
-                    // expects TData | undefined only
-                    data: fetchResult.data,
-                    error: void 0,
-                    variables: options === null || options === void 0 ? void 0 : options.variables,
-                };
-                setResult(result);
-                if ((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.onData) {
-                    ref.current.options.onData({
-                        client: client,
-                        data: result,
-                    });
-                }
-                else if ((_b = ref.current.options) === null || _b === void 0 ? void 0 : _b.onSubscriptionData) {
-                    ref.current.options.onSubscriptionData({
-                        client: client,
-                        subscriptionData: result,
-                    });
-                }
-            },
-            error: function (error) {
-                var _a, _b;
-                if (!subscriptionStopped) {
-                    setResult({
-                        loading: false,
-                        data: void 0,
-                        error: error,
-                        variables: options === null || options === void 0 ? void 0 : options.variables,
-                    });
-                    (_b = (_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.onError) === null || _b === void 0 ? void 0 : _b.call(_a, error);
-                }
-            },
-            complete: function () {
-                var _a, _b;
-                if (!subscriptionStopped) {
-                    if ((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.onComplete) {
-                        ref.current.options.onComplete();
-                    }
-                    else if ((_b = ref.current.options) === null || _b === void 0 ? void 0 : _b.onSubscriptionComplete) {
-                        ref.current.options.onSubscriptionComplete();
-                    }
-                }
-            },
-        });
-        return function () {
-            // immediately stop receiving subscription values, but do not unsubscribe
-            // until after a short delay in case another useSubscription hook is
-            // reusing the same underlying observable and is about to subscribe
-            subscriptionStopped = true;
-            setTimeout(function () {
-                subscription.unsubscribe();
-            });
-        };
-    }, [observable]);
-    return result;
-}
-//# sourceMappingURL=useSubscription.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useReactiveVar.js
-
-
-function useReactiveVar(rv) {
-    return useSyncExternalStore(react.useCallback(function (update) {
-        // By reusing the same onNext function in the nested call to
-        // rv.onNextChange(onNext), we can keep using the initial clean-up function
-        // returned by rv.onNextChange(function onNext(v){...}), without having to
-        // register the new clean-up function (returned by the nested
-        // rv.onNextChange(onNext)) with yet another callback.
-        return rv.onNextChange(function onNext() {
-            update();
-            rv.onNextChange(onNext);
-        });
-    }, [rv]), rv, rv);
-}
-//# sourceMappingURL=useReactiveVar.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/internal/useDeepMemo.js
-
-
-function useDeepMemo(memoFn, deps) {
-    var ref = react.useRef();
-    if (!ref.current || !equal(ref.current.deps, deps)) {
-        ref.current = { value: memoFn(), deps: deps };
-    }
-    return ref.current.value;
-}
-//# sourceMappingURL=useDeepMemo.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/internal/useLazyRef.js
-
-var INIT = {};
-function useLazyRef(getInitialValue) {
-    var ref = react.useRef(INIT);
-    if (ref.current === INIT) {
-        ref.current = getInitialValue();
-    }
-    return ref;
-}
-//# sourceMappingURL=useLazyRef.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useFragment.js
-
-
-
-
-
-
-
-function useFragment(options) {
-    var cache = useApolloClient().cache;
-    var diffOptions = useDeepMemo(function () {
-        var fragment = options.fragment, fragmentName = options.fragmentName, from = options.from, _a = options.optimistic, optimistic = _a === void 0 ? true : _a, rest = __rest(options, ["fragment", "fragmentName", "from", "optimistic"]);
-        return tslib_es6_assign(tslib_es6_assign({}, rest), { returnPartialData: true, id: typeof from === "string" ? from : cache.identify(from), query: cache["getFragmentDoc"](fragment, fragmentName), optimistic: optimistic });
-    }, [options]);
-    var resultRef = useLazyRef(function () {
-        return diffToResult(cache.diff(diffOptions));
-    });
-    // Used for both getSnapshot and getServerSnapshot
-    var getSnapshot = react.useCallback(function () { return resultRef.current; }, []);
-    return useSyncExternalStore(react.useCallback(function (forceUpdate) {
-        var lastTimeout = 0;
-        var unsubscribe = cache.watch(tslib_es6_assign(tslib_es6_assign({}, diffOptions), { immediate: true, callback: function (diff) {
-                if (!equal(diff.result, resultRef.current.data)) {
-                    resultRef.current = diffToResult(diff);
-                    // If we get another update before we've re-rendered, bail out of
-                    // the update and try again. This ensures that the relative timing
-                    // between useQuery and useFragment stays roughly the same as
-                    // fixed in https://github.com/apollographql/apollo-client/pull/11083
-                    clearTimeout(lastTimeout);
-                    lastTimeout = setTimeout(forceUpdate);
-                }
-            } }));
-        return function () {
-            unsubscribe();
-            clearTimeout(lastTimeout);
-        };
-    }, [cache, diffOptions]), getSnapshot, getSnapshot);
-}
-function diffToResult(diff) {
-    var result = {
-        data: diff.result,
-        complete: !!diff.complete,
-    };
-    if (diff.missing) {
-        result.missing = mergeDeepArray(diff.missing.map(function (error) { return error.missing; }));
-    }
-    return result;
-}
-//# sourceMappingURL=useFragment.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/utilities/promises/decoration.js
-function createFulfilledPromise(value) {
-    var promise = Promise.resolve(value);
-    promise.status = "fulfilled";
-    promise.value = value;
-    return promise;
-}
-function createRejectedPromise(reason) {
-    var promise = Promise.reject(reason);
-    // prevent potential edge cases leaking unhandled error rejections
-    promise.catch(function () { });
-    promise.status = "rejected";
-    promise.reason = reason;
-    return promise;
-}
-function isStatefulPromise(promise) {
-    return "status" in promise;
-}
-function wrapPromiseWithState(promise) {
-    if (isStatefulPromise(promise)) {
-        return promise;
-    }
-    var pendingPromise = promise;
-    pendingPromise.status = "pending";
-    pendingPromise.then(function (value) {
-        if (pendingPromise.status === "pending") {
-            var fulfilledPromise = pendingPromise;
-            fulfilledPromise.status = "fulfilled";
-            fulfilledPromise.value = value;
-        }
-    }, function (reason) {
-        if (pendingPromise.status === "pending") {
-            var rejectedPromise = pendingPromise;
-            rejectedPromise.status = "rejected";
-            rejectedPromise.reason = reason;
-        }
-    });
-    return promise;
-}
-//# sourceMappingURL=decoration.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/internal/__use.js
-
-
-// Prevent webpack from complaining about our feature detection of the
-// use property of the React namespace, which is expected not
-// to exist when using current stable versions, and that's fine.
-var useKey = "use";
-var _use_realHook = react_namespaceObject[useKey];
-// This is named with two underscores to allow this hook to evade typical rules of
-// hooks (i.e. it can be used conditionally)
-var __use = _use_realHook ||
-    function __use(promise) {
-        var statefulPromise = wrapPromiseWithState(promise);
-        switch (statefulPromise.status) {
-            case "pending":
-                throw statefulPromise;
-            case "rejected":
-                throw statefulPromise.reason;
-            case "fulfilled":
-                return statefulPromise.value;
+        if (globalDefaults)
+            toMerge.push(globalDefaults);
+        if (this.queryHookOptions.defaultOptions) {
+            toMerge.push(this.queryHookOptions.defaultOptions);
         }
+        // We use compact rather than mergeOptions for this part of the merge,
+        // because we want watchQueryOptions.variables (if defined) to replace
+        // this.observable.options.variables whole. This replacement allows
+        // removing variables by removing them from the variables input to
+        // useQuery. If the variables were always merged together (rather than
+        // replaced), there would be no way to remove existing variables.
+        // However, the variables from options.defaultOptions and globalDefaults
+        // (if provided) should be merged, to ensure individual defaulted
+        // variables always have values, if not otherwise defined in
+        // observable.options or watchQueryOptions.
+        toMerge.push(compact(this.observable && this.observable.options, this.watchQueryOptions));
+        return toMerge.reduce(mergeOptions);
     };
-//# sourceMappingURL=__use.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/cache/QueryReference.js
-
-
-
-
-var QUERY_REFERENCE_SYMBOL = Symbol();
-function wrapQueryRef(internalQueryRef) {
-    var _a;
-    return _a = {}, _a[QUERY_REFERENCE_SYMBOL] = internalQueryRef, _a;
-}
-function unwrapQueryRef(queryRef) {
-    return queryRef[QUERY_REFERENCE_SYMBOL];
-}
-var OBSERVED_CHANGED_OPTIONS = [
-    "canonizeResults",
-    "context",
-    "errorPolicy",
-    "fetchPolicy",
-    "refetchWritePolicy",
-    "returnPartialData",
-];
-var InternalQueryReference = /** @class */ (function () {
-    function InternalQueryReference(observable, options) {
-        var _this = this;
-        this.listeners = new Set();
-        this.status = "loading";
-        this.references = 0;
-        this.handleNext = this.handleNext.bind(this);
-        this.handleError = this.handleError.bind(this);
-        this.dispose = this.dispose.bind(this);
-        this.observable = observable;
-        // Don't save this result as last result to prevent delivery of last result
-        // when first subscribing
-        this.result = observable.getCurrentResult(false);
-        this.key = options.key;
-        if (options.onDispose) {
-            this.onDispose = options.onDispose;
-        }
-        if (isNetworkRequestSettled(this.result.networkStatus) ||
-            (this.result.data &&
-                (!this.result.partial || this.watchQueryOptions.returnPartialData))) {
-            this.promise = createFulfilledPromise(this.result);
-            this.status = "idle";
+    // A function to massage options before passing them to ObservableQuery.
+    InternalState.prototype.createWatchQueryOptions = function (_a) {
+        var _b;
+        if (_a === void 0) { _a = {}; }
+        var skip = _a.skip, ssr = _a.ssr, onCompleted = _a.onCompleted, onError = _a.onError, defaultOptions = _a.defaultOptions, 
+        // The above options are useQuery-specific, so this ...otherOptions spread
+        // makes otherOptions almost a WatchQueryOptions object, except for the
+        // query property that we add below.
+        otherOptions = __rest(_a, ["skip", "ssr", "onCompleted", "onError", "defaultOptions"]);
+        // This Object.assign is safe because otherOptions is a fresh ...rest object
+        // that did not exist until just now, so modifications are still allowed.
+        var watchQueryOptions = Object.assign(otherOptions, { query: this.query });
+        if (this.renderPromises &&
+            (watchQueryOptions.fetchPolicy === "network-only" ||
+                watchQueryOptions.fetchPolicy === "cache-and-network")) {
+            // this behavior was added to react-apollo without explanation in this PR
+            // https://github.com/apollographql/react-apollo/pull/1579
+            watchQueryOptions.fetchPolicy = "cache-first";
         }
-        else {
-            this.promise = new Promise(function (resolve, reject) {
-                _this.resolve = resolve;
-                _this.reject = reject;
-            });
+        if (!watchQueryOptions.variables) {
+            watchQueryOptions.variables = {};
         }
-        this.subscription = observable
-            .filter(function (_a) {
-            var data = _a.data;
-            return !equal(data, {});
-        })
-            .subscribe({
-            next: this.handleNext,
-            error: this.handleError,
-        });
-        // Start a timer that will automatically dispose of the query if the
-        // suspended resource does not use this queryRef in the given time. This
-        // helps prevent memory leaks when a component has unmounted before the
-        // query has finished loading.
-        var startDisposeTimer = function () {
-            var _a;
-            if (!_this.references) {
-                _this.autoDisposeTimeoutId = setTimeout(_this.dispose, (_a = options.autoDisposeTimeoutMs) !== null && _a !== void 0 ? _a : 30000);
-            }
-        };
-        // We wait until the request has settled to ensure we don't dispose of the
-        // query ref before the request finishes, otherwise we would leave the
-        // promise in a pending state rendering the suspense boundary indefinitely.
-        this.promise.then(startDisposeTimer, startDisposeTimer);
-    }
-    Object.defineProperty(InternalQueryReference.prototype, "watchQueryOptions", {
-        get: function () {
-            return this.observable.options;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    InternalQueryReference.prototype.retain = function () {
-        var _this = this;
-        this.references++;
-        clearTimeout(this.autoDisposeTimeoutId);
-        var disposed = false;
-        return function () {
-            if (disposed) {
-                return;
-            }
-            disposed = true;
-            _this.references--;
-            // Wait before fully disposing in case the app is running in strict mode.
-            setTimeout(function () {
-                if (!_this.references) {
-                    _this.dispose();
-                }
+        if (skip) {
+            var _c = watchQueryOptions.fetchPolicy, fetchPolicy = _c === void 0 ? this.getDefaultFetchPolicy() : _c, _d = watchQueryOptions.initialFetchPolicy, initialFetchPolicy = _d === void 0 ? fetchPolicy : _d;
+            // When skipping, we set watchQueryOptions.fetchPolicy initially to
+            // "standby", but we also need/want to preserve the initial non-standby
+            // fetchPolicy that would have been used if not skipping.
+            Object.assign(watchQueryOptions, {
+                initialFetchPolicy: initialFetchPolicy,
+                fetchPolicy: "standby",
             });
-        };
+        }
+        else if (!watchQueryOptions.fetchPolicy) {
+            watchQueryOptions.fetchPolicy =
+                ((_b = this.observable) === null || _b === void 0 ? void 0 : _b.options.initialFetchPolicy) ||
+                    this.getDefaultFetchPolicy();
+        }
+        return watchQueryOptions;
     };
-    InternalQueryReference.prototype.didChangeOptions = function (watchQueryOptions) {
-        var _this = this;
-        return OBSERVED_CHANGED_OPTIONS.some(function (option) {
-            return !equal(_this.watchQueryOptions[option], watchQueryOptions[option]);
-        });
+    InternalState.prototype.getDefaultFetchPolicy = function () {
+        var _a, _b;
+        return (((_a = this.queryHookOptions.defaultOptions) === null || _a === void 0 ? void 0 : _a.fetchPolicy) ||
+            ((_b = this.client.defaultOptions.watchQuery) === null || _b === void 0 ? void 0 : _b.fetchPolicy) ||
+            "cache-first");
     };
-    InternalQueryReference.prototype.applyOptions = function (watchQueryOptions) {
-        var _a = this.watchQueryOptions, currentFetchPolicy = _a.fetchPolicy, currentCanonizeResults = _a.canonizeResults;
-        // "standby" is used when `skip` is set to `true`. Detect when we've
-        // enabled the query (i.e. `skip` is `false`) to execute a network request.
-        if (currentFetchPolicy === "standby" &&
-            currentFetchPolicy !== watchQueryOptions.fetchPolicy) {
-            this.initiateFetch(this.observable.reobserve(watchQueryOptions));
-        }
-        else {
-            this.observable.silentSetOptions(watchQueryOptions);
-            if (currentCanonizeResults !== watchQueryOptions.canonizeResults) {
-                this.result = tslib_es6_assign(tslib_es6_assign({}, this.result), this.observable.getCurrentResult());
-                this.promise = createFulfilledPromise(this.result);
+    // Defining these methods as no-ops on the prototype allows us to call
+    // state.onCompleted and/or state.onError without worrying about whether a
+    // callback was provided.
+    InternalState.prototype.onCompleted = function (data) { };
+    InternalState.prototype.onError = function (error) { };
+    InternalState.prototype.useObservableQuery = function () {
+        // See if there is an existing observable that was used to fetch the same
+        // data and if so, use it instead since it will contain the proper queryId
+        // to fetch the result set. This is used during SSR.
+        var obsQuery = (this.observable =
+            (this.renderPromises &&
+                this.renderPromises.getSSRObservable(this.watchQueryOptions)) ||
+                this.observable || // Reuse this.observable if possible (and not SSR)
+                this.client.watchQuery(this.getObsQueryOptions()));
+        this.obsQueryFields = react.useMemo(function () { return ({
+            refetch: obsQuery.refetch.bind(obsQuery),
+            reobserve: obsQuery.reobserve.bind(obsQuery),
+            fetchMore: obsQuery.fetchMore.bind(obsQuery),
+            updateQuery: obsQuery.updateQuery.bind(obsQuery),
+            startPolling: obsQuery.startPolling.bind(obsQuery),
+            stopPolling: obsQuery.stopPolling.bind(obsQuery),
+            subscribeToMore: obsQuery.subscribeToMore.bind(obsQuery),
+        }); }, [obsQuery]);
+        var ssrAllowed = !(this.queryHookOptions.ssr === false || this.queryHookOptions.skip);
+        if (this.renderPromises && ssrAllowed) {
+            this.renderPromises.registerSSRObservable(obsQuery);
+            if (obsQuery.getCurrentResult().loading) {
+                // TODO: This is a legacy API which could probably be cleaned up
+                this.renderPromises.addObservableQueryPromise(obsQuery);
             }
         }
-        return this.promise;
+        return obsQuery;
+    };
+    InternalState.prototype.setResult = function (nextResult) {
+        var previousResult = this.result;
+        if (previousResult && previousResult.data) {
+            this.previousData = previousResult.data;
+        }
+        this.result = nextResult;
+        // Calling state.setResult always triggers an update, though some call sites
+        // perform additional equality checks before committing to an update.
+        this.forceUpdate();
+        this.handleErrorOrCompleted(nextResult, previousResult);
     };
-    InternalQueryReference.prototype.listen = function (listener) {
+    InternalState.prototype.handleErrorOrCompleted = function (result, previousResult) {
         var _this = this;
-        this.listeners.add(listener);
-        return function () {
-            _this.listeners.delete(listener);
-        };
+        if (!result.loading) {
+            var error_1 = this.toApolloError(result);
+            // wait a tick in case we are in the middle of rendering a component
+            Promise.resolve()
+                .then(function () {
+                if (error_1) {
+                    _this.onError(error_1);
+                }
+                else if (result.data &&
+                    (previousResult === null || previousResult === void 0 ? void 0 : previousResult.networkStatus) !== result.networkStatus &&
+                    result.networkStatus === NetworkStatus.ready) {
+                    _this.onCompleted(result.data);
+                }
+            })
+                .catch(function (error) {
+                globalThis.__DEV__ !== false && invariantWrappers_invariant.warn(error);
+            });
+        }
     };
-    InternalQueryReference.prototype.refetch = function (variables) {
-        return this.initiateFetch(this.observable.refetch(variables));
+    InternalState.prototype.toApolloError = function (result) {
+        return isNonEmptyArray(result.errors) ?
+            new ApolloError({ graphQLErrors: result.errors })
+            : result.error;
     };
-    InternalQueryReference.prototype.fetchMore = function (options) {
-        return this.initiateFetch(this.observable.fetchMore(options));
+    InternalState.prototype.getCurrentResult = function () {
+        // Using this.result as a cache ensures getCurrentResult continues returning
+        // the same (===) result object, unless state.setResult has been called, or
+        // we're doing server rendering and therefore override the result below.
+        if (!this.result) {
+            this.handleErrorOrCompleted((this.result = this.observable.getCurrentResult()));
+        }
+        return this.result;
     };
-    InternalQueryReference.prototype.dispose = function () {
-        this.subscription.unsubscribe();
-        this.onDispose();
+    InternalState.prototype.toQueryResult = function (result) {
+        var queryResult = this.toQueryResultCache.get(result);
+        if (queryResult)
+            return queryResult;
+        var data = result.data, partial = result.partial, resultWithoutPartial = __rest(result, ["data", "partial"]);
+        this.toQueryResultCache.set(result, (queryResult = tslib_es6_assign(tslib_es6_assign(tslib_es6_assign({ data: data }, resultWithoutPartial), this.obsQueryFields), { client: this.client, observable: this.observable, variables: this.observable.variables, called: !this.queryHookOptions.skip, previousData: this.previousData })));
+        if (!queryResult.error && isNonEmptyArray(result.errors)) {
+            // Until a set naming convention for networkError and graphQLErrors is
+            // decided upon, we map errors (graphQLErrors) to the error options.
+            // TODO: Is it possible for both result.error and result.errors to be
+            // defined here?
+            queryResult.error = new ApolloError({ graphQLErrors: result.errors });
+        }
+        return queryResult;
     };
-    InternalQueryReference.prototype.onDispose = function () {
-        // noop. overridable by options
+    InternalState.prototype.unsafeHandlePartialRefetch = function (result) {
+        // WARNING: SIDE-EFFECTS IN THE RENDER FUNCTION
+        //
+        // TODO: This code should be removed when the partialRefetch option is
+        // removed. I was unable to get this hook to behave reasonably in certain
+        // edge cases when this block was put in an effect.
+        if (result.partial &&
+            this.queryHookOptions.partialRefetch &&
+            !result.loading &&
+            (!result.data || Object.keys(result.data).length === 0) &&
+            this.observable.options.fetchPolicy !== "cache-only") {
+            Object.assign(result, {
+                loading: true,
+                networkStatus: NetworkStatus.refetch,
+            });
+            this.observable.refetch();
+        }
     };
-    InternalQueryReference.prototype.handleNext = function (result) {
-        var _a;
-        switch (this.status) {
-            case "loading": {
-                // Maintain the last successful `data` value if the next result does not
-                // have one.
-                if (result.data === void 0) {
-                    result.data = this.result.data;
-                }
-                this.status = "idle";
-                this.result = result;
-                (_a = this.resolve) === null || _a === void 0 ? void 0 : _a.call(this, result);
-                break;
-            }
-            case "idle": {
-                // This occurs when switching to a result that is fully cached when this
-                // class is instantiated. ObservableQuery will run reobserve when
-                // subscribing, which delivers a result from the cache.
-                if (result.data === this.result.data) {
-                    return;
-                }
-                // Maintain the last successful `data` value if the next result does not
-                // have one.
-                if (result.data === void 0) {
-                    result.data = this.result.data;
-                }
-                this.result = result;
-                this.promise = createFulfilledPromise(result);
-                this.deliver(this.promise);
-                break;
-            }
+    return InternalState;
+}());
+//# sourceMappingURL=useQuery.js.map
+;// CONCATENATED MODULE: ./src/js/hooks/queries/useProjects.ts
+
+const useProjects_GQL = gql `
+  query Query {
+    projects {
+      id
+      name
+      path
+      color
+    }
+  }
+`;
+function useProjects() {
+    return useQuery(useProjects_GQL);
+}
+
+;// CONCATENATED MODULE: ./src/js/components/Select.tsx
+/* provided dependency */ var Select_React = __webpack_require__(294);
+
+const LI_CLASSNAME = [
+    "flex",
+    "align-items-center",
+    "w-3/4",
+    "hover-bg-secondary",
+    "p-3",
+    "mt-2",
+    "cursor-pointer",
+].join(" ");
+const ACTIVE_CLASSNAME = [
+    LI_CLASSNAME,
+    "rounded",
+    "border",
+    "border-solid",
+    "border-secondary",
+    "text-primary",
+    "bg-secondary"
+].join(" ");
+const Select = ({ onChange, options, selected, placeholder }) => {
+    const selectOptions = [{ label: placeholder, value: "" }, ...options];
+    const [isOpen, setIsOpen] = (0,react.useState)(false);
+    const [option, setOption] = (0,react.useState)(options.find(o => o.value === selected) || selectOptions[0]);
+    const onClick = (option) => {
+        if (isOpen) {
+            setOption(option);
+            setIsOpen(false);
+            onChange(option);
+        }
+        else {
+            setIsOpen(true);
         }
     };
-    InternalQueryReference.prototype.handleError = function (error) {
-        var _a;
-        this.subscription.unsubscribe();
-        this.subscription = this.observable.resubscribeAfterError(this.handleNext, this.handleError);
-        switch (this.status) {
-            case "loading": {
-                this.status = "idle";
-                (_a = this.reject) === null || _a === void 0 ? void 0 : _a.call(this, error);
-                break;
-            }
-            case "idle": {
-                this.promise = createRejectedPromise(error);
-                this.deliver(this.promise);
-            }
+    const getClassName = (o1, o2) => {
+        if (o1.value === o2.value) {
+            return ACTIVE_CLASSNAME;
+        }
+        else {
+            return (!isOpen && o1.value !== o2.value) ? "hidden" : LI_CLASSNAME;
         }
     };
-    InternalQueryReference.prototype.deliver = function (promise) {
-        this.listeners.forEach(function (listener) { return listener(promise); });
-    };
-    InternalQueryReference.prototype.initiateFetch = function (returnedPromise) {
-        var _this = this;
-        this.status = "loading";
-        this.promise = new Promise(function (resolve, reject) {
-            _this.resolve = resolve;
-            _this.reject = reject;
-        });
-        this.promise.catch(function () { });
-        // If the data returned from the fetch is deeply equal to the data already
-        // in the cache, `handleNext` will not be triggered leaving the promise we
-        // created in a pending state forever. To avoid this situtation, we attempt
-        // to resolve the promise if `handleNext` hasn't been run to ensure the
-        // promise is resolved correctly.
-        returnedPromise
-            .then(function (result) {
-            var _a;
-            if (_this.status === "loading") {
-                _this.status = "idle";
-                _this.result = result;
-                (_a = _this.resolve) === null || _a === void 0 ? void 0 : _a.call(_this, result);
+    (0,react.useEffect)(() => {
+        const onDocumentClick = () => {
+            if (isOpen) {
+                setIsOpen(false);
             }
-        })
-            .catch(function () { });
-        return returnedPromise;
-    };
-    return InternalQueryReference;
-}());
-
-//# sourceMappingURL=QueryReference.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/cache/SuspenseCache.js
-
-
+        };
+        document.body.addEventListener('click', onDocumentClick);
+        return () => document.body.removeEventListener('click', onDocumentClick);
+    }, [isOpen]);
+    return (Select_React.createElement("ul", null, selectOptions.map((o, i) => (Select_React.createElement("li", { key: i, "data-value": o.value, onClick: (e) => [e.stopPropagation(), onClick(o)], className: getClassName(o, option) }, o.label)))));
+};
 
-var SuspenseCache = /** @class */ (function () {
-    function SuspenseCache(options) {
-        if (options === void 0) { options = Object.create(null); }
-        this.queryRefs = new Trie(canUseWeakMap);
-        this.options = options;
-    }
-    SuspenseCache.prototype.getQueryRef = function (cacheKey, createObservable) {
-        var ref = this.queryRefs.lookupArray(cacheKey);
-        if (!ref.current) {
-            ref.current = new InternalQueryReference(createObservable(), {
-                key: cacheKey,
-                autoDisposeTimeoutMs: this.options.autoDisposeTimeoutMs,
-                onDispose: function () {
-                    delete ref.current;
-                },
-            });
-        }
-        return ref.current;
-    };
-    return SuspenseCache;
-}());
+;// CONCATENATED MODULE: ./src/js/components/ProjectSelect.tsx
+/* provided dependency */ var ProjectSelect_React = __webpack_require__(294);
 
-//# sourceMappingURL=SuspenseCache.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/cache/getSuspenseCache.js
 
-var suspenseCacheSymbol = Symbol.for("apollo.suspenseCache");
-function getSuspenseCache(client) {
-    var _a;
-    if (!client[suspenseCacheSymbol]) {
-        client[suspenseCacheSymbol] = new SuspenseCache((_a = client.defaultOptions.react) === null || _a === void 0 ? void 0 : _a.suspense);
+function ProjectSelect({ onChange, selected }) {
+    const { data, loading } = useProjects();
+    const projects = (data === null || data === void 0 ? void 0 : data.projects) || [];
+    const options = projects.map(project => ({
+        label: (ProjectSelect_React.createElement("div", { className: "flex" },
+            ProjectSelect_React.createElement("span", { style: { backgroundColor: project.color }, className: "flex w-2/8 rounded w-8 h-8 mr-3 cursor-pointer" }),
+            ProjectSelect_React.createElement("span", { className: "flex align-items-center" }, project.name))),
+        value: String(project.id),
+    }));
+    if (loading) {
+        return null;
     }
-    return client[suspenseCacheSymbol];
+    return (ProjectSelect_React.createElement(Select, { onChange: (option) => {
+            const project = projects.find(p => String(p.id) == option.value);
+            onChange(project);
+        }, options: options, selected: String(selected), placeholder: "Any project" }));
+    1;
 }
-//# sourceMappingURL=getSuspenseCache.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/constants.js
-var skipToken = Symbol.for("apollo.skipToken");
-//# sourceMappingURL=constants.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useSuspenseQuery.js
 
+;// CONCATENATED MODULE: ./src/js/components/NavBar.tsx
+/* provided dependency */ var NavBar_React = __webpack_require__(294);
 
 
 
-
-
-
-
-
-
-
-function useSuspenseQuery(query, options) {
-    if (options === void 0) { options = Object.create(null); }
-    var client = useApolloClient(options.client);
-    var suspenseCache = getSuspenseCache(client);
-    var watchQueryOptions = useWatchQueryOptions({
-        client: client,
-        query: query,
-        options: options,
-    });
-    var fetchPolicy = watchQueryOptions.fetchPolicy, variables = watchQueryOptions.variables;
-    var _a = options.queryKey, queryKey = _a === void 0 ? [] : _a;
-    var cacheKey = __spreadArray([
-        query,
-        canonicalStringify(variables)
-    ], [].concat(queryKey), true);
-    var queryRef = suspenseCache.getQueryRef(cacheKey, function () {
-        return client.watchQuery(watchQueryOptions);
-    });
-    var _b = react.useState(function () { return new Map([[queryRef.key, queryRef.promise]]); }), promiseCache = _b[0], setPromiseCache = _b[1];
-    var promise = promiseCache.get(queryRef.key);
-    if (queryRef.didChangeOptions(watchQueryOptions)) {
-        promise = queryRef.applyOptions(watchQueryOptions);
-        promiseCache.set(queryRef.key, promise);
-    }
-    if (!promise) {
-        promise = queryRef.promise;
-        promiseCache.set(queryRef.key, promise);
-    }
-    react.useEffect(function () {
-        var dispose = queryRef.retain();
-        var removeListener = queryRef.listen(function (promise) {
-            setPromiseCache(function (promiseCache) {
-                return new Map(promiseCache).set(queryRef.key, promise);
-            });
-        });
-        return function () {
-            removeListener();
-            dispose();
-        };
-    }, [queryRef]);
-    var skipResult = react.useMemo(function () {
-        var error = toApolloError(queryRef.result);
-        return {
-            loading: false,
-            data: queryRef.result.data,
-            networkStatus: error ? NetworkStatus.error : NetworkStatus.ready,
-            error: error,
-        };
-    }, [queryRef.result]);
-    var result = fetchPolicy === "standby" ? skipResult : __use(promise);
-    var fetchMore = react.useCallback((function (options) {
-        var promise = queryRef.fetchMore(options);
-        setPromiseCache(function (previousPromiseCache) {
-            return new Map(previousPromiseCache).set(queryRef.key, queryRef.promise);
-        });
-        return promise;
-    }), [queryRef]);
-    var refetch = react.useCallback(function (variables) {
-        var promise = queryRef.refetch(variables);
-        setPromiseCache(function (previousPromiseCache) {
-            return new Map(previousPromiseCache).set(queryRef.key, queryRef.promise);
-        });
-        return promise;
-    }, [queryRef]);
-    var subscribeToMore = react.useCallback(function (options) { return queryRef.observable.subscribeToMore(options); }, [queryRef]);
-    return react.useMemo(function () {
-        return {
-            client: client,
-            data: result.data,
-            error: toApolloError(result),
-            networkStatus: result.networkStatus,
-            fetchMore: fetchMore,
-            refetch: refetch,
-            subscribeToMore: subscribeToMore,
-        };
-    }, [client, fetchMore, refetch, result, subscribeToMore]);
-}
-function validateOptions(options) {
-    var query = options.query, fetchPolicy = options.fetchPolicy, returnPartialData = options.returnPartialData;
-    verifyDocumentType(query, DocumentType.Query);
-    validateFetchPolicy(fetchPolicy);
-    validatePartialDataReturn(fetchPolicy, returnPartialData);
-}
-function validateFetchPolicy(fetchPolicy) {
-    if (fetchPolicy === void 0) { fetchPolicy = "cache-first"; }
-    var supportedFetchPolicies = [
-        "cache-first",
-        "network-only",
-        "no-cache",
-        "cache-and-network",
-    ];
-    invariantWrappers_invariant(supportedFetchPolicies.includes(fetchPolicy), 56, fetchPolicy);
-}
-function validatePartialDataReturn(fetchPolicy, returnPartialData) {
-    if (fetchPolicy === "no-cache" && returnPartialData) {
-        globalThis.__DEV__ !== false && invariantWrappers_invariant.warn(57);
-    }
-}
-function toApolloError(result) {
-    return isNonEmptyArray(result.errors) ?
-        new ApolloError({ graphQLErrors: result.errors })
-        : result.error;
-}
-function useWatchQueryOptions(_a) {
-    var client = _a.client, query = _a.query, options = _a.options;
-    return useDeepMemo(function () {
-        var _a;
-        if (options === skipToken) {
-            return { query: query, fetchPolicy: "standby" };
-        }
-        var fetchPolicy = options.fetchPolicy ||
-            ((_a = client.defaultOptions.watchQuery) === null || _a === void 0 ? void 0 : _a.fetchPolicy) ||
-            "cache-first";
-        var watchQueryOptions = tslib_es6_assign(tslib_es6_assign({}, options), { fetchPolicy: fetchPolicy, query: query, notifyOnNetworkStatusChange: false, nextFetchPolicy: void 0 });
-        if (globalThis.__DEV__ !== false) {
-            validateOptions(watchQueryOptions);
-        }
-        // Assign the updated fetch policy after our validation since `standby` is
-        // not a supported fetch policy on its own without the use of `skip`.
-        if (options.skip) {
-            watchQueryOptions.fetchPolicy = "standby";
+const BASE_CLASSNAMES = ["block", "w-3/4", "no-underline", "p-3", "mt-2"];
+const ACTIVE_CLASSNAMES = [
+    ...BASE_CLASSNAMES,
+    "rounded",
+    "bg-secondary",
+    "text-primary",
+].join(" ");
+const INACTIVE_CLASSNAMES = [
+    ...BASE_CLASSNAMES,
+    "text-accent",
+    "hover-bg-secondary",
+].join(" ");
+const find = (path, bar) => {
+    let item = null;
+    Object.values(bar)
+        .flat()
+        .forEach(i => {
+        if (i.href === path) {
+            item = i;
         }
-        return watchQueryOptions;
-    }, [client, options, query]);
-}
-//# sourceMappingURL=useSuspenseQuery.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useBackgroundQuery.js
-
-
-
-
-
-
-
-function useBackgroundQuery(query, options) {
-    if (options === void 0) { options = Object.create(null); }
-    var client = useApolloClient(options.client);
-    var suspenseCache = getSuspenseCache(client);
-    var watchQueryOptions = useWatchQueryOptions({ client: client, query: query, options: options });
-    var fetchPolicy = watchQueryOptions.fetchPolicy, variables = watchQueryOptions.variables;
-    var _a = options.queryKey, queryKey = _a === void 0 ? [] : _a;
-    // This ref tracks the first time query execution is enabled to determine
-    // whether to return a query ref or `undefined`. When initialized
-    // in a skipped state (either via `skip: true` or `skipToken`) we return
-    // `undefined` for the `queryRef` until the query has been enabled. Once
-    // enabled, a query ref is always returned regardless of whether the query is
-    // skipped again later.
-    var didFetchResult = react.useRef(fetchPolicy !== "standby");
-    didFetchResult.current || (didFetchResult.current = fetchPolicy !== "standby");
-    var cacheKey = __spreadArray([
-        query,
-        canonicalStringify(variables)
-    ], [].concat(queryKey), true);
-    var queryRef = suspenseCache.getQueryRef(cacheKey, function () {
-        return client.watchQuery(watchQueryOptions);
     });
-    var _b = react.useState(function () { return new Map([[queryRef.key, queryRef.promise]]); }), promiseCache = _b[0], setPromiseCache = _b[1];
-    if (queryRef.didChangeOptions(watchQueryOptions)) {
-        var promise = queryRef.applyOptions(watchQueryOptions);
-        promiseCache.set(queryRef.key, promise);
-    }
-    react.useEffect(function () { return queryRef.retain(); }, [queryRef]);
-    var fetchMore = react.useCallback(function (options) {
-        var promise = queryRef.fetchMore(options);
-        setPromiseCache(function (promiseCache) {
-            return new Map(promiseCache).set(queryRef.key, queryRef.promise);
-        });
-        return promise;
-    }, [queryRef]);
-    var refetch = react.useCallback(function (variables) {
-        var promise = queryRef.refetch(variables);
-        setPromiseCache(function (promiseCache) {
-            return new Map(promiseCache).set(queryRef.key, queryRef.promise);
-        });
-        return promise;
-    }, [queryRef]);
-    queryRef.promiseCache = promiseCache;
-    var wrappedQueryRef = react.useMemo(function () { return wrapQueryRef(queryRef); }, [queryRef]);
-    return [
-        didFetchResult.current ? wrappedQueryRef : void 0,
-        { fetchMore: fetchMore, refetch: refetch },
-    ];
+    return item;
+};
+function NavBar() {
+    const params = (0,react.useContext)(ParamContext);
+    const bar = {
+        Tasks: [
+            { text: "All tasks", href: "/tasks/" },
+            { text: "New task", href: "/tasks/new/" },
+        ],
+        Projects: [{ text: "All projects", href: "/projects" }],
+    };
+    const activeItem = find(location.pathname, bar);
+    return (NavBar_React.createElement(NavBar_React.Fragment, null,
+        ...Object.keys(bar).map(key => {
+            const items = bar[key];
+            return (NavBar_React.createElement(NavBar_React.Fragment, null,
+                NavBar_React.createElement("h3", null, key),
+                NavBar_React.createElement("ul", null, ...items.flatMap(item => {
+                    return (NavBar_React.createElement("li", null,
+                        NavBar_React.createElement("a", { className: activeItem == item
+                                ? ACTIVE_CLASSNAMES
+                                : INACTIVE_CLASSNAMES, href: item.href }, item.text)));
+                }))));
+        }),
+        NavBar_React.createElement("h3", null, "Filters"),
+        NavBar_React.createElement(ProjectSelect, { selected: params.projectId, onChange: project => {
+                if (project) {
+                    location.hash = `projectId=${project.id}`;
+                }
+                else {
+                    location.hash = "";
+                }
+                location.reload();
+            } })));
 }
-//# sourceMappingURL=useBackgroundQuery.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/useReadQuery.js
-
 
+;// CONCATENATED MODULE: ./src/js/components/Projects.tsx
+/* provided dependency */ var Projects_React = __webpack_require__(294);
+var Projects_awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 
 
 
 
-function useReadQuery(queryRef) {
-    var internalQueryRef = unwrapQueryRef(queryRef);
-    invariantWrappers_invariant(internalQueryRef.promiseCache, 51);
-    var promiseCache = internalQueryRef.promiseCache, key = internalQueryRef.key;
-    if (!promiseCache.has(key)) {
-        promiseCache.set(key, internalQueryRef.promise);
+function Projects() {
+    const { data, loading } = useProjects();
+    const setRandomProjectColor = useSetRandomProjectColor();
+    const projects = data === null || data === void 0 ? void 0 : data.projects;
+    (0,react.useEffect)(() => {
+        document.title = "Projects";
+    }, []);
+    if (loading) {
+        return;
     }
-    var promise = useSyncExternalStore(react.useCallback(function (forceUpdate) {
-        return internalQueryRef.listen(function (promise) {
-            internalQueryRef.promiseCache.set(internalQueryRef.key, promise);
-            forceUpdate();
-        });
-    }, [internalQueryRef]), function () { return promiseCache.get(key); }, function () { return promiseCache.get(key); });
-    var result = __use(promise);
-    return react.useMemo(function () {
-        return {
-            data: result.data,
-            networkStatus: result.networkStatus,
-            error: toApolloError(result),
-        };
-    }, [result]);
+    return (Projects_React.createElement("div", { className: "flex" },
+        Projects_React.createElement("div", { className: "w-1/4" },
+            Projects_React.createElement(NavBar, null)),
+        Projects_React.createElement("div", { className: "w-3/4" },
+            Projects_React.createElement("h1", { className: "bg-secondary text-primary p-3 rounded" }, "Projects"),
+            Projects_React.createElement("ul", { className: "flex flex-wrap" }, projects.map((project, i) => {
+                return (Projects_React.createElement("li", { className: "flex flex-row p-3 hover-bg-secondary w-full", key: i },
+                    Projects_React.createElement("div", { style: { backgroundColor: project.color }, className: "w-2/8 rounded w-12 h-12 mr-3 cursor-pointer", onClick: () => Projects_awaiter(this, void 0, void 0, function* () {
+                            yield setRandomProjectColor({
+                                variables: { projectId: project.id },
+                            });
+                        }) }),
+                    Projects_React.createElement("a", { className: "w-6/8 no-underline text-accent block h-14", href: `/tasks/#projectId=${project.id}` },
+                        Projects_React.createElement("span", { className: "block w-full" }, project.name),
+                        Projects_React.createElement("span", { className: "block w-full text-smaller text-secondary" }, project.path))));
+            })))));
 }
-//# sourceMappingURL=useReadQuery.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/hooks/index.js
-
-
-
-
-
-
-
-
-
-
-
-
-//# sourceMappingURL=index.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/react/index.js
-
 
+;// CONCATENATED MODULE: ./src/js/main/projects.tsx
+/* provided dependency */ var projects_React = __webpack_require__(294);
 
 
 
-//# sourceMappingURL=index.js.map
-;// CONCATENATED MODULE: ./node_modules/@apollo/client/index.js
-
-
-//# sourceMappingURL=index.js.map
+(function () {
+    const root = document.querySelector(".react-root");
+    client.createRoot(root).render(projects_React.createElement(App, null,
+        projects_React.createElement(Projects, null)));
+})();
 
-/***/ })
+})();
 
-/******/ 	});
-/************************************************************************/
-/******/ 	// The module cache
-/******/ 	var __webpack_module_cache__ = {};
-/******/ 	
-/******/ 	// The require function
-/******/ 	function __webpack_require__(moduleId) {
-/******/ 		// Check if module is in cache
-/******/ 		var cachedModule = __webpack_module_cache__[moduleId];
-/******/ 		if (cachedModule !== undefined) {
-/******/ 			return cachedModule.exports;
-/******/ 		}
-/******/ 		// Create a new module (and put it into the cache)
-/******/ 		var module = __webpack_module_cache__[moduleId] = {
-/******/ 			// no module.id needed
-/******/ 			// no module.loaded needed
-/******/ 			exports: {}
-/******/ 		};
-/******/ 	
-/******/ 		// Execute the module function
-/******/ 		__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-/******/ 	
-/******/ 		// Return the exports of the module
-/******/ 		return module.exports;
-/******/ 	}
-/******/ 	
-/************************************************************************/
-/******/ 	/* webpack/runtime/create fake namespace object */
-/******/ 	(() => {
-/******/ 		var getProto = Object.getPrototypeOf ? (obj) => (Object.getPrototypeOf(obj)) : (obj) => (obj.__proto__);
-/******/ 		var leafPrototypes;
-/******/ 		// create a fake namespace object
-/******/ 		// mode & 1: value is a module id, require it
-/******/ 		// mode & 2: merge all properties of value into the ns
-/******/ 		// mode & 4: return value when already ns object
-/******/ 		// mode & 16: return value when it's Promise-like
-/******/ 		// mode & 8|1: behave like require
-/******/ 		__webpack_require__.t = function(value, mode) {
-/******/ 			if(mode & 1) value = this(value);
-/******/ 			if(mode & 8) return value;
-/******/ 			if(typeof value === 'object' && value) {
-/******/ 				if((mode & 4) && value.__esModule) return value;
-/******/ 				if((mode & 16) && typeof value.then === 'function') return value;
-/******/ 			}
-/******/ 			var ns = Object.create(null);
-/******/ 			__webpack_require__.r(ns);
-/******/ 			var def = {};
-/******/ 			leafPrototypes = leafPrototypes || [null, getProto({}), getProto([]), getProto(getProto)];
-/******/ 			for(var current = mode & 2 && value; typeof current == 'object' && !~leafPrototypes.indexOf(current); current = getProto(current)) {
-/******/ 				Object.getOwnPropertyNames(current).forEach((key) => (def[key] = () => (value[key])));
-/******/ 			}
-/******/ 			def['default'] = () => (value);
-/******/ 			__webpack_require__.d(ns, def);
-/******/ 			return ns;
-/******/ 		};
-/******/ 	})();
-/******/ 	
-/******/ 	/* webpack/runtime/define property getters */
-/******/ 	(() => {
-/******/ 		// define getter functions for harmony exports
-/******/ 		__webpack_require__.d = (exports, definition) => {
-/******/ 			for(var key in definition) {
-/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
-/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
-/******/ 				}
-/******/ 			}
-/******/ 		};
-/******/ 	})();
-/******/ 	
-/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
-/******/ 	(() => {
-/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
-/******/ 	})();
-/******/ 	
-/******/ 	/* webpack/runtime/make namespace object */
-/******/ 	(() => {
-/******/ 		// define __esModule on exports
-/******/ 		__webpack_require__.r = (exports) => {
-/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
-/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-/******/ 			}
-/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
-/******/ 		};
-/******/ 	})();
-/******/ 	
-/************************************************************************/
-/******/ 	
-/******/ 	// startup
-/******/ 	// Load entry module and return exports
-/******/ 	// This entry module is referenced by other modules so it can't be inlined
-/******/ 	var __webpack_exports__ = __webpack_require__(677);
-/******/ 	
 /******/ })()
 ;