user collab badge + versin update

public/changelog.txt

@@ -1,3 +1,7 @@
+- 2.27.3 : 2024-03-18
+        * Thanks to @Aizzer_1 for reporting the bug that math symbols and others were not being saved. My bad, I introduced this bug when tyring to remove "weird" characters.
+        * Added star icon next to usernames to recognize users for their valuable feedback and bug reports.
+
 - 2.27.2 : 2024-03-16
         * "blank log" display to improve feedback
         * increase text of user's journals a bit 

src/componentes/ucard.js

@@ -1,4 +1,4 @@
-import { Chip } from '@material-ui/core';
+import { Box, Chip } from '@material-ui/core';
 import Card from '@material-ui/core/Card';
 import CardActionArea from '@material-ui/core/CardActionArea';
 import CardActions from '@material-ui/core/CardActions';
@@ -7,7 +7,7 @@ import Paper from '@material-ui/core/Paper';
 import { makeStyles } from '@material-ui/core/styles';
 import Typography from '@material-ui/core/Typography';
 import LockIcon from '@material-ui/icons/Lock';
-import React from 'react';
+import React, { useMemo } from 'react';
 import { useHistory } from "react-router-dom";
 import Barra from "./barras";
 import Ename from './ename';
@@ -18,6 +18,10 @@ import { SocialLinks } from './ucard-social-links';
 import Uname from "./uname";
 import WeightValue from './weight-value';
 import FlareRoundedIcon from '@material-ui/icons/FlareRounded';
