Merge pull request #250 from coder13/fix/solve-history-user-preview

Enable user-scoped solve history preview

Author: coder13

.env.example

@@ -8,6 +8,8 @@ ROOM_RECONNECT_GRACE_MS=60000
 GRAND_PRIX_ENABLED=false
 # Friend System routes remain disabled through the #188 launch gate.
 SOCIAL_FEATURES_ENABLED=false
+# Comma-separated WCA user IDs approved for the solve-history preview.
+FEATURE_SOLVE_HISTORY_USER_IDS=
 # Manual Compose commands use this tag. scripts/deploy.sh overrides it with
 # the full deployed commit SHA.
 APP_IMAGE_TAG=local

README.md

@@ -104,17 +104,20 @@ access codes, OAuth credentials, chat content, scramble text, or solve times.
 
 New MongoDB writes are mirrored into PostgreSQL without changing application
 reads. PostgreSQL receives public identity and preferences, rooms and
-participant state, attempts, durable solve results, and sanitized analytics
-events. OAuth access tokens are deliberately not copied. Writes use
+participant state, RaceSession projections for normal rooms, attempts, durable
+solve results, and sanitized analytics events. OAuth access tokens are deliberately not copied. Writes use
 deterministic UUIDs and upserts,
 so retries and future backfills are idempotent. Live room saves mirror only the
 attempts and results changed by that save; complete room snapshots are reserved
-for explicit backfills. Changing a room event explicitly replaces that room's
-PostgreSQL attempts so removed MongoDB attempts do not remain queryable.
+for explicit backfills. Changing a normal room event ends its projected
+RaceSession and starts a new one; earlier attempts and solves remain preserved
+under their earlier session.
 
 Solve penalties use dedicated boolean columns rather than JSON so histories and
-statistics remain compact and index-friendly. User solve history is indexed by
-creation time and solve ID for stable cursor pagination.
+statistics remain compact and index-friendly. `GET /api/solve-history` reads
+PostgreSQL session-linked history for the authenticated participant. It is
+enabled in development and may be enabled for selected production users with
+`FEATURE_SOLVE_HISTORY_USER_IDS`.
 
 Set `POSTGRES_ENABLED=false` to disable mirroring. Production should set
 `PGHOST`, `PGDATABASE`, `PGUSER`, and `POSTGRES_PASSWORD`, or provide a

client/package.json

@@ -8,8 +8,8 @@
     "@mui/icons-material": "^6.5.0",
     "@mui/material": "^6.5.0",
     "@mui/styles": "^6.5.0",
-    "clsx": "1.1.0",
-    "date-fns": "^2.16.1",
+    "clsx": "2.1.1",
+    "date-fns": "^4.4.0",
     "history": "4.10.1",
     "material-ui-confirm": "^4.0.0",
     "prop-types": "15.8.1",
@@ -19,7 +19,7 @@
     "react-dom": "18.3.1",
     "react-ga4": "^3.0.1",
     "react-markdown": "6.0.3",
-    "react-redux": "^8.1.3",
+    "react-redux": "^9.3.0",
     "react-router-dom": "^5.3.4",
     "react-twitch-embed": "^3.0.2",
     "react-virtualized": "^9.22.6",

client/src/components/Room/Normal/index.jsx

@@ -3,7 +3,6 @@ import clsx from 'clsx';
 import PropTypes from 'prop-types';
 import { makeStyles } from '@mui/styles';
 import { connect } from 'react-redux';
-import Grid from '@mui/material/Grid';
 import Paper from '@mui/material/Paper';
 import BottomNavigation from '@mui/material/BottomNavigation';
 import BottomNavigationAction from '@mui/material/BottomNavigationAction';
