Merge pull request #383 from FuelRats/develop

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fuelrats.com",
-  "version": "2.14.1",
+  "version": "2.14.2",
   "description": "The primary website of The Fuel Rats!",
   "homepage": "https://fuelrats.com/",
   "bugs": {
@@ -24,43 +24,43 @@
     "lint": "yarn lint:js; yarn lint:css"
   },
   "dependencies": {
-    "@fingerprintjs/fingerprintjs": "^3.3.0",
+    "@fingerprintjs/fingerprintjs": "^3.3.1",
     "@fortawesome/fontawesome-svg-core": "^1.2.36",
     "@fortawesome/free-brands-svg-icons": "^5.15.4",
     "@fortawesome/free-solid-svg-icons": "^5.15.4",
     "@fortawesome/react-fontawesome": "^0.1.16",
     "@fuelrats/next-adorable-avatars": "^0.3.0",
     "@fuelrats/validation-util": "^1.2.0",
     "@fuelrats/web-util": "^0.3.3",
-    "@next/eslint-plugin-next": "^12.0.3",
+    "@next/eslint-plugin-next": "^12.0.7",
     "axios": "^0.24.0",
     "clsx": "^1.1.1",
-    "date-fns": "^2.25.0",
-    "date-fns-tz": "^1.1.6",
+    "date-fns": "^2.27.0",
+    "date-fns-tz": "^1.1.7",
     "dotenv": "^10.0.0",
     "flux-standard-action": "^2.1.2",
     "framer-motion": "^4.1.17",
     "hoist-non-react-statics": "^3.3.2",
     "http-proxy-middleware": "^2.0.1",
-    "immer": "^9.0.6",
-    "ip6addr": "^0.2.4",
+    "immer": "^9.0.7",
+    "ip6addr": "^0.2.5",
     "js-cookie": "^3.0.1",
     "jsonfile": "^6.1.0",
     "koa-compose": "^4.1.0",
     "lodash": "^4.17.21",
-    "next": "^12.0.3",
+    "next": "^12.0.7",
     "next-cookies": "^2.0.3",
     "next-redux-wrapper": "5.0.0",
-    "next-safe": "^3.1.1",
+    "next-safe": "^3.1.3",
     "nprogress": "^0.2.0",
-    "postcss": "^8.3.11",
+    "postcss": "^8.4.5",
     "postcss-easy-import": "^3.0.0",
     "postcss-flexbugs-fixes": "^5.0.2",
-    "postcss-preset-env": "^6.7.0",
+    "postcss-preset-env": "^7.0.2",
     "prop-types": "^15.7.2",
     "pure-uuid": "^1.6.2",
-    "qs": "^6.10.1",
-    "rc-slider": "^9.7.4",
+    "qs": "^6.10.2",
+    "rc-slider": "^9.7.5",
     "re-reselect": "^4.0.0",
     "react": "^17.0.2",
     "react-copy-to-clipboard": "^5.0.4",
@@ -72,31 +72,31 @@
     "redux": "^4.1.2",
     "redux-devtools-extension": "^2.13.9",
     "redux-immutable-state-invariant": "^2.1.0",
-    "redux-thunk": "^2.4.0",
-    "reselect": "^4.1.2",
-    "stripe": "^8.186.1",
+    "redux-thunk": "^2.4.1",
+    "reselect": "^4.1.5",
+    "stripe": "^8.194.0",
     "ua-parser-js": "1.0.2",
     "use-immer": "^0.6.0",
     "zxcvbn": "^4.4.2"
   },
   "devDependencies": {
-    "@babel/core": "^7.16.0",
-    "@babel/eslint-parser": "^7.16.0",
-    "@babel/eslint-plugin": "^7.14.5",
-    "@babel/plugin-proposal-decorators": "^7.16.0",
+    "@babel/core": "^7.16.5",
+    "@babel/eslint-parser": "^7.16.5",
+    "@babel/eslint-plugin": "^7.16.5",
+    "@babel/plugin-proposal-decorators": "^7.16.5",
     "@fuelrats/babel-plugin-classnames": "^0.3.0",
-    "@fuelrats/eslint-config": "^2.4.0-canary.20",
+    "@fuelrats/eslint-config": "^2.4.0-canary.21",
     "@fuelrats/eslint-config-react": "^2.4.0-canary.19",
     "@fuelrats/eslint-plugin": "^2.4.0-canary.11",
     "@fuelrats/stylelint-config": "^2.0.0",
     "@svgr/webpack": "^5.5.0",
     "@types/hoist-non-react-statics": "^3.3.1",
     "@types/ip6addr": "^0.2.3",
-    "@types/js-cookie": "^3.0.0",
+    "@types/js-cookie": "^3.0.1",
     "@types/jsonfile": "^6.0.1",
-    "@types/lodash": "^4.14.176",
+    "@types/lodash": "^4.14.178",
     "@types/qs": "^6.9.7",
-    "@types/react": "^17.0.34",
+    "@types/react": "^17.0.37",
     "@types/react-dom": "^17.0.11",
     "@types/react-is": "^17.0.3",
     "@types/react-redux": "^7.1.20",
@@ -109,18 +109,18 @@
     "eslint": "^7.32.0",
     "eslint-import-resolver-alias": "^1.1.2",
     "eslint-import-resolver-node": "^0.3.6",
-    "eslint-plugin-import": "^2.25.2",
-    "eslint-plugin-jsdoc": "^37.0.3",
-    "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-react": "^7.26.1",
-    "eslint-plugin-react-hooks": "^4.2.0",
+    "eslint-plugin-import": "^2.25.3",
+    "eslint-plugin-jsdoc": "^37.2.4",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-react": "^7.27.1",
+    "eslint-plugin-react-hooks": "^4.3.0",
     "postcss-scss": "^4.0.2",
-    "sass": "^1.43.4",
+    "sass": "^1.45.0",
     "semver": "^7.3.5",
-    "stylelint": "^14.0.1",
+    "stylelint": "^14.1.0",
     "stylelint-order": "^5.0.0",
-    "stylelint-scss": "^4.0.0",
-    "webpack": "^5.62.1",
+    "stylelint-scss": "^4.0.1",
+    "webpack": "^5.65.0",
     "worker-loader": "^3.0.8"
   },
   "engines": {

src/components/Fieldsets/IRCNickFieldset.js

@@ -1,4 +1,4 @@
-import { useCallback } from 'react'
+import { useCallback, useMemo } from 'react'
 
 import { ircNickRegExp } from '~/data/RegExpr'
 
@@ -10,10 +10,17 @@ import InputFieldset, { useValidationCallback } from './InputFieldset'
 
 export default function IRCNickFieldset (props) {
   const {
+    registeredNicks,
     onValidate: parentValidate,
     ...inputProps
   } = props
 
+  const nickStrings = useMemo(() => {
+    return registeredNicks?.map((nick) => {
+      return nick.attributes.nick.toLowerCase()
+    })
+  }, [registeredNicks])
+
   const handleChange = useCallback(
     ({ target }) => {
       target.value = target.value.replace(/\s/gu, '_')
@@ -33,11 +40,21 @@ export default function IRCNickFieldset (props) {
         )
       }
 
-      if (value.match(/(\[.*\]|\|)/u)) {
-        messages.errors.push('Your primary nickname cannot contain a platform/status tag. It should be as close as possible to your CMDR name')
+      const tagMatch = value.match(/^(.*)([\[{|](.*)[\]}|]?)$/u)
+
+      if (Array.isArray(tagMatch)) {
+        if (nickStrings?.length) {
+          const [, baseNick] = tagMatch
+
+          if (!nickStrings.includes(baseNick.toLowerCase())) {
+            messages.errors.push(`To register this nick, please register "${baseNick}" first!`)
+          }
+        } else {
+          messages.errors.push('Your primary nickname cannot contain a platform/status tag. It should be as close as possible to your CMDR name')
+        }
       }
     },
-    [],
+    [nickStrings],
     parentValidate,
   )
 

src/components/Forms/AddNicknameForm/AddNicknameForm.js

@@ -5,7 +5,6 @@ import { useCallback, useState } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 
 import IRCNickFieldset from '~/components/Fieldsets/IRCNickFieldset'
-import InfoBubble from '~/components/InfoBubble'
 import useForm from '~/hooks/useForm'
 import { addNickname } from '~/store/actions/user'
 import { selectUserById, withCurrentUserId } from '~/store/selectors'
@@ -60,11 +59,8 @@ function AddNicknameForm (props) {
         id="AddNickname"
         name="attributes.nick"
         placeholder={error ?? 'Add a nickname...'}
-        title={props.title}>
-        <InfoBubble className={styles.nicknamesInfo} header="reminder" id="NickRegisterReminder">
-          {"You cannot register a nick that's in use on IRC. Switch to a temporary one before registering!"}
-        </InfoBubble>
-      </IRCNickFieldset>
+        registeredNicks={props.registeredNicks}
+        title={props.title} />
 
       <button
         aria-label="submit new nickname"

src/components/UserNicknamesPanel/UserNicknamesPanel.js

@@ -110,6 +110,7 @@ function UserNicknamesPanel () {
         <div className={styles.addNicknameFloat}>
           <AddNicknameForm
             disabled={maxNicksReached}
+            registeredNicks={nicknames}
             title={maxNicksReached ? 'You\'ve used all your nicknames' : 'Add new nickname'} />
         </div>
       </div>

src/util/jsonapi/createRequestBody.js

@@ -7,7 +7,7 @@ export default function createRequestBody (
 ) {
   const {
     id,
-    type: _, // strip type from data if it's given. We will always prefer the predefined type.
+    type: _t, // strip type from data if it's given. We will always prefer the predefined type.
     attributes = {},
     relationships,
     links, // API doesn't understand links or meta in resources we send to it, so we strip them here.