ag-common 0.0.3

package/dist/ui/helpers/useOpenApiStore.d.ts

@@ -0,0 +1,14 @@
+import { AxiosResponse } from 'axios';
+import { AxiosWrapper, User } from 'analytica.click';
+import { CacheItems } from './routes';
+export declare const useOpenApiStore: <T, TDefaultApi>({ func, cacheKey, ttlSeconds, logout, refreshToken, disabled, apiUrl, newDefaultApi, }: {
+    ttlSeconds?: number | undefined;
+    func: (f: TDefaultApi) => Promise<AxiosResponse<T, any>>;
+    cacheKey: string;
+    logout: () => void;
+    refreshToken: () => Promise<User | undefined>;
+    disabled?: boolean | undefined;
+    apiUrl: string;
+    newDefaultApi: (config: any) => TDefaultApi;
+}) => AxiosWrapper<T>;
+export declare const setOpenApiCache: (items: CacheItems) => void;

package/dist/ui/helpers/useOpenApiStore.js

@@ -0,0 +1,145 @@
+"use strict";
+var __awaiter = (this && this.__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());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setOpenApiCache = exports.useOpenApiStore = void 0;
+const react_1 = require("react");
+const mutex_1 = require("./mutex");
+const mutexData_1 = require("./mutexData");
+const callOpenApi_1 = require("./callOpenApi");
+const log_1 = require("../../common/helpers/log");
+const mutex = new mutex_1.Mutex({
+    autoUnlockTimeoutMs: 10000,
+    intervalMs: 100,
+    Promise: Promise,
+});
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const mutexData = new mutexData_1.MutexData();
+const setMutexData = ({ key, data, ttlSeconds = 3600, }) => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const wrap = {
+        data,
+        loading: false,
+        reFetch: () => __awaiter(void 0, void 0, void 0, function* () {
+            (0, log_1.info)('mocked');
+        }),
+        datetime: new Date().getTime(),
+        error: undefined,
+        url: '',
+    };
+    mutexData.setData(key, wrap, ttlSeconds);
+};
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const getMutexData = (key) => mutexData.getData(key);
+function mLock(key, func, ttlSeconds, logout, refreshToken, apiUrl, newDefaultApi) {
+    return __awaiter(this, void 0, void 0, function* () {
+        let unlock;
+        try {
+            unlock = yield mutex.capture(key);
+            if (mutexData.getData(key)) {
+                return;
+            }
+            const newData = yield (0, callOpenApi_1.callOpenApi)({
+                apiUrl,
+                func,
+                logout,
+                refreshToken,
+                newDefaultApi,
+            });
+            if (!newData) {
+                return;
+            }
+            if (newData.error) {
+                (0, log_1.error)('api error:', newData.error);
+            }
+            else {
+                mutexData.setData(key, newData, ttlSeconds);
+            }
+            mutexData.pingSubscribers(key);
+        }
+        catch (e) {
+            (0, log_1.error)('mutex error:', e);
+        }
+        finally {
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            if (unlock) {
+                unlock();
+            }
+        }
+    });
+}
+const getTs = () => new Date().getTime();
+const useOpenApiStore = ({ func, cacheKey, ttlSeconds = 3600, logout, refreshToken, disabled = false, apiUrl, newDefaultApi, }) => {
+    if (!cacheKey) {
+        throw new Error('no cache key');
+    }
+    const [key, setKey] = (0, react_1.useState)(cacheKey);
+    (0, react_1.useEffect)(() => {
+        setKey(cacheKey);
+    }, [cacheKey]);
+    const [, setTs] = (0, react_1.useState)(0);
+    (0, react_1.useEffect)(() => {
+        const myHash = getTs().toString();
+        mutexData.subscribe(key, myHash, setTs);
+        return () => mutexData.unsubscribe(key, myHash);
+    }, [key]);
+    (0, react_1.useEffect)(() => {
+        if (!disabled && !mutexData.getData(key)) {
+            // eslint-disable-next-line @typescript-eslint/no-floating-promises
+            mLock(key, func, ttlSeconds, logout, refreshToken, apiUrl, newDefaultApi);
+        }
+    }, [
+        disabled,
+        func,
+        key,
+        ttlSeconds,
+        logout,
+        refreshToken,
+        apiUrl,
+        newDefaultApi,
+    ]);
+    if (!mutexData.getData(key)) {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        return { loading: true };
+    }
+    if (disabled) {
+        return {
+            loading: false,
+            error: undefined,
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            data: undefined,
+            datetime: new Date().getTime(),
+            reFetch: () => __awaiter(void 0, void 0, void 0, function* () { }),
+            url: '',
+        };
+    }
+    const current = mutexData.getData(key);
+    return Object.assign(Object.assign({}, current), { reFetch: () => __awaiter(void 0, void 0, void 0, function* () {
+            mutexData.setData(key, Object.assign(Object.assign({}, current), { loading: true }), ttlSeconds);
+            mutexData.pingSubscribers(key);
+            const newData = yield (0, callOpenApi_1.callOpenApi)({
+                apiUrl,
+                func,
+                logout,
+                refreshToken,
+                newDefaultApi,
+            });
+            mutexData.setData(key, newData, ttlSeconds);
+            mutexData.pingSubscribers(key);
+        }) });
+};
+exports.useOpenApiStore = useOpenApiStore;
+const setOpenApiCache = (items) => {
+    items.forEach(({ cacheKey, prefillData, ttlSeconds }) => {
+        mutexData.setData(cacheKey, prefillData, ttlSeconds);
+    });
+};
+exports.setOpenApiCache = setOpenApiCache;

