4.208.1

Currently translated at 100.0% (373 of 373 strings)

Translated using Weblate (French)

Currently translated at 100.0% (203 of 203 strings)

Translated using Weblate (French)

Currently translated at 100.0% (56 of 56 strings)

Translated using Weblate (French)

Currently translated at 100.0% (47 of 47 strings)

Translated using Weblate (Russian)

Currently translated at 99.8% (737 of 738 strings)

Translated using Weblate (Ukrainian)

Currently translated at 87.5% (7 of 8 strings)

Translated using Weblate (Japanese)

Currently translated at 100.0% (2413 of 2413 strings)

Translated using Weblate (Japanese)

Currently translated at 100.0% (738 of 738 strings)

Translated using Weblate (Thai)

Currently translated at 34.4% (41 of 119 strings)

Co-authored-by: Benoit Hetru <me+hbtc@gahanka.net>
Co-authored-by: Sirapat Charukamnertkanok <sirapat1charu@gmail.com>
Co-authored-by: Weblate <noreply@weblate.org>
Co-authored-by: mattya 226 <worldworld1114@gmail.com>
Co-authored-by: Естай <akseleu@yahoo.com>
Co-authored-by: Назар Коцур <bicolino34@gmail.com>
Translate-URL: https://translate.habitica.com/projects/habitica/achievements/th/
Translate-URL: https://translate.habitica.com/projects/habitica/contrib/fr/
Translate-URL: https://translate.habitica.com/projects/habitica/faq/fr/
Translate-URL: https://translate.habitica.com/projects/habitica/gear/ja/
Translate-URL: https://translate.habitica.com/projects/habitica/generic/fr/
Translate-URL: https://translate.habitica.com/projects/habitica/groups/fr/
Translate-URL: https://translate.habitica.com/projects/habitica/inventory/uk/
Translate-URL: https://translate.habitica.com/projects/habitica/questscontent/ja/
Translate-URL: https://translate.habitica.com/projects/habitica/questscontent/ru/
Translation: Habitica/Achievements
Translation: Habitica/Contrib
Translation: Habitica/Faq
Translation: Habitica/Gear
Translation: Habitica/Generic
Translation: Habitica/Groups
Translation: Habitica/Inventory
Translation: Habitica/Questscontent

.eslintignore

@@ -8,10 +8,10 @@ website/client/
 website/common/transpiled-babel/
 dist/
 dist-client/
-apidoc_build/
+apidoc/html/
 content_cache/
 i18n_cache/
 node_modules/
 
 # Old migrations, disabled
-migrations/archive/*
+migrations/archive/*

.github/ISSUE_TEMPLATE.md

@@ -1,4 +1,4 @@
-[//]: # (Before logging this issue, please post to the Report a Bug guild from the Habitica website's Help menu. Most bugs can be handled quickly there. If a GitHub issue is needed, you will be advised of that by a moderator or staff member -- a player with a dark blue or purple name. It is recommended that you don't create a new issue unless advised to.)
+[//]: # (Before logging this issue, please contact site administrators from the Habitica website's Help menu. Most bugs can be handled quickly there. If a GitHub issue is needed, staff will let you know. It is recommended that you don't create a new issue unless advised to.)
 
 [//]: # (Bugs in the mobile apps can also be reported there.)
 
@@ -6,15 +6,14 @@
 
 [//]: # (For more guidelines see https://github.com/HabitRPG/habitica/issues/2760)
 
-[//]: # (Fill out relevant information - UUID is found from the Habitia website at User Icon > Settings > API)
+[//]: # (Fill out relevant information - UUID is found from the Habitica website at User Icon > Settings > API)
 ### General Info
-  * UUID: 
-  * Browser: 
-  * OS: 
+  * UUID:
+  * Browser:
+  * OS:
 
 ### Description
 [//]: # (Describe bug in detail here. Include screenshots if helpful.)
 
 #### Console Errors
 [//]: # (Include any JavaScript console errors here.)
-

.github/dependabot.yml

@@ -0,0 +1,186 @@
+version: 2
+updates:
+- package-ecosystem: npm
+  directory: "/"
+  schedule:
+    interval: weekly
+    time: "06:00"
+    timezone: Europe/Rome
+  open-pull-requests-limit: 99
+  ignore:
+  - dependency-name: express-validator
+    versions:
+    - 6.10.0
+    - 6.10.1
+    - 6.9.2
+  - dependency-name: "@babel/core"
+    versions:
+    - 7.12.13
+    - 7.12.16
+    - 7.12.17
+    - 7.13.1
+    - 7.13.10
+    - 7.13.13
+    - 7.13.14
+    - 7.13.15
+    - 7.13.8
+  - dependency-name: redis
+    versions:
+    - 3.1.0
+  - dependency-name: stripe
+    versions:
+    - 8.134.0
+    - 8.135.0
+    - 8.137.0
+    - 8.138.0
+    - 8.140.0
+    - 8.142.0
+  - dependency-name: "@babel/register"
+    versions:
+    - 7.12.13
+    - 7.13.14
+    - 7.13.8
+  - dependency-name: mongoose
+    versions:
+    - 5.11.14
+    - 5.11.15
+    - 5.11.16
+    - 5.11.17
+    - 5.11.18
+    - 5.11.19
+    - 5.12.0
+    - 5.12.1
+    - 5.12.2
+    - 5.12.3
+  - dependency-name: jwks-rsa
+    versions:
+    - 1.12.3
+    - 2.0.1
+    - 2.0.2
+  - dependency-name: "@babel/preset-env"
+    versions:
+    - 7.12.13
+    - 7.12.16
+    - 7.12.17
+    - 7.13.10
+    - 7.13.12
+    - 7.13.8
+    - 7.13.9
+  - dependency-name: image-size
+    versions:
+    - 0.9.4
+    - 0.9.5
+    - 0.9.7
+  - dependency-name: winston-loggly-bulk
+    versions:
+    - 3.2.0
+  - dependency-name: chai
+    versions:
+    - 4.3.0
+    - 4.3.3
+  - dependency-name: mocha
+    versions:
+    - 8.2.1
+    - 8.3.0
+    - 8.3.1
+  - dependency-name: "@google-cloud/trace-agent"
+    versions:
+    - 5.1.2
+  - dependency-name: monk
+    versions:
+    - 7.3.3
+- package-ecosystem: npm
+  directory: "/website/client"
+  schedule:
+    interval: weekly
+    time: "06:00"
+    timezone: Europe/Rome
+  open-pull-requests-limit: 99
+  ignore:
+  - dependency-name: eslint-plugin-vue
+    versions:
+    - 7.5.0
+    - 7.6.0
+    - 7.7.0
+    - 7.8.0
+    - 7.9.0
+  - dependency-name: "@storybook/addon-knobs"
+    versions:
+    - 6.1.17
+    - 6.1.18
+    - 6.1.20
+    - 6.1.21
+    - 6.2.2
+    - 6.2.3
+    - 6.2.7
+  - dependency-name: "@storybook/addon-links"
+    versions:
+    - 6.1.17
+    - 6.1.18
+    - 6.1.20
+    - 6.1.21
+    - 6.2.2
+    - 6.2.3
+    - 6.2.7
+  - dependency-name: "@storybook/vue"
+    versions:
+    - 6.1.17
+    - 6.1.18
+    - 6.1.20
+    - 6.1.21
+    - 6.2.2
+    - 6.2.3
+    - 6.2.7
+  - dependency-name: "@storybook/addon-actions"
+    versions:
+    - 6.1.17
+    - 6.1.18
+    - 6.1.20
+    - 6.1.21
+    - 6.2.2
+    - 6.2.3
+    - 6.2.7
+  - dependency-name: core-js
+    versions:
+    - 3.10.0
+    - 3.10.1
+    - 3.9.0
+    - 3.9.1
+  - dependency-name: bootstrap
+    versions:
+    - 4.6.0
+  - dependency-name: y18n
+    versions:
+    - 4.0.1
+  - dependency-name: hellojs
+    versions:
+    - 1.18.8
+    - 1.19.2
+  - dependency-name: chai
+    versions:
+    - 4.3.0
+    - 4.3.3
+  - dependency-name: amplitude-js
+    versions:
+    - 7.4.2
+    - 7.4.3
+    - 7.4.4
+  - dependency-name: pug
+    versions:
+    - 3.0.2
+  - dependency-name: sass
+    versions:
+    - 1.32.6
+    - 1.32.7
+    - 1.32.8
+  - dependency-name: "@vue/test-utils"
+    versions:
+    - 1.1.2
+    - 1.1.3
+  - dependency-name: intro.js
+    versions:
+    - 3.2.1
+    - 3.3.1
+  - dependency-name: sass-loader
+    versions:
+    - 10.1.1

.github/workflows/test.yml

@@ -219,4 +219,25 @@ jobs:
         CI: true
         NODE_ENV: test
     - run: npm run test:unit
-      working-directory: ./website/client
+      working-directory: ./website/client
+
+  production-build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [14.x]
+    steps:
+    - uses: actions/checkout@v1
+      with:
+        fetch-depth: 1
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v1
+      with:
+        node-version: ${{ matrix.node-version }}
+    - run: cp config.json.example config.json
+    - name: npm install
+      run: |
+        npm install
+      env:
+        CI: true
+        NODE_ENV: production

.gitignore

@@ -5,7 +5,7 @@ website/common/transpiled-babel/
 node_modules
 content_cache
 i18n_cache
-apidoc_build
+apidoc/html
 *.swp
 .idea*
 config.json

README.md

@@ -9,6 +9,6 @@ Habitica ![Build Status](https://github.com/HabitRPG/habitica/workflows/Test/bad
 
 Habitica's code is licensed as described at https://github.com/HabitRPG/habitica/blob/develop/LICENSE
 
-**Found a bug?** Please report it in the [Report a Bug guild](https://habitica.com/groups/guild/a29da26b-37de-4a71-b0c6-48e72a900dac) rather than creating an issue (an admin will advise you if a new issue is necessary; usually it is not).
+**Found a bug?** Please report it to [admin email](mailto:admin@habitica.com) rather than creating an issue (an admin will advise you if a new issue is necessary; usually it is not).
 
 **Have any questions about Habitica or its community?** See the links in the [habitica.com](https://habitica.com) website's Help menu or drop in to [Guilds > Tavern Chat](https://habitica.com/groups/tavern) to ask questions or chat socially!

apidoc/apidoc.json

@@ -2,6 +2,7 @@
   "name": "Habitica V3 API Documentation",
   "title": "Habitica",
   "url": "https://habitica.com",
+  "sampleUrl": null,
   "header": {
     "title": "Introduction",
     "filename": "apidoc/header.md"

apidoc/header.md

@@ -2,4 +2,4 @@
 
 This webpage includes the documentation for version 3 of the [Habitica](https://habitica.com) API.
 
-If you're developing a 3rd party tool that uses the Habitica API you should read the [Guidance for Comrades](https://habitica.fandom.com/wiki/Guidance_for_Comrades) and in particular the section called [Rules for Third-Party Tools](https://habitica.fandom.com/wiki/Guidance_for_Comrades#Rules_for_Third-Party_Tools) which includes suggestions on how to best use the API and the rules to follow when interacting with it. 
+If you're developing a 3rd party tool that uses the Habitica API you should read the [Guidance for Comrades](https://habitica.fandom.com/wiki/Guidance_for_Comrades) and in particular the section called [Rules for Third-Party Tools](https://habitica.fandom.com/wiki/Guidance_for_Comrades#Rules_for_Third-Party_Tools) which includes suggestions on how to best use the API and the rules to follow when interacting with it.

gulp/gulp-apidoc.js

@@ -2,8 +2,9 @@ import gulp from 'gulp';
 import clean from 'rimraf';
 import apidoc from 'apidoc';
 
-const APIDOC_DEST_PATH = './apidoc_build';
+const APIDOC_DEST_PATH = './apidoc/html';
 const APIDOC_SRC_PATH = './website/server';
+const APIDOC_CONFIG_PATH = './apidoc/apidoc.json';
 gulp.task('apidoc:clean', done => {
   clean(APIDOC_DEST_PATH, done);
 });
@@ -12,6 +13,7 @@ gulp.task('apidoc', gulp.series('apidoc:clean', done => {
   const result = apidoc.createDoc({
     src: APIDOC_SRC_PATH,
     dest: APIDOC_DEST_PATH,
+    config: APIDOC_CONFIG_PATH,
   });
 
   if (result === false) {

migrations/archive/2021/20210525_pet_color_achievements.js

@@ -0,0 +1,82 @@
+/* eslint-disable no-console */
+const MIGRATION_NAME = '20210525_pet_color_achievements';
+import { model as User } from '../../../website/server/models/user';
+
+const progressCount = 1000;
+let count = 0;
+
+async function updateUser (user) {
+  count++;
+
+  const set = {
+    migration: MIGRATION_NAME,
+  };
+
+  if (user && user.items && user.items.pets) {
+    const pets = user.items.pets;
+    if (pets['Wolf-CottonCandyBlue'] > 0
+      && pets['TigerCub-CottonCandyBlue'] > 0
+      && pets['PandaCub-CottonCandyBlue'] > 0
+      && pets['LionCub-CottonCandyBlue'] > 0
+      && pets['Fox-CottonCandyBlue'] > 0
+      && pets['FlyingPig-CottonCandyBlue'] > 0
+      && pets['Dragon-CottonCandyBlue'] > 0
+      && pets['Cactus-CottonCandyBlue'] > 0
+      && pets['BearCub-CottonCandyBlue'] > 0) {
+        set['achievements.violetsAreBlue'] = true;
+      }
+  }
+
+  if (user && user.items && user.items.mounts) {
+    const mounts = user.items.mounts;
+    if (mounts['Wolf-CottonCandyBlue']
+      && mounts['TigerCub-CottonCandyBlue']
+      && mounts['PandaCub-CottonCandyBlue']
+      && mounts['LionCub-CottonCandyBlue']
+      && mounts['Fox-CottonCandyBlue']
+      && mounts['FlyingPig-CottonCandyBlue']
+      && mounts['Dragon-CottonCandyBlue']
+      && mounts['Cactus-CottonCandyBlue']
+      && mounts['BearCub-CottonCandyBlue'] ) {
+        set['achievements.wildBlueYonder'] = true;
+      }
+  }
+
+  if (count % progressCount === 0) console.warn(`${count} ${user._id}`);
+
+  return await User.update({ _id: user._id }, { $set: set }).exec();
+}
+
+module.exports = async function processUsers () {
+  let query = {
+    migration: { $ne: MIGRATION_NAME },
+    'auth.timestamps.loggedin': { $gt: new Date('2021-05-01') },
+  };
+
+  const fields = {
+    _id: 1,
+    items: 1,
+  };
+
+  while (true) { // eslint-disable-line no-constant-condition
+    const users = await User // eslint-disable-line no-await-in-loop
+      .find(query)
+      .limit(250)
+      .sort({_id: 1})
+      .select(fields)
+      .lean()
+      .exec();
+
+    if (users.length === 0) {
+      console.warn('All appropriate users found and modified.');
+      console.warn(`\n${count} users processed\n`);
+      break;
+    } else {
+      query._id = {
+        $gt: users[users.length - 1]._id,
+      };
+    }
+
+    await Promise.all(users.map(updateUser)); // eslint-disable-line no-await-in-loop
+  }
+};