@@ -46,12 +45,30 @@ const useStyles = makeStyles((theme) => ({
     },
   },
   container: {
+    display: 'flex',
     flexGrow: 1,
     flexWrap: 'nowrap',
+    minHeight: 0,
   },
-  panel: {
-    flexGrow: 1,
-    transition: `display 5s ${theme.transitions.easing.easeInOut}`,
+  mainPanel: {
+    display: 'flex',
+    flex: '1 1 auto',
+    minWidth: 0,
+  },
+  chatPanel: {
+    display: 'flex',
+    flex: '0 0 24rem',
+    minWidth: 0,
+    transition: theme.transitions.create('flex-basis'),
+    [theme.breakpoints.down('sm')]: {
+      flexBasis: '100%',
+    },
+  },
+  chatPanelClosed: {
+    flexBasis: '3rem',
+    [theme.breakpoints.down('sm')]: {
+      flexBasis: '100%',
+    },
   },
   backdrop: {
     zIndex: theme.zIndex.drawer + 1,
@@ -73,6 +90,7 @@ const panels = [{
 export const NormalRoom = ({ room, user }) => {
   const classes = useStyles();
   const [currentPanel, setCurrentPanel] = useState(0);
+  const [chatOpen, setChatOpen] = useState(true);
 
   const isAdmin = () => room.admin && room.admin.id === user.id;
 
@@ -91,27 +109,23 @@ export const NormalRoom = ({ room, user }) => {
       </Paper>
       <Divider />
 
-      <Grid container direction="row" className={classes.container}>
-        <Grid
-          item
-          className={clsx(classes.panel, {
+      <div className={classes.container}>
+        <div
+          className={clsx(classes.mainPanel, {
             [classes.hiddenOnMobile]: currentPanel !== 0,
           })}
-          style={{
-            flexGrow: 1,
-          }}
         >
           <Main />
-        </Grid>
-        <Grid
-          item
-          className={clsx(classes.panel, {
+        </div>
+        <div
+          className={clsx(classes.chatPanel, {
             [classes.hiddenOnMobile]: currentPanel !== 1,
+            [classes.chatPanelClosed]: !chatOpen,
           })}
         >
-          <Chat />
-        </Grid>
-      </Grid>
+          <Chat open={chatOpen} onToggle={() => setChatOpen((isOpen) => !isOpen)} />
+        </div>
+      </div>
 
       <BottomNavigation
         value={currentPanel}

client/src/components/Room/Panels/Chat.jsx

@@ -33,21 +33,10 @@ const Icons = {
 const useStyles = makeStyles((theme) => ({
   root: {
     display: 'flex',
-    flexGrow: 0,
-    flexShrink: 1,
-    width: '20rem',
+    flexGrow: 1,
+    minWidth: 0,
     flexDirection: 'column',
     height: '100%',
-    [theme.breakpoints.down('sm')]: {
-      width: '100%',
-      flexGrow: 1,
-    },
-  },
-  closed: {
-    flexGrow: 0,
-    width: 0,
-    position: 'relative',
-    border: 'none',
   },
   messages: {
     display: 'flex',
@@ -85,14 +74,8 @@ const useStyles = makeStyles((theme) => ({
     'user-select': 'text',
   },
   toolbarClosed: {
-    position: 'absolute',
-    width: '10em',
-    right: 0,
-  },
-  hiddenOnMobile: {
-    [theme.breakpoints.down('sm')]: {
-      display: 'none',
-    },
+    justifyContent: 'center',
+    padding: 0,
   },
 }));
 
@@ -105,11 +88,10 @@ const UNKOWN_USER = {
 };
 
 function Chat({
-  dispatch, messages, users, user,
+  dispatch, messages, users, user, open, onToggle,
 }) {
   const classes = useStyles();
   const [message, setMessage] = useState('');
-  const [open, setOpen] = useState(true);
   const listRef = useRef();
 
   const findUser = (id) => {
@@ -157,22 +139,24 @@ function Chat({
 
   return (
     <Panel
-      className={clsx(classes.root, {
-        [classes.closed]: !open,
-      })}
+      className={classes.root}
       toolbar={(
         <Toolbar
           variant="dense"
           className={clsx({
             [classes.toolbarClosed]: !open,
           })}
         >
-          <Typography variant="h6" style={{ flexGrow: 1 }}>
-            Chat
-          </Typography>
-          <IconButton className={classes.hiddenOnMobile} onClick={() => setOpen(!open)}>
-            {open ? <ArrowForwardIcon /> : <ArrowBackIcon /> }
-          </IconButton>
+          {open && (
+            <Typography variant="h6" style={{ flexGrow: 1 }}>
+              Chat
+            </Typography>
+          )}
+          {onToggle && (
+            <IconButton onClick={onToggle} aria-label={open ? 'Close chat' : 'Open chat'}>
+              {open ? <ArrowForwardIcon /> : <ArrowBackIcon /> }
+            </IconButton>
+          )}
         </Toolbar>
       )}
     >
@@ -278,6 +262,8 @@ Chat.propTypes = {
     id: PropTypes.number,
     canJoinRoom: PropTypes.bool,
   }),
+  open: PropTypes.bool,
+  onToggle: PropTypes.func,
 };
 
 Chat.defaultProps = {
@@ -287,6 +273,8 @@ Chat.defaultProps = {
     id: undefined,
     canJoinRoom: false,
   },
+  open: true,
+  onToggle: undefined,
 };
 
 const mapStateToProps = (state) => ({

compose.yml

@@ -7,6 +7,7 @@ x-app-environment: &app-environment
   ROOM_RECONNECT_GRACE_MS: ${ROOM_RECONNECT_GRACE_MS:-60000}
   GRAND_PRIX_ENABLED: ${GRAND_PRIX_ENABLED:-false}
   SOCIAL_FEATURES_ENABLED: ${SOCIAL_FEATURES_ENABLED:-false}
+  FEATURE_SOLVE_HISTORY_USER_IDS: ${FEATURE_SOLVE_HISTORY_USER_IDS:-}
   METRICS_ENABLED: ${METRICS_ENABLED:-true}
   METRICS_RETENTION_DAYS: ${METRICS_RETENTION_DAYS:-90}
   METRICS_HASH_SECRET: ${METRICS_HASH_SECRET:-}

docs/data.md

@@ -26,26 +26,37 @@ Prisma defines PostgreSQL in `server/prisma/schema.prisma`, using two schemas:
 
 | Schema | Contents |
 | --- | --- |
-| `app` | users, rooms, participants, attempts, and solves |
+| `app` | users, rooms, room/session participants, RaceSessions, attempts, and solves |
 | `analytics` | pseudonymous metric events |
 
 PostgreSQL receives normalized copies of users/preferences, rooms and
-participant state, attempts, durable solves, and sanitized analytics. OAuth
-access tokens are deliberately not mirrored.
+participant state, normal-room RaceSession projections, attempts, durable
+solves, and sanitized analytics. OAuth access tokens are deliberately not
+mirrored. Existing PostgreSQL attempts and solves that predate the expansion
+remain unlinked until the backfill/reconciliation operation assigns them.
 
-Application reads do not use PostgreSQL yet. Setting `POSTGRES_ENABLED=false`
-disables initialization and mirrors. PostgreSQL failures are logged, while API
-and Socket.IO health report the service as `degraded` instead of unavailable.
+Application reads remain MongoDB-backed except for the development-only solve
+history experiment. Setting `POSTGRES_ENABLED=false` disables initialization
+and mirrors. PostgreSQL failures are logged, while API and Socket.IO health
+report the service as `degraded` instead of unavailable.
 
 ## Dual-Write Guarantees
 
 `server/postgres/dualWrite.js` derives stable UUIDs from Mongo/WCA identifiers
 and uses upserts so retries and future backfills remain idempotent.
 
-Room saves collect changed attempts/results and mirror only that delta. An
-explicit event change replaces that room's PostgreSQL attempts so attempts
-removed from MongoDB do not remain queryable. Complete snapshots are reserved
-for explicit backfill behavior.
+Room saves collect changed attempts/results and mirror only that delta. A
+normal-room event change ends the current projected RaceSession and creates a
+new one, preserving the earlier session's attempts and solves. Complete
+snapshots are reserved for explicit backfill behavior.
+
+`GET /api/solve-history` is a PostgreSQL-only, authenticated self-history
+endpoint enabled in development and optionally for selected production users
+through `FEATURE_SOLVE_HISTORY_USER_IDS`. It returns only session-linked solves
+for a current non-banned room participant; hidden, expired, and soft-deleted
+rooms remain readable to that participant. It never falls back to MongoDB or
+selects access codes, passwords, membership lists, moderation data, or email
+data.
 
 The mirror intentionally catches database failures and returns control to the
 MongoDB-backed request. Monitoring must surface mirror errors because users may

docs/development.md

@@ -81,6 +81,11 @@ environment variables. Important groups are documented in `.env.example`:
 - CORS origins and metric retention; and
 - production TLS and backup paths.
 
+An otherwise disabled feature that opts into user targeting can be scoped to selected WCA users with
+`FEATURE_<FLAG>_USER_IDS`, a comma-separated allowlist of numeric user IDs.
+For example, `FEATURE_SOLVE_HISTORY_USER_IDS=8184` enables the solve-history
+preview only for that signed-in user while its global production flag remains off.
+
 `.env.example` is a template, not a file automatically sourced by host Node
 processes. Compose only passes variables referenced in its service environment;
 export any additional server override explicitly or add it to the relevant

packages/scrambles/package.json

@@ -22,9 +22,9 @@
     "test:ci": "yarn test"
   },
   "devDependencies": {
-    "eslint": "6.8.0",
-    "eslint-config-airbnb-base": "14.1.0",
-    "eslint-plugin-import": "2.20.2",
+    "eslint": "8.57.0",
+    "eslint-config-airbnb-base": "15.0.0",
+    "eslint-plugin-import": "2.32.0",
     "jest": "^30.4.2"
   }
 }

server/api.js

@@ -7,6 +7,7 @@ const { updateUsername } = require('./username');
 const createFriendsRouter = require('./api/friends');
 const createNotificationsRouter = require('./api/notifications');
 const createUsersRouter = require('./api/users');
+const { createSolveHistoryRouter } = require('./api/solveHistory');
 const { isFeatureEnabled } = require('./features');
 const { apiRateLimitOptions } = require('./middlewares/apiRateLimit');
 
@@ -36,6 +37,8 @@ module.exports = (app) => {
     res.json(req.user.toObject());
   });
 
+  router.use('/solve-history', auth, createSolveHistoryRouter());
+
   router.put('/updateUsername', auth, async (req, res) => {
     try {
       const user = await updateUsername(User, req.user, req.body.username);