Added front-end ReactApp, with basic CRUD functionality for Bookmark entries

yaba-web/src/utils/arrayHelper.js

@@ -0,0 +1,6 @@
+// FROM: https://fjolt.com/article/javascript-check-if-array-is-subset
+export const isSubset  = (parentArray, subsetArray) => {
+    return subsetArray.every((el) => {
+        return parentArray.includes(el)
+    })
+};

yaba-web/src/utils/bookmarkHelper.js

@@ -0,0 +1,13 @@
+export const containsSubstring = (bookmark, searchString) => {
+    if (bookmark === null) {
+        return false;
+    }
+    
+    return Object.values(bookmark)
+        .some(val => typeof(val) == 'object' ?
+            containsSubstring(val, searchString) :
+                typeof(val) == 'number' || typeof(val) == 'boolean' ?
+                    val.toString().toLowerCase().includes(searchString.toLowerCase()) : 
+                    val.toLowerCase().includes(searchString.toLowerCase())
+        );
+}

yaba-web/src/utils/dateTimeHelper.js

@@ -0,0 +1,38 @@
+import dayjs from "dayjs";
+
+const utc = require('dayjs/plugin/utc')
+const timezone = require('dayjs/plugin/timezone') // dependent on utc plugin
+dayjs.extend(utc);
+dayjs.extend(timezone);
+
+export default class DateTimeHelper {
+    static ISO8601_DATETIMEFORMAT = () => {
+        return 'YYYY-MM-DD HH:mm';
+    };
+    
+    static toLocalDateTime = (dateTimeString, formatString) => {
+        return dayjs(dateTimeString).local().format(formatString ?? this.ISO8601_DATETIMEFORMAT());
+    };
+
+    static toString = (dateTimeString, formatString) => {
+        return dayjs(dateTimeString).format(formatString);
+    };
+
+    static getFriendlyDate = (dateTimeString) => {
+        const dateTimeStringInUtc = dayjs(dateTimeString).utc();
+        const currentUtcDateTime = dayjs().utc();
+
+        if(currentUtcDateTime.diff(dateTimeStringInUtc, 'day') <= 7) {
+            return dateTimeStringInUtc.local().format('dddd');
+        } else if(currentUtcDateTime.diff(dateTimeStringInUtc, 'week') <= 4) {
+            const differenceInWeeks = currentUtcDateTime.diff(dateTimeStringInUtc, 'week');
+            return `${differenceInWeeks} ${ differenceInWeeks <= 1 ? 'week' : 'weeks'} ago`;
+        } else if(currentUtcDateTime.diff(dateTimeStringInUtc, 'month') <= 12) {
+            const differenceInMonths = currentUtcDateTime.diff(dateTimeStringInUtc, 'month');
+            return `${differenceInMonths} ${ differenceInMonths <= 1 ? 'month' : 'months' } ago`;
+        } else {
+            const differenceInYears = currentUtcDateTime.diff(dateTimeStringInUtc, 'year');
+            return `${differenceInYears} ${ differenceInYears <= 1 ? 'year' : 'years'} ago`;
+        }
+    };
+}

yaba-web/src/utils/index.js

@@ -0,0 +1,11 @@
+import { isDev } from "./isDevHelper";
+import { getTagGroups } from "./tagsHelper";
+import { isSubset } from "./arrayHelper";
+import { containsSubstring } from "./bookmarkHelper";
+
+export {
+    isDev,
+    getTagGroups,
+    isSubset,
+    containsSubstring
+}

yaba-web/src/utils/isDevHelper.js

@@ -0,0 +1,3 @@
+export const isDev = () => {
+    return !process.env.NODE_ENV || process.env.NODE_ENV === 'development';
+}

yaba-web/src/utils/tagsHelper.js

@@ -0,0 +1,17 @@
+export const getTagGroups = (allBookmarkTags) => {
+    const allTags = allBookmarkTags.flat().reduce((accumulator, current) => {
+        if(!accumulator.find((item) => item.id === current.id)) {
+            accumulator.push(current);
+        }
+
+        return accumulator
+    }, []);
+
+    return allTags.map((x) => x['name'][0].toUpperCase()).reduce((accumulator, current) => {
+        if(!accumulator.find((item) => item.name === current)) {
+            accumulator.push({name: current, tags: allTags.filter((x) => x.name[0].toUpperCase() === current)});
+        }
+        
+        return accumulator
+    }, []).sort((a, b) => (a.name < b.name) ? -1 : (a.name > b.name) ? 1 : 0);
+}