migrations/archive/2021/20210824_pet_group_achievements.js

@@ -0,0 +1,138 @@
+/* eslint-disable no-console */
+const MIGRATION_NAME = '20210824_pet_group_achievements';
+import { model as User } from '../../../website/server/models/user';
+
+const progressCount = 1000;
+let count = 0;
+
+async function updateUser (user) {
+  count++;
+
+  const set = {
+    migration: MIGRATION_NAME,
+  };
+
+  if (user && user.items && user.items.pets) {
+    const pets = user.items.pets;
+    if (pets['FlyingPig-Base']
+      && pets['FlyingPig-CottonCandyBlue']
+      && pets['FlyingPig-CottonCandyPink']
+      && pets['FlyingPig-Desert']
+      && pets['FlyingPig-Golden']
+      && pets['FlyingPig-Red']
+      && pets['FlyingPig-Shade']
+      && pets['FlyingPig-Skeleton']
+      && pets['FlyingPig-White']
+      && pets['FlyingPig-Zombie']
+      && pets['Ferret-Base']
+      && pets['Ferret-CottonCandyBlue']
+      && pets['Ferret-CottonCandyPink']
+      && pets['Ferret-Desert']
+      && pets['Ferret-Golden']
+      && pets['Ferret-Red']
+      && pets['Ferret-Shade']
+      && pets['Ferret-Skeleton']
+      && pets['Ferret-White']
+      && pets['Ferret-Zombie']
+      && pets['GuineaPig-Base']
+      && pets['GuineaPig-CottonCandyBlue']
+      && pets['GuineaPig-CottonCandyPink']
+      && pets['GuineaPig-Desert']
+      && pets['GuineaPig-Golden']
+      && pets['GuineaPig-Red']
+      && pets['GuineaPig-Shade']
+      && pets['GuineaPig-Skeleton']
+      && pets['GuineaPig-White']
+      && pets['GuineaPig-Zombie']
+      && pets['Rooster-Base']
+      && pets['Rooster-CottonCandyBlue']
+      && pets['Rooster-CottonCandyPink']
+      && pets['Rooster-Desert']
+      && pets['Rooster-Golden']
+      && pets['Rooster-Red']
+      && pets['Rooster-Shade']
+      && pets['Rooster-Skeleton']
+      && pets['Rooster-White']
+      && pets['Rooster-Zombie']
+      && pets['Rat-Base']
+      && pets['Rat-CottonCandyBlue']
+      && pets['Rat-CottonCandyPink']
+      && pets['Rat-Desert']
+      && pets['Rat-Golden']
+      && pets['Rat-Red']
+      && pets['Rat-Shade']
+      && pets['Rat-Skeleton']
+      && pets['Rat-White']
+      && pets['Rat-Zombie']
+      && pets['Bunny-Base']
+      && pets['Bunny-CottonCandyBlue']
+      && pets['Bunny-CottonCandyPink']
+      && pets['Bunny-Desert']
+      && pets['Bunny-Golden']
+      && pets['Bunny-Red']
+      && pets['Bunny-Shade']
+      && pets['Bunny-Skeleton']
+      && pets['Bunny-White']
+      && pets['Bunny-Zombie']
+      && pets['Horse-Base']
+      && pets['Horse-CottonCandyBlue']
+      && pets['Horse-CottonCandyPink']
+      && pets['Horse-Desert']
+      && pets['Horse-Golden']
+      && pets['Horse-Red']
+      && pets['Horse-Shade']
+      && pets['Horse-Skeleton']
+      && pets['Horse-White']
+      && pets['Horse-Zombie']
+      && pets['Cow-Base']
+      && pets['Cow-CottonCandyBlue']
+      && pets['Cow-CottonCandyPink']
+      && pets['Cow-Desert']
+      && pets['Cow-Golden']
+      && pets['Cow-Red']
+      && pets['Cow-Shade']
+      && pets['Cow-Skeleton']
+      && pets['Cow-White']
+      && pets['Cow-Zombie']) {
+        set['achievements.domesticated'] = true;
+      }
+  }
+
+  if (count % progressCount === 0) console.warn(`${count} ${user._id}`);
+
+  return await User.update({ _id: user._id }, { $set: set }).exec();
+}
+
+export default async function processUsers () {
+  let query = {
+    // migration: { $ne: MIGRATION_NAME },
+    'auth.timestamps.loggedin': { $gt: new Date('2021-08-01') },
+  };
+
+  const fields = {
+    _id: 1,
+    items: 1,
+  };
+
+  while (true) { // eslint-disable-line no-constant-condition
+    const users = await User // eslint-disable-line no-await-in-loop
+      .find(query)
+      .limit(250)
+      .sort({_id: 1})
+      .select(fields)
+      .lean()
+      .exec();
+
+    if (users.length === 0) {
+      console.warn('All appropriate users found and modified.');
+      console.warn(`\n${count} users processed\n`);
+      break;
+    } else {
+      query._id = {
+        $gt: users[users.length - 1]._id,
+      };
+    }
+
+    await Promise.all(users.map(updateUser)); // eslint-disable-line no-await-in-loop
+  }
+};