package/dist/ui/helpers/useQueryString.d.ts

@@ -0,0 +1,8 @@
+export declare const isServer: boolean;
+export declare const useQueryString: <T>({ name, searchOverride, defaultValue, stringify, parse, }: {
+    name: string;
+    searchOverride?: string | undefined;
+    defaultValue: T;
+    stringify: (v: T) => string | undefined;
+    parse: (v: string | undefined) => T | undefined;
+}) => [T, (v: T) => void];

package/dist/ui/helpers/useQueryString.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useQueryString = exports.isServer = void 0;
+const react_1 = require("react");
+exports.isServer = typeof window === 'undefined';
+const useQueryString = ({ name, searchOverride, defaultValue, stringify, parse, }) => {
+    const raw = exports.isServer ? searchOverride : window.location.search;
+    const [state, setStateRaw] = (0, react_1.useState)(() => {
+        if (!raw) {
+            return defaultValue;
+        }
+        const parsed = new URLSearchParams(raw);
+        const g = parsed.get(name);
+        if (!g) {
+            return defaultValue;
+        }
+        return parse(g) || defaultValue;
+    });
+    const setState = (v) => {
+        const searchParams = new URLSearchParams(window.location.search);
+        const sv = stringify(v);
+        if (sv) {
+            searchParams.set(name, sv);
+        }
+        else {
+            searchParams.delete(name);
+        }
+        let qs = '';
+        if (Array.from(searchParams).length !== 0) {
+            qs = '?' + searchParams.toString();
+        }
+        const loc = `${location.pathname}${qs}${window.location.hash}`;
+        window.history.replaceState({}, '', loc);
+        setStateRaw(v);
+    };
+    return [state, setState];
+};
+exports.useQueryString = useQueryString;

package/dist/ui/helpers/useResize.d.ts

@@ -0,0 +1,8 @@
+export interface Dimensions {
+    width: number;
+    height: number;
+    smallScreen: boolean;
+    bigScreen: boolean;
+    vBigScreen: boolean;
+}
+export default function UseWindowDimensions(): Dimensions | undefined;