+import { useHasGivenFeedback } from '../utils/useHasGivenFeedback';
+import StarOutlineRoundedIcon from '@material-ui/icons/StarOutlineRounded';
+import { OpenConfirmModal } from './Dialog';
+import { Alert } from '@material-ui/lab';
 
 const useStyles = makeStyles( theme => ({
 
@@ -86,12 +90,28 @@ export default function({ data:{ user, media, text, when, utags }, url, extraRow
     const breve             = injournal;
     const joined            = user.joined instanceof Date? user.joined : new Date(user.joined);
     const years             = Math.floor((new Date().valueOf() - joined.valueOf()) / 31557600000 ); 
+    const collabs           = useHasGivenFeedback();
+    const collabedIn        = useMemo(()=>{
 
-    var statsExtraRows = [ 
-        ["Joined", <JoinedTag label={date2timeago(joined, null, 3)} years={years}/>  ], 
-        ...extraRows
-         //user.private? ["Private Mode", "ON"] : ["Days Logged", posted]
-    ];
+        return collabs && collabs(user.uname);
+
+    },[collabs])
+
+    var statsExtraRows = useMemo(()=>{
+
+        let rows = [ 
+            ["Joined", <JoinedTag label={date2timeago(joined, null, 3)} years={years}/>  ], 
+            ...extraRows
+        ];
+
+        if( collabedIn?.length )
+        {
+            rows.push(["Collabed", <CollabbedLabel user={user} versions={collabedIn}/> ]);
+        }
+
+        return rows;
+
+    },[ collabedIn ]);
 
     //const extraRow = user.private? ["Private Mode", "ON"] : ["Posted", posted];
 
@@ -170,3 +190,24 @@ const OGSeal = ({sinceDay1})=>{
     return <span className='og' title={sinceDay1?"Member since year 1 of the site":"Long time member"}>{sinceDay1?"OG":<FlareRoundedIcon/>}</span>
 }
 
+const CollabbedLabel = ( { user, versions }) => {
+
+    const showExplanation = ()=>{
+        OpenConfirmModal({ open:true
+            , title:<><Uname nolink inline {...user} /> has collabed with the site</>
+            , info: <div>
+                        <Alert severity='info'>This user has given valuable feedback, either by reporting a bug or suggesting a new feature that has lead to improvements in the site.</Alert>
+                        <br/> <a href="/changelog">Changelog</a> entries:<br/>
+                        {
+                            versions.map( v => <Paper style={{marginBottom:5}} key={v} elevation={2}><Box padding={2}><Typography variant='caption'>{v}</Typography></Box></Paper>)
+                        }
+                    </div>
+            , verb: "Ok, got it" 
+            , canCancel: false
+        });
+    }
+
+    return <>
+        <a href="#" onClick={e=>e.preventDefault() || showExplanation()}><StarOutlineRoundedIcon style={{fontSize:"1em"}}/>{ versions.length } Time{ versions.length>1 && "s" }</a>
+        </>
+}

src/componentes/uname.js

@@ -8,6 +8,10 @@ import {
 } from "react-router-dom";
 import { useGetUserInfoQuery } from '../data/generated---db-types-and-hooks';
 import VerifiedUserIcon from '@material-ui/icons/VerifiedUser';
+import { useHasGivenFeedback } from "../utils/useHasGivenFeedback";
+import { useMemo } from "react";
+import StarRateIcon from '@material-ui/icons/StarRate';
+import StarOutlineRoundedIcon from '@material-ui/icons/StarOutlineRounded';
 
 const useStyles = makeStyles( theme => ({
 
@@ -72,6 +76,12 @@ function UnameTag( { inline=false, nolink=false, id, uname, cc, isf, slvl, sok,
 
     const classes   = useStyles();
     const Icon      = id==1? VerifiedUserIcon : slvl>0? sok? CheckCircleIcon : CheckIcon  : null;
+    const collabs   = useHasGivenFeedback();
+    const userCollabs = useMemo(()=>{
+
+        return collabs && collabs(uname);
+
+    },[collabs])
 
     // poner "xx country_unknown" al no saber CC...
     const Wrapper = nolink? Foo : Link;
@@ -81,6 +91,7 @@ function UnameTag( { inline=false, nolink=false, id, uname, cc, isf, slvl, sok,
                 <b className={ isf>-1? isf==0? classes.m : classes.f : classes.x }> {prefix}{ uname || "????"}</b>
                 { Icon!=null && <Icon className={classes.icon + " "+ (sok && "ok")} fontSize="small"/> }
                 {rest.private ? <LockIcon style={{fontSize:"1em"}}/>:""}
+                { userCollabs?.length>0 && <><StarOutlineRoundedIcon style={{fontSize:"1em"}}/>{userCollabs?.length>1 && <sup>{userCollabs?.length}</sup> }</> }
             </Wrapper>
 }
 

src/pages/ChangelogPage.js

@@ -1,6 +1,8 @@
-import { Box, Divider, Typography } from "@material-ui/core";
-import { useEffect, useState } from "react";
+import { Box, Divider, LinearProgress, Typography } from "@material-ui/core";
+import { useEffect, useMemo, useState } from "react";
 import { UnameRef } from "../componentes/uname";
+import { useChangelog } from "../utils/useChangelog";
+import { Alert } from "@material-ui/lab";
 
 
 const uname2Tag = txt => {
@@ -34,21 +36,16 @@ const uname2Tag = txt => {
 
 export default function ChangelogPage() {
 
-    const [content, setContent] = useState("...loading");
+    const { changelog, loading, error } = useChangelog(); 
 
-    useEffect(async () => {
+    const content = useMemo(() => {
 
-        try {
-            const resp = await fetch("/changelog.txt");
-            const txt = await resp.text();
-            setContent(uname2Tag(txt));
+        if( changelog )
+        {
+            return uname2Tag(changelog);
         }
-        catch (e) {
-            setContent("Failed to load the log for some reason...");
-        }
-
-
-    }, []);
+
+    }, [changelog])
 
     return <>
         <Box margin={2}>
@@ -61,6 +58,8 @@ export default function ChangelogPage() {
                 <br /><br /></Typography>
 
             <Divider />
+            { loading && <LinearProgress/>}
+            { error && <Alert severity="error">{error}</Alert>}
             <pre style={{ whiteSpace: "pre-wrap", marginTop: 30 }}>{content}</pre>
         </Box>
 

src/utils/useChangelog.js

@@ -0,0 +1,27 @@
+import { useEffect, useState } from "react";
+
+export const useChangelog = ()=>{
+
+    const [changelog, setContent] = useState();
+    const [error, setError] = useState();
+    const [loading, setLoading] = useState(true);
+
+    useEffect(async () => {
+
+        try {
+            const resp = await fetch("/changelog.txt");
+            const txt = await resp.text();
+            setLoading(false);
+            setContent(txt);
+        }
+        catch (e) {
+            setError("Failed to load the log for some reason...");
+        } 
+
+    }, []);
+
+    return {
+        changelog, error, loading
+    }
+
+}

src/utils/useHasGivenFeedback.js

@@ -0,0 +1,71 @@
+import { useChangelog } from "./useChangelog"
+
+var collaborators;
+
+/**
+ * returns a function that can be used to check if a user has given feedback for a given version. 
+ * Given a username, it will return the VERSIONS in which it has collabed.
+ */
+export const useHasGivenFeedback = ()=>{
+    const { changelog } = useChangelog();
+
+    if( changelog )
+    {
+        return uname => {
+
+            if( !collaborators )
+            { 
+                collaborators = new Map();
+
+                var lastVersion = null;
+
+                //console.group("COLABS");
+                changelog.split("\n").forEach( line=>{
+
+                    let m = line.match(/- +(\d+\.\d+\.\d+)\s+:/);
+                    if( m )
+                    {
+                        lastVersion = line.replace("- ","");
+                    }
+                    else 
+                    {
+                        const regex = /@([a-z0-9_]+)/gi;
+
+                        while ((m = regex.exec(line)) !== null) {
+                            if (m.index === regex.lastIndex) {
+                                regex.lastIndex++;
+                            }
+
+                            // The result can be accessed through the `m`-variable.
+                            m.forEach((uname, groupIndex) => {
+
+                                if( groupIndex==0 ) return;
+
+                                //console.log( uname, lastVersion)
+                                const what = lastVersion + " | " + line;
+
+                                if( !collaborators.has(uname) )
+                                {
+                                    collaborators.set(uname, [what]);
+                                }
+                                else
+                                {
+                                    collaborators.get(uname).push(what);
+                                }
+
+                            });
+                        }
+
+                    }
+
+                });
+                //console.groupEnd();
+            } 
+
+            return collaborators.get( uname );
+
+        }
+    }
+
+    return null;
+}

src/version.json

@@ -1 +1 @@
-{"buildMajor":"2","buildMinor":27,"buildRevision":2,"buildTag":"RELEASE","when":"Sat, 16 Mar 2024 12:49:06 GMT"}
+{"buildMajor":"2","buildMinor":27,"buildRevision":3,"buildTag":"RELEASE","when":"Mon, 18 Mar 2024 08:20:30 GMT"}