migrations/users/pi-day.js

@@ -3,7 +3,7 @@ import { v4 as uuid } from 'uuid';
 
 import { model as User } from '../../website/server/models/user';
 
-const MIGRATION_NAME = '20200314_pi_day';
+const MIGRATION_NAME = '20210314_pi_day';
 
 const progressCount = 1000;
 let count = 0;
@@ -54,7 +54,7 @@ async function updateUser (user) {
 export default async function processUsers () {
   const query = {
     migration: { $ne: MIGRATION_NAME },
-    'auth.timestamps.loggedin': { $gt: new Date('2020-02-15') },
+    'auth.timestamps.loggedin': { $gt: new Date('2021-02-15') },
   };
 
   const fields = {

package.json

@@ -1,26 +1,27 @@
 {
   "name": "habitica",
   "description": "A habit tracker app which treats your goals like a Role Playing Game.",
-  "version": "4.184.0",
+  "version": "4.208.1",
   "main": "./website/server/index.js",
   "dependencies": {
-    "@babel/core": "^7.12.10",
-    "@babel/preset-env": "^7.12.11",
-    "@babel/register": "^7.12.10",
-    "@google-cloud/trace-agent": "^5.1.1",
-    "@parse/node-apn": "^4.0.0",
-    "@slack/webhook": "^5.0.4",
+    "@babel/core": "^7.15.5",
+    "@babel/preset-env": "^7.15.6",
+    "@babel/register": "^7.15.3",
+    "@google-cloud/trace-agent": "^5.1.5",
+    "@parse/node-apn": "^4.1.1",
+    "@slack/webhook": "^6.0.0",
     "accepts": "^1.3.5",
-    "amazon-payments": "^0.2.8",
-    "amplitude": "^5.1.4",
-    "apidoc": "^0.26.0",
+    "amazon-payments": "^0.2.9",
+    "amplitude": "^5.1.7",
+    "apidoc": "^0.29.0",
     "apple-auth": "^1.0.7",
-    "bcrypt": "^5.0.0",
+    "bcrypt": "^5.0.1",
     "body-parser": "^1.18.3",
+    "bootstrap": "^4.6.0",
     "compression": "^1.7.4",
     "cookie-session": "^1.4.0",
     "coupon-code": "^0.4.5",
-    "csv-stringify": "^5.6.1",
+    "csv-stringify": "^5.6.5",
     "cwait": "^1.1.1",
     "domain-middleware": "~0.1.0",
     "eslint": "^6.8.0",
@@ -29,52 +30,52 @@
     "express": "^4.16.3",
     "express-basic-auth": "^1.1.5",
     "express-validator": "^5.2.0",
-    "glob": "^7.1.6",
-    "got": "^11.8.1",
+    "glob": "^7.1.7",
+    "got": "^11.8.2",
     "gulp": "^4.0.0",
     "gulp-babel": "^8.0.0",
     "gulp-imagemin": "^7.1.0",
     "gulp-nodemon": "^2.5.0",
-    "gulp.spritesmith": "^6.9.0",
+    "gulp.spritesmith": "^6.12.1",
     "habitica-markdown": "^3.0.0",
-    "helmet": "^4.4.1",
-    "image-size": "^0.9.3",
+    "helmet": "^4.6.0",
+    "image-size": "^1.0.0",
     "in-app-purchase": "^1.11.3",
     "js2xmlparser": "^4.0.1",
     "jsonwebtoken": "^8.5.1",
-    "jwks-rsa": "^1.12.2",
-    "lodash": "^4.17.20",
+    "jwks-rsa": "^2.0.4",
+    "lodash": "^4.17.21",
     "merge-stream": "^2.0.0",
     "method-override": "^3.0.0",
     "moment": "^2.29.1",
     "moment-recur": "^1.0.7",
-    "mongoose": "^5.11.13",
+    "mongoose": "^5.13.7",
     "morgan": "^1.10.0",
-    "nconf": "^0.11.1",
-    "node-gcm": "^1.0.3",
+    "nconf": "^0.11.3",
+    "node-gcm": "^1.0.5",
     "on-headers": "^1.0.2",
     "passport": "^0.4.1",
     "passport-facebook": "^3.0.0",
     "passport-google-oauth2": "^0.2.0",
-    "passport-google-oauth20": "1.0.0",
+    "passport-google-oauth20": "2.0.0",
     "paypal-rest-sdk": "^1.8.1",
     "pp-ipn": "^1.1.0",
     "ps-tree": "^1.0.0",
-    "rate-limiter-flexible": "^2.2.1",
-    "redis": "^3.0.2",
-    "regenerator-runtime": "^0.13.7",
+    "rate-limiter-flexible": "^2.2.4",
+    "redis": "^3.1.2",
+    "regenerator-runtime": "^0.13.9",
     "remove-markdown": "^0.3.0",
     "rimraf": "^3.0.2",
-    "short-uuid": "^4.1.0",
-    "stripe": "^8.132.0",
+    "short-uuid": "^4.2.0",
+    "stripe": "^8.174.0",
     "superagent": "^6.1.0",
     "universal-analytics": "^0.4.23",
     "useragent": "^2.1.9",
     "uuid": "^8.3.2",
-    "validator": "^13.5.2",
+    "validator": "^13.6.0",
     "vinyl-buffer": "^1.0.1",
     "winston": "^3.3.3",
-    "winston-loggly-bulk": "^3.1.1",
+    "winston-loggly-bulk": "^3.2.1",
     "xml2js": "^0.4.23"
   },
   "private": true,
@@ -109,20 +110,20 @@
     "apidoc": "gulp apidoc"
   },
   "devDependencies": {
-    "axios": "^0.21.1",
-    "chai": "^4.1.2",
+    "axios": "^0.21.4",
+    "chai": "^4.3.4",
     "chai-as-promised": "^7.1.1",
     "chai-moment": "^0.1.0",
-    "chalk": "^4.1.0",
+    "chalk": "^4.1.2",
     "cross-spawn": "^7.0.3",
     "expect.js": "^0.3.1",
     "istanbul": "^1.1.0-alpha.1",
     "mocha": "^5.1.1",
-    "monk": "^7.3.2",
+    "monk": "^7.3.4",
     "require-again": "^2.0.0",
-    "run-rs": "^0.7.4",
-    "sinon": "^9.2.4",
-    "sinon-chai": "^3.5.0",
+    "run-rs": "^0.7.5",
+    "sinon": "^11.1.2",
+    "sinon-chai": "^3.7.0",
     "sinon-stub-promise": "^4.0.0"
   },
   "optionalDependencies": {}

scripts/gdpr-delete-users.js

@@ -31,7 +31,6 @@ async function deleteAmplitudeData (userId, email) {
       console.log(`${userId} (${email}) Amplitude response: ${response.status} ${response.statusText}`);
     }
   }
-  await new Promise(resolve => setTimeout(resolve, 1000));
 }
 
 async function deleteHabiticaData (user, email) {
@@ -83,6 +82,7 @@ async function processEmailAddress (email) {
       $or: [
         { 'auth.facebook.emails.value': email },
         { 'auth.google.emails.value': email },
+        { 'auth.apple.emails.value': email },
       ],
     },
     { _id: 1, apiToken: 1, auth: 1 },
@@ -96,6 +96,7 @@ async function processEmailAddress (email) {
     return console.log(`No users found with email address ${email}`);
   }
 
+  await new Promise(resolve => setTimeout(resolve, 1000));
   return Promise.all(users.map(user => (async () => {
     await deleteAmplitudeData(user._id, email); // eslint-disable-line no-await-in-loop
     await deleteHabiticaData(user, email); // eslint-disable-line no-await-in-loop

test/api/unit/libs/highlightMentions.test.js

@@ -11,14 +11,14 @@ describe('highlightMentions', () => {
       lean () {
         return this;
       },
-      exec () {
-        return Promise.resolve([
+      async exec () {
+        return [
           { auth: { local: { username: 'user' } }, _id: '111' },
           { auth: { local: { username: 'user2' } }, _id: '222' },
           { auth: { local: { username: 'user3' } }, _id: '333' },
           { auth: { local: { username: 'user-dash' } }, _id: '444' },
           { auth: { local: { username: 'user_underscore' } }, _id: '555' },
-        ]);
+        ];
       },
     };
 
@@ -168,35 +168,50 @@ describe('highlightMentions', () => {
     });
   });
 
-  it('github issue 12118, method crashes when square brackets are used', async () => {
-    const text = '[test]';
+  describe('issues', () => {
+    it('github issue 12118, method crashes when square brackets are used', async () => {
+      const text = '[test]';
 
-    const result = await highlightMentions(text);
+      const result = await highlightMentions(text);
 
-    expect(result[0]).to.equal(text);
+      expect(result[0]).to.equal(text);
+    });
+
+    it('github issue 12138, method crashes when regex chars are used in code block', async () => {
+      const text = '`[test]`';
+
+      const result = await highlightMentions(text);
+
+      expect(result[0]).to.equal(text);
+    });
+
+    it('github issue 12586, method crashes when empty link is used', async () => {
+      const text = '[]()';
+
+      const result = await highlightMentions(text);
+
+      expect(result[0]).to.equal(text);
+    });
+
+    it('github issue 12586, method crashes when link without title is used', async () => {
+      const text = '[](www.google.com)';
+
+      const result = await highlightMentions(text);
+
+      expect(result[0]).to.equal(text);
+    });
   });
 
-  it('github issue 12138, method crashes when regex chars are used in code block', async () => {
-    const text = '`[test]`';
+  describe('base url', () => {
+    it('should prefix habitica.com if it is production', async () => {
+      const OLD_NODE_ENV = process.env.NODE_ENV;
+      process.env.NODE_ENV = 'production';
+      const text = '@user';
 
-    const result = await highlightMentions(text);
+      const result = await highlightMentions(text);
 
-    expect(result[0]).to.equal(text);
-  });
-
-  it('github issue 12586, method crashes when empty link is used', async () => {
-    const text = '[]()';
-
-    const result = await highlightMentions(text);
-
-    expect(result[0]).to.equal(text);
-  });
-
-  it('github issue 12586, method crashes when link without title is used', async () => {
-    const text = '[](www.google.com)';
-
-    const result = await highlightMentions(text);
-
-    expect(result[0]).to.equal(text);
+      expect(result[0]).to.equal('[@user](https://habitica.com/profile/111)');
+      process.env.NODE_ENV = OLD_NODE_ENV;
+    });
   });
 });

test/api/unit/libs/taskManager.js

@@ -1,9 +1,11 @@
 import {
   createTasks,
   getTasks,
+} from '../../../../website/server/libs/tasks';
+import {
   syncableAttrs,
   moveTask,
-} from '../../../../website/server/libs/taskManager';
+} from '../../../../website/server/libs/tasks/utils';
 import i18n from '../../../../website/common/script/i18n';
 import shared from '../../../../website/common/script';
 import {

test/api/unit/libs/webhooks.test.js

@@ -656,9 +656,11 @@ describe('webhooks', () => {
           id: 'group-id',
           name: 'some group',
           otherData: 'foo',
+          quest: {},
         },
         quest: {
           key: 'some-key',
+          questOwner: 'user-id',
         },
       };
     });

test/api/unit/middlewares/cronMiddleware.js

@@ -293,90 +293,4 @@ describe('cron middleware', () => {
       });
     });
   });
-
-  context('Drop Cap A/B Test', async () => {
-    it('enrolls web users', async () => {
-      user.lastCron = moment(new Date()).subtract({ days: 2 });
-      await user.save();
-      req.headers['x-client'] = 'habitica-web';
-
-      await new Promise((resolve, reject) => {
-        cronMiddleware(req, res, async err => {
-          if (err) return reject(err);
-          user = await User.findById(user._id).exec();
-          expect(user._ABtests.dropCapNotif).to.be.a.string;
-
-          return resolve();
-        });
-      });
-    });
-
-    it('enables the new notification for 50% of users', async () => {
-      sandbox.stub(Math, 'random').returns(0.5);
-      user.lastCron = moment(new Date()).subtract({ days: 2 });
-      await user.save();
-      req.headers['x-client'] = 'habitica-web';
-
-      await new Promise((resolve, reject) => {
-        cronMiddleware(req, res, async err => {
-          if (err) return reject(err);
-          user = await User.findById(user._id).exec();
-          expect(user._ABtests.dropCapNotif).to.be.equal('drop-cap-notif-enabled');
-
-          return resolve();
-        });
-      });
-    });
-
-    it('disables the new notification for 50% of users', async () => {
-      sandbox.stub(Math, 'random').returns(0.51);
-      user.lastCron = moment(new Date()).subtract({ days: 2 });
-      await user.save();
-      req.headers['x-client'] = 'habitica-web';
-
-      await new Promise((resolve, reject) => {
-        cronMiddleware(req, res, async err => {
-          if (err) return reject(err);
-          user = await User.findById(user._id).exec();
-          expect(user._ABtests.dropCapNotif).to.be.equal('drop-cap-notif-disabled');
-
-          return resolve();
-        });
-      });
-    });
-
-    it('does not affect subscribers', async () => {
-      sandbox.stub(Math, 'random').returns(0.2);
-      user.lastCron = moment(new Date()).subtract({ days: 2 });
-      await user.save();
-      req.headers['x-client'] = 'habitica-web';
-      sandbox.stub(User.prototype, 'isSubscribed').returns(true);
-
-      await new Promise((resolve, reject) => {
-        cronMiddleware(req, res, async err => {
-          if (err) return reject(err);
-          user = await User.findById(user._id).exec();
-          expect(user._ABtests.dropCapNotif).to.not.exist;
-
-          return resolve();
-        });
-      });
-    });
-
-    it('does not affect mobile users', async () => {
-      user.lastCron = moment(new Date()).subtract({ days: 2 });
-      await user.save();
-      req.headers['x-client'] = 'habitica-ios';
-
-      await new Promise((resolve, reject) => {
-        cronMiddleware(req, res, async err => {
-          if (err) return reject(err);
-          user = await User.findById(user._id).exec();
-          expect(user._ABtests.dropCapNotif).to.not.exist;
-
-          return resolve();
-        });
-      });
-    });
-  });
 });