package/dist/ui/helpers/useResize.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+function getWindowDimensions() {
+    if (typeof window !== 'undefined') {
+        return {
+            width: window.innerWidth,
+            height: window.innerHeight,
+        };
+    }
+    else {
+        return undefined;
+    }
+}
+function UseWindowDimensions() {
+    const [windowDimensions, setWindowDimensions] = (0, react_1.useState)(getWindowDimensions());
+    (0, react_1.useEffect)(() => {
+        function handleResize() {
+            const wd = getWindowDimensions();
+            if (JSON.stringify(windowDimensions) === JSON.stringify(wd)) {
+                return;
+            }
+            setWindowDimensions(wd);
+        }
+        window.addEventListener('resize', handleResize);
+        handleResize();
+        return () => {
+            window.removeEventListener('resize', handleResize);
+        };
+    }, [windowDimensions]);
+    return windowDimensions;
+}
+exports.default = UseWindowDimensions;

package/dist/ui/index.d.ts

@@ -0,0 +1,3 @@
+export * from './helpers';
+export * from './styles';
+export * from './components';

package/dist/ui/index.js

@@ -0,0 +1,15 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./helpers"), exports);
+__exportStar(require("./styles"), exports);
+__exportStar(require("./components"), exports);

package/dist/ui/styles/colours.d.ts

@@ -0,0 +1,25 @@
+export declare const colours: {
+    mainLight: string;
+    lightest: string;
+    darker: string;
+    lighter: string;
+    dark: string;
+    charcoal: string;
+    lightCharcoal: string;
+    orangeRed: string;
+    orange: string;
+    yellow: string;
+    lightBlue: string;
+    lightGreen: string;
+    lightGreen2: string;
+    darkGreen: string;
+    peach: string;
+    purple: string;
+    notificationBlue: string;
+    notificationBlue2: string;
+    notificationBlue3: string;
+    gradient: string;
+};
+export declare const colourWheel: string[];
+export declare const getColourWheel: (i: number) => string;
+export declare const rgbVariation: (rgb: string, diff: number) => string;

package/dist/ui/styles/colours.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.rgbVariation = exports.getColourWheel = exports.colourWheel = exports.colours = void 0;
+const math_1 = require("../../common/helpers/math");
+exports.colours = {
+    mainLight: 'rgb(255,255,255)',
+    lightest: 'rgb(247,247,247)',
+    darker: 'rgb(0,0,0,0.1)',
+    lighter: 'rgb(234,234,234)',
+    dark: 'rgb(23,25,23)',
+    charcoal: 'rgb(50,50,50)',
+    lightCharcoal: 'rgb(154,154,154)',
+    orangeRed: '#d65873',
+    orange: '#e88070',
+    yellow: 'rgb(255,206,109)',
+    lightBlue: 'rgb(90,129,255)',
+    lightGreen: 'rgb(75,236,120)',
+    lightGreen2: 'rgb(14, 165, 0)',
+    darkGreen: '#228B22',
+    peach: 'rgb(245,169,169)',
+    purple: 'rgb(173,121,255)',
+    notificationBlue: '#4d76ff',
+    notificationBlue2: '#002ab3',
+    notificationBlue3: 'rgb(230,238,246)',
+    gradient: '---generated---',
+};
+const gradgen = (left, right) => `linear-gradient(to right, ${left}, ${right})`;
+exports.colours.gradient = gradgen(exports.colours.orangeRed, exports.colours.orange);
+exports.colourWheel = [
+    'rgb(11,132,165)',
+    'rgb(246,200,95)',
+    'rgb(111,78,124)',
+    'rgb(157,216,102)',
+    'rgb(202,71,47)',
+    'rgb(255,160,86)',
+    'rgb(141,221,208)',
+];
+const getColourWheel = (i) => exports.colourWheel[i % exports.colourWheel.length];
+exports.getColourWheel = getColourWheel;
+const rgbVariation = (rgb, diff) => {
+    const nums = rgb.match(/[0-9]+/gi);
+    if (!nums || (nums.length !== 3 && nums.length !== 4)) {
+        return rgb;
+    }
+    const nums2 = nums.map((n) => (0, math_1.clamp)({ value: Number(n) + diff, min: 0, max: 255 }));
+    if (nums2.length === 3) {
+        return `rgb(${nums2.join(',')})`;
+    }
+    return `rgba(${nums2.join(',')})`;
+};
+exports.rgbVariation = rgbVariation;