test/api/unit/models/group.test.js

@@ -488,20 +488,6 @@ describe('Group Model', () => {
           expect(party.quest.progress.collect.soapBars).to.eq(5);
         });
 
-        it('does not drop an item if not need when on a collection quest', async () => {
-          party.quest.key = 'dilatoryDistress1';
-          party.quest.active = false;
-          await party.startQuest(questLeader);
-          party.quest.progress.collect.fireCoral = 20;
-          await party.save();
-
-          await Group.processQuestProgress(participatingMember, progress);
-
-          party = await Group.findOne({ _id: party._id });
-
-          expect(party.quest.progress.collect.fireCoral).to.eq(20);
-        });
-
         it('sends a chat message about progress', async () => {
           await Group.processQuestProgress(participatingMember, progress);
 
@@ -538,8 +524,8 @@ describe('Group Model', () => {
           });
         });
 
-        describe('collection quests with multiple items', () => {
-          it('sends a chat message if no progress is made on quest with multiple items', async () => {
+        describe('collection quests with multiple item types', () => {
+          it('sends a chat message if no progress is made', async () => {
             progress.collectedItems = 0;
             party.quest.key = 'dilatoryDistress1';
             party.quest.active = false;
@@ -609,6 +595,28 @@ describe('Group Model', () => {
           });
         });
 
+        it('does not drop items when an item type becomes full', async () => {
+          progress.collectedItems = 20;
+          party.quest.key = 'dilatoryDistress1';
+          party.quest.active = false;
+
+          await party.startQuest(questLeader);
+          party.quest.progress.collect.fireCoral = 19;
+          await party.save();
+
+          await Group.processQuestProgress(participatingMember, progress);
+
+          party = await Group.findOne({ _id: party._id });
+
+          // There is a very small chance (~1 in 500K) that blueFins will
+          // be 19 or 20 due to randomness and not any bug. In these cases, this
+          // test doesn't actually verify anything, but it's rare enough that it
+          // shouldn't be a problem, and to make it deterministic would require
+          // stubbing out methods in implementation-specific ways.
+          expect(party.quest.progress.collect.fireCoral).to.be.within(19, 20);
+          expect(party.quest.progress.collect.blueFins).to.be.within(19, 20);
+        });
+
         it('sends message about victory', async () => {
           progress.collectedItems = 500;
 

test/api/v3/integration/quests/POST-groups_groupId_quests_invite.test.js

@@ -240,6 +240,31 @@ describe('POST /groups/:groupId/quests/invite/:questKey', () => {
         expect(body.group.name).to.eql(questingGroup.name);
         expect(body.quest.key).to.eql(PET_QUEST);
       });
+
+      it('sends quest invited webhook to the inviter too', async () => {
+        const uuid = generateUUID();
+
+        await leader.post('/user/webhook', {
+          url: `http://localhost:${server.port}/webhooks/${uuid}`,
+          type: 'questActivity',
+          enabled: true,
+          options: {
+            questInvited: true,
+          },
+        });
+
+        await leader.post(`/groups/${questingGroup._id}/quests/invite/${PET_QUEST}`);
+
+        await sleep();
+
+        const body = server.getWebhookData(uuid);
+
+        expect(body.type).to.eql('questInvited');
+        expect(body.group.id).to.eql(questingGroup.id);
+        expect(body.group.name).to.eql(questingGroup.name);
+        expect(body.quest.key).to.eql(PET_QUEST);
+        expect(body.quest.questOwner).to.eql(questingGroup.leader._id);
+      });
     });
   });
 });

test/api/v3/integration/quests/POST-groups_groupid_quests_leave.test.js

@@ -61,15 +61,6 @@ describe('POST /groups/:groupId/quests/leave', () => {
         });
     });
 