package/dist/ui/styles/common.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export declare const DropShadow: (outline: string) => import("styled-components").FlattenSimpleInterpolation;
+export declare const NoTextSelect: import("styled-components").FlattenSimpleInterpolation;
+export declare const CssTransparentBlock: import("styled-components").FlattenSimpleInterpolation;
+export declare const FadeBottom: ({ height }: {
+    height: string;
+}) => import("styled-components").FlattenSimpleInterpolation;
+export declare const Card: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const noDrag: {
+    draggable: boolean;
+    onDragStart: React.DragEventHandler<HTMLDivElement>;
+    onTouchStart: React.TouchEventHandler<HTMLDivElement>;
+};

package/dist/ui/styles/common.js

@@ -0,0 +1,94 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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.noDrag = exports.Card = exports.FadeBottom = exports.CssTransparentBlock = exports.NoTextSelect = exports.DropShadow = void 0;
+const styled_components_1 = __importStar(require("styled-components"));
+const colours_1 = require("./colours");
+const DropShadow = (outline) => (0, styled_components_1.css) `
+  filter: drop-shadow(1px 1px 0px ${outline})
+    drop-shadow(-1px 1px 0px ${outline}) drop-shadow(1px -1px 0px ${outline})
+    drop-shadow(-1px -1px 0px ${outline});
+`;
+exports.DropShadow = DropShadow;
+exports.NoTextSelect = (0, styled_components_1.css) `
+  user-select: none; /* supported by Chrome and Opera */
+  -webkit-user-select: none; /* Safari */
+  -khtml-user-select: none; /* Konqueror HTML */
+  -moz-user-select: none; /* Firefox */
+  -ms-user-select: none; /* Internet Explorer/Edge */
+`;
+exports.CssTransparentBlock = (0, styled_components_1.css) `
+  background-color: rgba(150, 150, 150, 0.5);
+  border-radius: 3px;
+  font-weight: 600;
+  color: ${colours_1.colours.mainLight};
+`;
+const FadeBottom = ({ height }) => (0, styled_components_1.css) `
+  &:after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    height: ${height};
+    background: -webkit-linear-gradient(
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 1) 100%
+    );
+    background-image: -moz-linear-gradient(
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 1) 100%
+    );
+    background-image: -o-linear-gradient(
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 1) 100%
+    );
+    background-image: linear-gradient(
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 1) 100%
+    );
+    background-image: -ms-linear-gradient(
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 1) 100%
+    );
+  }
+`;
+exports.FadeBottom = FadeBottom;
+exports.Card = styled_components_1.default.div `
+  background-color: white;
+  margin: 0.5rem;
+
+  position: relative;
+  border-radius: 0.5rem;
+  max-width: 40rem;
+  padding: 1rem;
+  border: solid 2px ${colours_1.colours.lighter};
+`;
+exports.noDrag = {
+    draggable: false,
+    onDragStart: (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+    },
+    onTouchStart: (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+    },
+};

package/dist/ui/styles/index.d.ts

@@ -0,0 +1,4 @@
+export * from './colours';
+export * from './common';
+export * from './media';
+export * from './standaloneStyles';

package/dist/ui/styles/index.js

@@ -0,0 +1,16 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./colours"), exports);
+__exportStar(require("./common"), exports);
+__exportStar(require("./media"), exports);
+__exportStar(require("./standaloneStyles"), exports);

package/dist/ui/styles/media.d.ts

@@ -0,0 +1,5 @@
+export declare const smallScreenPx = 1024;
+export declare const bigScreenPx = 2000;
+export declare const smallScreen: string;
+export declare const bigScreen: string;
+export declare const vBigScreen: string;

package/dist/ui/styles/media.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.vBigScreen = exports.bigScreen = exports.smallScreen = exports.bigScreenPx = exports.smallScreenPx = void 0;
+exports.smallScreenPx = 1024;
+exports.bigScreenPx = 2000;
+exports.smallScreen = `(max-width: ${exports.smallScreenPx}px)`;
+exports.bigScreen = `(min-width: ${exports.smallScreenPx}px)`;
+exports.vBigScreen = `(min-width: ${exports.bigScreenPx}px)`;

package/dist/ui/styles/standaloneStyles.d.ts

@@ -0,0 +1,6 @@
+export declare const SOBase: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SOBR: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SOB: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SOP: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SOCenter: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SOA: import("styled-components").StyledComponent<"a", any, {}, never>;

package/dist/ui/styles/standaloneStyles.js

@@ -0,0 +1,69 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SOA = exports.SOCenter = exports.SOP = exports.SOB = exports.SOBR = exports.SOBase = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+const media_1 = require("./media");
+const FullScreenPage = styled_components_1.default.div `
+  display: flex;
+  width: 100%;
+  flex-grow: 1;
+  flex-flow: column;
+  overflow: hidden;
+  align-content: flex-start;
+  align-items: flex-start;
+`;
+exports.SOBase = (0, styled_components_1.default)(FullScreenPage) `
+  > h1,
+  h2,
+  > p {
+    white-space: pre-wrap;
+    font-size: 1.2rem;
+  }
+  h1,
+  h2 {
+    font-weight: normal;
+    font-size: 2rem;
+    flex-basis: 100%;
+    margin: 0;
+  }
+`;
+exports.SOBR = styled_components_1.default.div `
+  height: 0.5rem;
+  width: 0.5rem;
+`;
+exports.SOB = styled_components_1.default.div `
+  font-size: 1.4em;
+  font-weight: bold;
+`;
+exports.SOP = styled_components_1.default.div `
+  margin-bottom: 1rem;
+`;
+exports.SOCenter = styled_components_1.default.div `
+  display: flex;
+  flex-flow: column;
+  margin-left: auto;
+  margin-right: auto;
+  @media ${media_1.smallScreen} {
+    width: calc(100% - 2rem);
+  }
+`;
+exports.SOA = styled_components_1.default.a `
+  width: fit-content;
+  color: rgb(125, 171, 255);
+  text-decoration: none;
+  &:hover {
+    text-decoration: underline;
+  }
+  &[data-inline='true'] {
+    display: inline-block;
+    margin-left: 5px;
+    margin-right: 5px;
+  }
+  &[data-inline='false'] {
+    display: flex;
+    margin: auto;
+  }
+`;

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "ag-common",
+  "version": "0.0.3",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "dependencies": {
+    "axios": "0.24.0",
+    "typescript": "4.5.4"
+  },
+  "devDependencies": {
+    "@types/node": "^17.0.5",
+    "@types/aws-lambda": "8.10.89",
+    "@types/react": "*",
+    "@types/react-dom": "*",
+    "@types/styled-components": "*",
+    "analytica.click": "*",
+    "aws-cdk-lib": "*",
+    "aws-sdk": "2.1048.0",
+    "constructs": "*",
+    "eslint": "*",
+    "react": "*",
+    "react-dom": "*",
+    "react-hot-toast": "2.1.1",
+    "rimraf": "*",
+    "typescript-styled-plugin": "*"
+  },
+  "peerDependencies": {
+    "aws-lambda": "1.0.7",
+    "styled-components": "*"
+  },
+  "scripts": {
+    "build": "rimraf dist && tsc",
+    "fix": "./node_modules/.bin/eslint --fix './src/**/*.ts' './src/**/*.tsx'",
+    "checklint": "npx eslint --ext .ts,.tsx ./src",
+    "start": "tsc --watch"
+  },
+  "files": [
+    "dist/**/*"
+  ]
+}