-    it('returns an error when quest is not active', async () => {
-      await expect(partyMembers[0].post(`/groups/${questingGroup._id}/quests/leave`))
-        .to.eventually.be.rejected.and.eql({
-          code: 404,
-          error: 'NotFound',
-          message: t('noActiveQuestToLeave'),
-        });
-    });
-
     it('returns an error when quest leader attempts to leave', async () => {
       await leader.post(`/groups/${questingGroup._id}/quests/invite/${PET_QUEST}`);
       await partyMembers[0].post(`/groups/${questingGroup._id}/quests/accept`);
@@ -97,18 +88,14 @@ describe('POST /groups/:groupId/quests/leave', () => {
     });
   });
 
-  it('leaves a quest', async () => {
-    await leader.post(`/groups/${questingGroup._id}/quests/invite/${PET_QUEST}`);
-    await partyMembers[0].post(`/groups/${questingGroup._id}/quests/accept`);
-    await partyMembers[1].post(`/groups/${questingGroup._id}/quests/accept`);
-
-    const leaveResult = await partyMembers[0].post(`/groups/${questingGroup._id}/quests/leave`);
+  async function letPartyMemberLeaveAndCheckChanges (partyMember) {
+    const leaveResult = await partyMember.post(`/groups/${questingGroup._id}/quests/leave`);
     await Promise.all([
-      partyMembers[0].sync(),
+      partyMember.sync(),
       questingGroup.sync(),
     ]);
 
-    expect(partyMembers[0].party.quest).to.eql({
+    expect(partyMember.party.quest).to.eql({
       key: null,
       progress: {
         up: 0,
@@ -120,6 +107,29 @@ describe('POST /groups/:groupId/quests/leave', () => {
       RSVPNeeded: false,
     });
     expect(questingGroup.quest).to.deep.equal(leaveResult);
-    expect(questingGroup.quest.members[partyMembers[0]._id]).to.be.false;
+    expect(questingGroup.quest.members[partyMember._id]).to.be.false;
+  }
+
+  it('leaves an active quest', async () => {
+    await leader.post(`/groups/${questingGroup._id}/quests/invite/${PET_QUEST}`);
+    await partyMembers[0].post(`/groups/${questingGroup._id}/quests/accept`);
+    await partyMembers[1].post(`/groups/${questingGroup._id}/quests/accept`);
+
+    await questingGroup.sync();
+
+    expect(questingGroup.quest.active).to.eql(true);
+
+    await letPartyMemberLeaveAndCheckChanges(partyMembers[0]);
+  });
+
+  it('leaves an inactive quest ', async () => {
+    await leader.post(`/groups/${questingGroup._id}/quests/invite/${PET_QUEST}`);
+    await partyMembers[0].post(`/groups/${questingGroup._id}/quests/accept`);
+
+    await questingGroup.sync();
+
+    expect(questingGroup.quest.active).to.eql(false);
+
+    await letPartyMemberLeaveAndCheckChanges(partyMembers[0]);
   });
 });

test/api/v3/integration/tasks/DELETE-tasks_id.test.js

@@ -28,7 +28,6 @@ describe('DELETE /tasks/:id', () => {
 
     it('deletes a user\'s task', async () => {
       await user.del(`/tasks/${task._id}`);
-
       await expect(user.get(`/tasks/${task._id}`)).to.eventually.be.rejected.and.eql({
         code: 404,
         error: 'NotFound',

test/api/v3/integration/tasks/POST-tasks_unlink-all_challengeId.test.js

@@ -97,7 +97,7 @@ describe('POST /tasks/unlink-all/:challengeId', () => {
     await user.del(`/challenges/${challenge._id}`);
     await user.post(`/tasks/unlink-all/${challenge._id}?keep=keep-all`);
     // Get the task for the second user
-    const [, anotherUserTask] = await anotherUser.get('/tasks/user');
+    const [anotherUserTask] = await anotherUser.get('/tasks/user');
     // Expect the second user to still have the task, but unlinked
     expect(anotherUserTask.challenge).to.eql({
       taskId: daily._id,

test/api/v3/integration/tasks/POST-tasks_unlink-one_taskId.test.js

@@ -92,16 +92,16 @@ describe('POST /tasks/unlink-one/:taskId', () => {
 
   it('unlinks a task from a challenge and saves it on keep=keep', async () => {
     await user.post(`/tasks/challenge/${challenge._id}`, tasksToTest.daily);
-    let [, daily] = await user.get('/tasks/user');
+    let [daily] = await user.get('/tasks/user');
     await user.del(`/challenges/${challenge._id}`);
     await user.post(`/tasks/unlink-one/${daily._id}?keep=keep`);
-    [, daily] = await user.get('/tasks/user');
+    [daily] = await user.get('/tasks/user');
     expect(daily.challenge).to.eql({});
   });
 
   it('unlinks a task from a challenge and deletes it on keep=remove', async () => {
     await user.post(`/tasks/challenge/${challenge._id}`, tasksToTest.daily);
-    const [, daily] = await user.get('/tasks/user');
+    const [daily] = await user.get('/tasks/user');
     await user.del(`/challenges/${challenge._id}`);
     await user.post(`/tasks/unlink-one/${daily._id}?keep=remove`);
     const tasks = await user.get('/tasks/user');

test/api/v3/integration/tasks/PUT-tasks_id.test.js

@@ -535,24 +535,12 @@ describe('PUT /tasks/:id', () => {
       });
 
       expect(savedMonthly.nextDue.length).to.eql(6);
-      expect(moment(savedMonthly.nextDue[0]).toDate()).to.eql(
-        moment(date2).add(1, 'months').startOf('day').toDate(),
-      );
-      expect(moment(savedMonthly.nextDue[1]).toDate()).to.eql(
-        moment(date2).add(2, 'months').startOf('day').toDate(),
-      );
-      expect(moment(savedMonthly.nextDue[2]).toDate()).to.eql(
-        moment(date2).add(3, 'months').startOf('day').toDate(),
-      );
-      expect(moment(savedMonthly.nextDue[3]).toDate()).to.eql(
-        moment(date2).add(4, 'months').startOf('day').toDate(),
-      );
-      expect(moment(savedMonthly.nextDue[4]).toDate()).to.eql(
-        moment(date2).add(5, 'months').startOf('day').toDate(),
-      );
-      expect(moment(savedMonthly.nextDue[5]).toDate()).to.eql(
-        moment(date2).add(6, 'months').startOf('day').toDate(),
-      );
+      expect(moment(savedMonthly.nextDue[0]).isSame(moment(date2).add(1, 'months').startOf('day')));
+      expect(moment(savedMonthly.nextDue[1]).isSame(moment(date2).add(2, 'months').startOf('day')));
+      expect(moment(savedMonthly.nextDue[2]).isSame(moment(date2).add(3, 'months').startOf('day')));
+      expect(moment(savedMonthly.nextDue[3]).isSame(moment(date2).add(4, 'months').startOf('day')));
+      expect(moment(savedMonthly.nextDue[4]).isSame(moment(date2).add(5, 'months').startOf('day')));
+      expect(moment(savedMonthly.nextDue[5]).isSame(moment(date2).add(6, 'months').startOf('day')));
     });
   });
 

test/api/v3/integration/tasks/challenges/GET_tasks_challenge.id.test.js

@@ -21,10 +21,6 @@ describe('GET /tasks/challenge/:challengeId', () => {
       up: false,
       down: true,
     },
-    todo: {
-      text: 'test todo',
-      type: 'todo',
-    },
     daily: {
       text: 'test daily',
       type: 'daily',
@@ -32,6 +28,10 @@ describe('GET /tasks/challenge/:challengeId', () => {
       everyX: 5,
       startDate: new Date(),
     },
+    todo: {
+      text: 'test todo',
+      type: 'todo',
+    },
     reward: {
       text: 'test reward',
       type: 'reward',
@@ -84,4 +84,35 @@ describe('GET /tasks/challenge/:challengeId', () => {
       });
     });
   });
+
+  it('maintains challenge task order', async () => {
+    const orderedTasks = {};
+    Object.entries(tasksToTest).forEach(async (taskType, taskValue) => {
+      const results = [];
+      for (let i = 0; i < 5; i += 1) {
+        results.push(user.post(`/tasks/challenge/${challenge._id}`, taskValue));
+      }
+      const taskList = await Promise.all(results);
+      await user.post(`/tasks/${taskList[0]._id}/move/to/3`);
+
+      const firstTask = taskList.unshift();
+      taskList.splice(3, 0, firstTask);
+
+      orderedTasks[taskType] = taskList;
+    });
+
+    const results = await user.get(`/tasks/challenge/${challenge._id}`);
+    const resultTasks = {};
+
+    results.forEach(result => {
+      if (!resultTasks[result.type]) {
+        resultTasks[result.type] = [];
+      }
+      resultTasks[result.type].push(result);
+    });
+
+    Object.entries(orderedTasks).forEach((taskType, taskList) => {
+      expect(resultTasks[taskType]).to.eql(taskList);
+    });
+  });
 });

test/api/v3/integration/tasks/groups/GET-tasks_group_id.test.js

@@ -17,10 +17,6 @@ describe('GET /tasks/group/:groupId', () => {
       up: false,
       down: true,
     },
-    todo: {
-      text: 'test todo',
-      type: 'todo',
-    },
     daily: {
       text: 'test daily',
       type: 'daily',
@@ -28,6 +24,10 @@ describe('GET /tasks/group/:groupId', () => {
       everyX: 5,
       startDate: new Date(),
     },
+    todo: {
+      text: 'test todo',
+      type: 'todo',
+    },
     reward: {
       text: 'test reward',
       type: 'reward',
@@ -78,4 +78,35 @@ describe('GET /tasks/group/:groupId', () => {
       });
     });
   });
+
+  it('maintains group task order', async () => {
+    const orderedTasks = {};
+    Object.entries(tasksToTest).forEach(async (taskType, taskValue) => {
+      const results = [];
+      for (let i = 0; i < 5; i += 1) {
+        results.push(user.post(`/tasks/group/${group._id}`, taskValue));
+      }
+      const taskList = await Promise.all(results);
+      await user.post(`/tasks/${taskList[0]._id}/move/to/3`);
+
+      const firstTask = taskList.unshift();
+      taskList.splice(3, 0, firstTask);
+
+      orderedTasks[taskType] = taskList;
+    });
+
+    const results = await user.get(`/tasks/group/${group._id}`);
+    const resultTasks = {};
+
+    results.forEach(result => {
+      if (!resultTasks[result.type]) {
+        resultTasks[result.type] = [];
+      }
+      resultTasks[result.type].push(result);
+    });
+
+    Object.entries(orderedTasks).forEach((taskType, taskList) => {
+      expect(resultTasks[taskType]).to.eql(taskList);
+    });
+  });
 });

test/api/v3/integration/user/PUT-user.test.js

@@ -91,7 +91,15 @@ describe('PUT /user', () => {
       })).to.eventually.be.rejected.and.eql({
         code: 400,
         error: 'BadRequest',
-        message: t('displaynameIssueSlur'),
+        message: t('bannedSlurUsedInProfile'),
+      });
+
+      await expect(user.put('/user', {
+        'profile.name': 'TESTPLACEHOLDERSWEARWORDHERE',
+      })).to.eventually.be.rejected.and.eql({
+        code: 400,
+        error: 'BadRequest',
+        message: t('bannedWordUsedInProfile'),
       });
 
       await expect(user.put('/user', {

test/api/v3/integration/user/auth/PUT-user_update_username.test.js

@@ -139,7 +139,7 @@ describe('PUT /user/auth/update-username', async () => {
       })).to.eventually.be.rejected.and.eql({
         code: 400,
         error: 'BadRequest',
-        message: [t('usernameIssueLength'), t('usernameIssueSlur')].join(' '),
+        message: [t('usernameIssueLength'), t('bannedSlurUsedInProfile')].join(' '),
       });
     });
 
@@ -149,21 +149,14 @@ describe('PUT /user/auth/update-username', async () => {
       })).to.eventually.be.rejected.and.eql({
         code: 400,
         error: 'BadRequest',
-        message: [t('usernameIssueLength'), t('usernameIssueSlur')].join(' '),
+        message: [t('usernameIssueLength'), t('bannedSlurUsedInProfile')].join(' '),
       });
       await expect(user.put(ENDPOINT, {
         username: 'something_TESTPLACEHOLDERSLURWORDHERE',
       })).to.eventually.be.rejected.and.eql({
         code: 400,
         error: 'BadRequest',
-        message: [t('usernameIssueLength'), t('usernameIssueSlur')].join(' '),
-      });
-      await expect(user.put(ENDPOINT, {
-        username: 'somethingTESTPLACEHOLDERSLURWORDHEREotherword',
-      })).to.eventually.be.rejected.and.eql({
-        code: 400,
-        error: 'BadRequest',
-        message: [t('usernameIssueLength'), t('usernameIssueSlur')].join(' '),
+        message: [t('usernameIssueLength'), t('bannedSlurUsedInProfile')].join(' '),
       });
     });
 

test/api/v3/integration/user/buy/POST-user_buy.test.js

@@ -70,6 +70,7 @@ describe('POST /user/buy/:key', () => {
   it('buys a special spell', async () => {
     const key = 'spookySparkles';
     const item = content.special[key];
+    const stub = sinon.stub(item, 'canOwn').returns(true);
 
     await user.update({ 'stats.gp': 250 });
     const res = await user.post(`/user/buy/${key}`);
@@ -82,6 +83,8 @@ describe('POST /user/buy/:key', () => {
     expect(res.message).to.equal(t('messageBought', {
       itemText: item.text(),
     }));
+
+    stub.restore();
   });
 
   it('allows for bulk purchases', async () => {

test/api/v4/user/auth/POST-user_verify_display_name.test.js

@@ -33,19 +33,22 @@ describe('POST /user/auth/verify-display-name', async () => {
     it('errors if display name is a slur', async () => {
       await expect(user.post(ENDPOINT, {
         displayName: 'TESTPLACEHOLDERSLURWORDHERE',
-      })).to.eventually.eql({ isUsable: false, issues: [t('displaynameIssueSlur')] });
+      })).to.eventually.eql({ isUsable: false, issues: [t('bannedSlurUsedInProfile')] });
     });
 
     it('errors if display name contains a slur', async () => {
       await expect(user.post(ENDPOINT, {
         displayName: 'TESTPLACEHOLDERSLURWORDHERE_otherword',
-      })).to.eventually.eql({ isUsable: false, issues: [t('displaynameIssueLength'), t('displaynameIssueSlur')] });
+      })).to.eventually.eql({
+        isUsable: false,
+        issues: [t('displaynameIssueLength'), t('bannedSlurUsedInProfile')],
+      });
       await expect(user.post(ENDPOINT, {
         displayName: 'something_TESTPLACEHOLDERSLURWORDHERE',
-      })).to.eventually.eql({ isUsable: false, issues: [t('displaynameIssueLength'), t('displaynameIssueSlur')] });
-      await expect(user.post(ENDPOINT, {
-        displayName: 'somethingTESTPLACEHOLDERSLURWORDHEREotherword',
-      })).to.eventually.eql({ isUsable: false, issues: [t('displaynameIssueLength'), t('displaynameIssueSlur')] });
+      })).to.eventually.eql({
+        isUsable: false,
+        issues: [t('displaynameIssueLength'), t('bannedSlurUsedInProfile')],
+      });
     });
 
     it('errors if display name has incorrect length', async () => {

test/api/v4/user/auth/POST-user_verify_username.test.js

@@ -51,9 +51,6 @@ describe('POST /user/auth/verify-username', async () => {
       await expect(user.post(ENDPOINT, {
         username: 'something_TESTPLACEHOLDERSLURWORDHERE',
       })).to.eventually.eql({ isUsable: false, issues: [t('usernameIssueLength'), t('usernameIssueSlur')] });
-      await expect(user.post(ENDPOINT, {
-        username: 'somethingTESTPLACEHOLDERSLURWORDHEREotherword',
-      })).to.eventually.eql({ isUsable: false, issues: [t('usernameIssueLength'), t('usernameIssueSlur')] });
     });
 
     it('errors if username is not allowed', async () => {

test/common/fns/randomDrop.test.js

@@ -1,5 +1,4 @@
 import randomDrop from '../../../website/common/script/fns/randomDrop';
-import i18n from '../../../website/common/script/i18n';
 import {
   generateUser,
   generateTodo,
@@ -145,148 +144,5 @@ describe('common.fns.randomDrop', () => {
         expect(acceptableDrops).to.contain(user._tmp.drop.key); // always Desert
       });
     });
-
-    context('drop cap notification', () => {
-      let analytics;
-      const req = {};
-      let isSubscribedStub;
-
-      beforeEach(() => {
-        user.addNotification = () => {};
-        sandbox.stub(user, 'addNotification');
-        user.isSubscribed = () => {};
-        isSubscribedStub = sandbox.stub(user, 'isSubscribed');
-        isSubscribedStub.returns(false);
-        analytics = { track () {} };
-        sandbox.stub(analytics, 'track');
-      });
-
-      it('sends a notification if A/B test is enabled when drop cap is reached', () => {
-        user._ABtests.dropCapNotif = 'drop-cap-notif-enabled';
-        predictableRandom.returns(0.1);
-
-        // Max Drop Count is 5
-        expect(user.items.lastDrop.count).to.equal(0);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        expect(user.items.lastDrop.count).to.equal(5);
-        expect(user.addNotification).to.be.calledOnce;
-        expect(user.addNotification).to.be.calledWith('DROP_CAP_REACHED', {
-          message: i18n.t('dropCapReached'),
-          items: 5,
-        });
-      });
-
-      it('does not send a notification if user is enrolled in disabled A/B test group', () => {
-        user._ABtests.dropCapNotif = 'drop-cap-notif-disabled';
-        predictableRandom.returns(0.1);
-
-        // Max Drop Count is 5
-        expect(user.items.lastDrop.count).to.equal(0);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        expect(user.items.lastDrop.count).to.equal(5);
-        expect(user.addNotification).to.not.be.called;
-      });
-
-      it('does not send a notification if user is enrolled in disabled A/B test group', () => {
-        user._ABtests.dropCapNotif = 'drop-cap-notif-not-enrolled';
-        predictableRandom.returns(0.1);
-
-        // Max Drop Count is 5
-        expect(user.items.lastDrop.count).to.equal(0);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        expect(user.items.lastDrop.count).to.equal(5);
-        expect(user.addNotification).to.not.be.called;
-      });
-
-      it('does not send a notification if drop cap is not reached', () => {
-        user._ABtests.dropCapNotif = 'drop-cap-notif-enabled';
-        predictableRandom.returns(0.1);
-
-        // Max Drop Count is 5
-        expect(user.items.lastDrop.count).to.equal(0);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        expect(user.items.lastDrop.count).to.equal(4);
-        expect(user.addNotification).to.not.be.called;
-      });
-
-      it('does not send a notification if user is subscribed', () => {
-        user._ABtests.dropCapNotif = 'drop-cap-notif-enabled';
-        predictableRandom.returns(0.1);
-        isSubscribedStub.returns(true);
-
-        // Max Drop Count is 5
-        expect(user.items.lastDrop.count).to.equal(0);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        expect(user.items.lastDrop.count).to.equal(5);
-        expect(user.addNotification).to.not.be.called;
-      });
-
-      it('tracks drop cap reached event for enrolled users (notification enabled)', () => {
-        user._ABtests.dropCapNotif = 'drop-cap-notif-enabled';
-        predictableRandom.returns(0.1);
-        isSubscribedStub.returns(true);
-
-        // Max Drop Count is 5
-        expect(user.items.lastDrop.count).to.equal(0);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        expect(user.items.lastDrop.count).to.equal(5);
-        expect(analytics.track).to.be.calledWith('drop cap reached');
-      });
-
-      it('tracks drop cap reached event for enrolled users (notification disabled)', () => {
-        user._ABtests.dropCapNotif = 'drop-cap-notif-disabled';
-        predictableRandom.returns(0.1);
-        isSubscribedStub.returns(true);
-
-        // Max Drop Count is 5
-        expect(user.items.lastDrop.count).to.equal(0);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        expect(user.items.lastDrop.count).to.equal(5);
-        expect(analytics.track).to.be.calledWith('drop cap reached');
-      });
-
-      it('does not track drop cap reached event for users not enrolled in A/B test', () => {
-        user._ABtests.dropCapNotif = 'drop-cap-notif-not-enrolled';
-        predictableRandom.returns(0.1);
-        isSubscribedStub.returns(true);
-
-        // Max Drop Count is 5
-        expect(user.items.lastDrop.count).to.equal(0);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        randomDrop(user, { task, predictableRandom }, req, analytics);
-        expect(user.items.lastDrop.count).to.equal(5);
-        expect(analytics.track).to.not.be.calledWith('drop cap reached');
-      });
-    });
   });
 });

test/common/libs/onboarding.test.js

@@ -1,6 +1,5 @@
 import moment from 'moment';
 import {
-  hasActiveOnboarding,
   hasCompletedOnboarding,
   onOnboardingComplete,
   checkOnboardingStatus,
@@ -17,19 +16,6 @@ describe('onboarding', () => {
     user.auth.timestamps.created = moment('2019-12-20').toDate();
   });
 
-  describe('hasActiveOnboarding', () => {
-    // The value of BEGIN DATE is available in common/script/libs/onboarding
-
-    it('returns true if the account is created after BEGIN_DATE', () => {
-      expect(hasActiveOnboarding(user)).to.eql(true);
-    });
-
-    it('returns false if the account is created before BEGIN_DATE', () => {
-      user.auth.timestamps.created = moment('2019-12-01').toDate();
-      expect(hasActiveOnboarding(user)).to.eql(false);
-    });
-  });
-
   describe('hasCompletedOnboarding', () => {
     it('returns false if no achievement has been awarded', () => {
       const result = hasCompletedOnboarding(user);

test/common/ops/buy/buyMysterySet.js

@@ -88,14 +88,6 @@ describe('shared.ops.buyMysterySet', () => {
         expect(user.items.gear.owned).to.have.property('armor_mystery_301404', true);
         expect(user.items.gear.owned).to.have.property('head_mystery_301404', true);
         expect(user.items.gear.owned).to.have.property('eyewear_mystery_301404', true);
-        expect(analytics.track).to.be.calledOnce;
-        expect(analytics.track).to.be.calledWithMatch('acquire item', {
-          uuid: user._id,
-          itemKey: '301404',
-          itemType: 'Subscriber Gear',
-          acquireMethod: 'Hourglass',
-          category: 'behavior',
-        });
       });
     });
   });

website/client/.eslintrc.js

@@ -13,6 +13,7 @@ module.exports = {
     'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
     // TODO find a way to let eslint understand webpack aliases
     'import/no-unresolved': 'off',
+    'import/extensions': 'off',
     'vue/no-v-html': 'off',
     'vue/html-self-closing': ['error', {
       html: {

website/client/babel.config.js

@@ -3,4 +3,7 @@ module.exports = {
   presets: [
     '@vue/cli-plugin-babel/preset',
   ],
+  plugins: [
+    '@babel/plugin-proposal-optional-chaining',
+  ],
 };

website/client/config/storybook/README.md

@@ -0,0 +1,8 @@
+# Storybook Updates
+
+Addon-Knobs has been deprecated inorder to update to the new `addons-controls` we need to:
+
+1. Change to the new export syntax for each story `export const StoryTemplate`
+2. And use `StoryTemplate.args` and `StoryTemplate.argTypes` to have the same `knobs` as before
+
+Maybe this can be made story by story and not all at once

website/client/config/storybook/config.js

@@ -2,53 +2,52 @@
 import { configure } from '@storybook/vue';
 import './margin.css';
 import '../../src/assets/scss/index.scss';
-import '../../src/assets/css/sprites.css';
 
-import '../../src/assets/css/sprites/spritesmith-main-0.css';
-import '../../src/assets/css/sprites/spritesmith-main-1.css';
-import '../../src/assets/css/sprites/spritesmith-main-2.css';
-import '../../src/assets/css/sprites/spritesmith-main-3.css';
-import '../../src/assets/css/sprites/spritesmith-main-4.css';
-import '../../src/assets/css/sprites/spritesmith-main-5.css';
-import '../../src/assets/css/sprites/spritesmith-main-6.css';
-import '../../src/assets/css/sprites/spritesmith-main-7.css';
-import '../../src/assets/css/sprites/spritesmith-main-8.css';
-import '../../src/assets/css/sprites/spritesmith-main-9.css';
-import '../../src/assets/css/sprites/spritesmith-main-10.css';
-import '../../src/assets/css/sprites/spritesmith-main-11.css';
-import '../../src/assets/css/sprites/spritesmith-main-12.css';
-import '../../src/assets/css/sprites/spritesmith-main-13.css';
-import '../../src/assets/css/sprites/spritesmith-main-14.css';
-import '../../src/assets/css/sprites/spritesmith-main-15.css';
-import '../../src/assets/css/sprites/spritesmith-main-16.css';
-import '../../src/assets/css/sprites/spritesmith-main-17.css';
-import '../../src/assets/css/sprites/spritesmith-main-18.css';
-import '../../src/assets/css/sprites/spritesmith-main-19.css';
-import '../../src/assets/css/sprites/spritesmith-main-20.css';
-import '../../src/assets/css/sprites/spritesmith-main-21.css';
-import '../../src/assets/css/sprites/spritesmith-main-22.css';
-import '../../src/assets/css/sprites/spritesmith-main-23.css';
-import '../../src/assets/css/sprites/spritesmith-main-24.css';
-import '../../src/assets/css/sprites/spritesmith-main-25.css';
-import '../../src/assets/css/sprites/spritesmith-main-26.css';
+import '../../src/assets/scss/sprites.scss';
+
 import Vue from 'vue';
 import BootstrapVue from 'bootstrap-vue';
 import StoreModule from '@/libs/store';
+import getStore from '@/store';
+import '../../src/filters/registerGlobals';
+
+import i18n from '../../../common/script/i18n';
 
 // couldn't inject the languages easily,
 // so just a "$t()" string to show that this will be translated
-Vue.prototype.$t = function translateString (...args) {
+i18n.t = function translateString (...args) {
   return `$t(${JSON.stringify(args)})`;
 };
+Vue.prototype.$t = i18n.t;
 
 Vue.use(BootstrapVue);
 Vue.use(StoreModule);
 
+const store = getStore();
+store.state.user.data = {
+  stats: {},
+  tags: [],
+  items: {
+    quests: {
+      moon1: 3,
+    },
+  },
+  party: {
+    quest: {
+
+    },
+  },
+  preferences: {
+
+  },
+};
+
+Vue.prototype.$store = store;
+
 const req = require.context('../../src', true, /.stories.js$/);
 
 function loadStories () {
   req.keys().forEach(filename => req(filename));
 }
 
-
 configure(loadStories, module);

website/client/config/storybook/margin.css

@@ -3,11 +3,12 @@
     display: inline-block;
 }
 
-.content {
-    color: white;
-    background: grey;
-}
-
 .inline-block {
     display: inline-block;
 }
+
+.component-showcase {
+    position: absolute;
+    margin: 20px;
+    width: calc(100% - 40px);
+}

website/client/config/storybook/mock.data.js

@@ -1,3 +1,5 @@
+import { v4 as generateUUID } from 'uuid';
+
 export const userStyles = {
   contributor: {
     admin: true,
@@ -72,4 +74,11 @@ export const userStyles = {
     maxHealth: 50,
     maxMP: 158,
   },
+  profile: {
+    name: 'user',
+  },
+  _id: generateUUID(),
+  flags: {
+    classSelected: true,
+  },
 };

website/client/package.json

@@ -13,53 +13,57 @@
     "storybook:serve": "vue-cli-service storybook:serve -p 6006 -c config/storybook"
   },
   "dependencies": {
-    "@storybook/addon-actions": "^6.1.15",
-    "@storybook/addon-knobs": "^6.1.15",
-    "@storybook/addon-links": "^6.1.15",
-    "@storybook/addon-notes": "^5.3.21",
-    "@storybook/vue": "^6.1.15",
-    "@vue/cli-plugin-babel": "^4.5.11",
-    "@vue/cli-plugin-eslint": "^4.5.11",
-    "@vue/cli-plugin-router": "^4.5.11",
-    "@vue/cli-plugin-unit-mocha": "^4.5.11",
-    "@vue/cli-service": "^4.5.11",
+    "@storybook/addons": "6.3.8",
+    "@storybook/addon-actions": "6.3.8",
+    "@storybook/addon-knobs": "6.2.9",
+    "@storybook/addon-links": "6.3.8",
+    "@storybook/addon-notes": "5.3.21",
+    "@storybook/vue": "6.3.8",
+    "@vue/cli-plugin-babel": "^4.5.13",
+    "@vue/cli-plugin-eslint": "^4.5.13",
+    "@vue/cli-plugin-router": "^4.5.13",
+    "@vue/cli-plugin-unit-mocha": "^4.5.13",
+    "@vue/cli-service": "^4.5.13",
     "@vue/test-utils": "1.0.0-beta.29",
-    "amplitude-js": "^7.4.1",
-    "axios": "^0.21.1",
+    "amplitude-js": "^8.6.0",
+    "axios": "^0.21.4",
     "axios-progress-bar": "^1.2.0",
     "babel-eslint": "^10.1.0",
-    "bootstrap": "^4.5.3",
+    "bootstrap": "^4.6.0",
     "bootstrap-vue": "^2.21.2",
-    "chai": "^4.1.2",
-    "core-js": "^3.8.3",
+    "chai": "^4.3.4",
+    "core-js": "^3.17.3",
     "eslint": "^6.8.0",
     "eslint-config-habitrpg": "^6.2.0",
     "eslint-plugin-mocha": "^5.3.0",
     "eslint-plugin-vue": "^6.2.2",
     "habitica-markdown": "^3.0.0",
-    "hellojs": "^1.18.6",
-    "inspectpack": "^4.6.1",
-    "intro.js": "^2.9.3",
-    "jquery": "^3.5.1",
-    "lodash": "^4.17.20",
+    "hellojs": "^1.19.4",
+    "inspectpack": "^4.7.1",
+    "intro.js": "^4.2.2",
+    "jquery": "^3.6.0",
+    "lodash": "^4.17.21",
     "moment": "^2.29.1",
-    "nconf": "^0.11.1",
-    "sass": "^1.32.5",
+    "nconf": "^0.11.3",
+    "sass": "^1.34.0",
     "sass-loader": "^8.0.2",
     "smartbanner.js": "^1.16.0",
     "svg-inline-loader": "^0.8.2",
-    "svg-url-loader": "^6.0.0",
+    "svg-url-loader": "^7.1.1",
     "svgo": "^1.3.2",
     "svgo-loader": "^2.2.1",
     "uuid": "^8.3.2",
-    "validator": "^13.5.2",
-    "vue": "^2.6.12",
-    "vue-cli-plugin-storybook": "^2.0.0",
+    "validator": "^13.6.0",
+    "vue": "^2.6.14",
+    "vue-cli-plugin-storybook": "2.1.0",
     "vue-mugen-scroll": "^0.2.6",
-    "vue-router": "^3.4.9",
-    "vue-template-compiler": "^2.6.12",
+    "vue-router": "^3.5.2",
+    "vue-template-compiler": "^2.6.14",
     "vuedraggable": "^2.24.3",
     "vuejs-datepicker": "git://github.com/habitrpg/vuejs-datepicker.git#153d339e4dbebb73733658aeda1d5b7fcc55b0a0",
     "webpack": "^4.46.0"
+  },
+  "devDependencies": {
+    "@babel/plugin-proposal-optional-chaining": "^7.14.5"
   }
 }

website/client/src/app.vue

@@ -38,7 +38,7 @@
       <template v-else>
         <template v-if="isUserLoaded">
           <damage-paused-banner />
-          <!-- <gems-promo-banner /> -->
+          <gems-promo-banner />
           <gift-promo-banner />
           <notifications-display />
           <app-menu />
@@ -154,7 +154,7 @@ import { loadProgressBar } from 'axios-progress-bar';
 import AppMenu from './components/header/menu';
 import AppHeader from './components/header/index';
 import DamagePausedBanner from './components/header/banners/damagePaused';
-// import GemsPromoBanner from './components/header/banners/gemsPromo';
+import GemsPromoBanner from './components/header/banners/gemsPromo';
 import GiftPromoBanner from './components/header/banners/giftPromo';
 import AppFooter from './components/appFooter';
 import notificationsDisplay from './components/notifications';
@@ -186,7 +186,7 @@ export default {
     AppHeader,
     AppFooter,
     DamagePausedBanner,
-    // GemsPromoBanner,
+    GemsPromoBanner,
     GiftPromoBanner,
     notificationsDisplay,
     snackbars,
@@ -261,6 +261,12 @@ export default {
       this.$root.$emit('bv::show::modal', 'buy-modal');
     });
 
+    this.$root.$on('bv::modal::hidden', event => {
+      if (event.componentId === 'buy-modal') {
+        this.$root.$emit('buyModal::hidden', this.selectedItemToBuy.key);
+      }
+    });
+
     this.$root.$on('selectMembersModal::showItem', item => {
       this.selectedSpellToBuy = item;
       this.$root.$emit('bv::show::modal', 'select-member-modal');
@@ -514,36 +520,5 @@ export default {
 <style src="axios-progress-bar/dist/nprogress.css"></style>
 <style src="@/assets/scss/index.scss" lang="scss"></style>
 <style src="@/assets/css/sprites/spritesmith-largeSprites-0.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-0.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-1.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-2.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-3.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-4.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-5.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-6.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-7.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-8.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-9.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-10.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-11.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-12.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-13.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-14.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-15.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-16.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-17.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-18.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-19.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-20.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-21.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-22.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-23.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-24.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-25.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-26.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-27.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-28.css"></style>
-<style src="@/assets/css/sprites/spritesmith-main-29.css"></style>
-<!-- <style src="@/assets/css/sprites/spritesmith-main-30.css"></style> -->
-<style src="@/assets/css/sprites.css"></style>
+<style src="@/assets/scss/sprites.scss" lang="scss"></style>
 <style src="smartbanner.js/dist/smartbanner.min.css"></style>

website/client/src/assets/css/sprites.css

@@ -10,6 +10,12 @@
   height: 219px;
 }
 
+.quest_solarSystem {
+  background: url("~@/assets/images/animated/quest_solarSystem.gif") no-repeat;
+  width: 219px;
+  height: 219px;
+}
+
 .Pet_HatchingPotion_Dessert, .Pet_HatchingPotion_Veggie, .Pet_HatchingPotion_Windup {
   width: 68px;
   height: 68px;

website/client/src/assets/css/sprites/spritesmith-main-31.css

@@ -0,0 +1,912 @@
+.Pet-Turtle-Red {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Turtle-Shade {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Turtle-Skeleton {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Turtle-White {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Turtle-Zombie {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-Base {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-CottonCandyBlue {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-CottonCandyPink {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-Desert {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-Golden {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-Red {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-Shade {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-Skeleton {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-White {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Unicorn-Zombie {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-Base {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-CottonCandyBlue {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-CottonCandyPink {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-Desert {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-Golden {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-Red {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-Shade {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-Skeleton {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-White {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Velociraptor-Zombie {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-Base {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-CottonCandyBlue {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-CottonCandyPink {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-Desert {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-Golden {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-Red {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-Shade {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-Skeleton {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-White {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Whale-Zombie {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Amber {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Aquatic {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Aurora {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-AutumnLeaf {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Base {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-BirchBark {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-BlackPearl {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Bronze {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Celestial {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-CottonCandyBlue {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-CottonCandyPink {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Cupid {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Desert {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Dessert {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Ember {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Fairy {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Floral {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Fluorite {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Frost {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Ghost {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Glass {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Glow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Golden {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Holly {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-IcySnow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Moonglow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-MossyStone {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Peppermint {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-PolkaDot {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Rainbow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Red {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-RoseQuartz {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-RoyalPurple {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Ruby {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-SandSculpture {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Shade {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Shadow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Shimmer {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Silver {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Skeleton {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-SolarSystem {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Spooky {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-StainedGlass {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-StarryNight {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Sunset {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Sunshine {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Thunderstorm {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px -100px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Turquoise {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px -200px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Vampire {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px -300px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Veggie {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px -400px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Veteran {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px -500px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Watery {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px -600px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-White {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px -700px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Windup {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Wolf-Zombie {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -82px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-Base {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -164px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-CottonCandyBlue {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -246px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-CottonCandyPink {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -328px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-Desert {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -410px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-Golden {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -492px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-Red {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -574px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-Shade {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -656px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-Skeleton {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -738px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-White {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -820px -800px;
+  width: 81px;
+  height: 99px;
+}
+.Pet-Yarn-Zombie {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px 0px;
+  width: 81px;
+  height: 99px;
+}
+.Pet_HatchingPotion_Amber {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -100px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Aquatic {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -169px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Aurora {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -238px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_AutumnLeaf {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -307px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Base {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -376px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_BirchBark {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -445px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_BlackPearl {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -514px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Bronze {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -583px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Celestial {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -652px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_CottonCandyBlue {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -721px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_CottonCandyPink {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -902px -790px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Cupid {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Desert {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -69px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Ember {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -138px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Fairy {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -207px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Floral {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -276px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Fluorite {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -345px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Frost {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -414px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Ghost {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -483px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Glass {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -552px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Glow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -621px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Golden {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -690px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Holly {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -759px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_IcySnow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -828px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Moonglow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -897px -900px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_MossyStone {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px 0px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Peppermint {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -69px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_PolkaDot {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -138px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Purple {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -207px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Rainbow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -276px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Red {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -345px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_RoseQuartz {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -414px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_RoyalPurple {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -483px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Ruby {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -552px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_SandSculpture {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -621px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Shade {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -690px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Shadow {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -759px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Shimmer {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -828px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Silver {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -984px -897px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Skeleton {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: 0px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_SolarSystem {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -69px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Spooky {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -138px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_StainedGlass {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -207px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_StarryNight {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -276px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Sunset {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -345px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Sunshine {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -414px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Thunderstorm {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -483px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Turquoise {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -552px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Vampire {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -621px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Watery {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -690px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_White {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -759px -969px;
+  width: 68px;
+  height: 68px;
+}
+.Pet_HatchingPotion_Zombie {
+  background-image: url('~@/assets/images/sprites/spritesmith-main-31.png');
+  background-position: -828px -969px;
+  width: 68px;
+  height: 68px;
+}