feat: background support in popups (#1152)

also refactor: gym defender layout

Author: Mygod

AGENTS.md

@@ -4,6 +4,8 @@ Build, test, and development commands - `yarn install` installs workspace depend
 
 Coding style and naming conventions - Prettier governs formatting (2-space indent, single quotes in JS, semicolons off); never hand-format conflicting styles. Prefer functional React components, PascalCase for components, camelCase for helpers, and `use` prefixes for hooks.
 
+Spacing discipline - DO NOT introduce or adjust margins, padding, gaps, line-height, or other spacing-related styles anywhere in the repo without explicit written permission from the user.
+
 Testing guidelines - No dedicated Jest suite today; rely on `yarn lint`, type checks from editor tooling, and manual verification in a local dev session. When adding backend features, exercise relevant GraphQL/REST paths via the dev server and document sanity checks in the PR description.
 
 Commit and pull request guidelines - Use Conventional Commits (`type(scope): summary`), matching existing history (e.g. `feat(map): add weather overlays`). Each PR should describe scope, link related issues, list testing steps, and include screenshots or GIFs for UI changes. Re-run `yarn lint`, `yarn build`, and integration steps touched by the change before requesting review.

package.json

@@ -174,7 +174,7 @@
     "source-map": "^0.7.4",
     "suncalc": "^1.9.0",
     "supercluster": "^8.0.1",
-    "uicons.js": "2.1.0",
+    "uicons.js": "2.2.0",
     "zustand": "4.4.6"
   },
   "devDependencies": {

packages/locales/lib/human/en.json

@@ -128,6 +128,7 @@
   "feedback_form": "Feedback Form",
   "unknown_pokestop": "Unknown PokéStop Name",
   "unknown_gym": "Unknown Gym Name",
+  "unknown_background_with_id": "Unknown Background #{{id}}",
   "exclude": "Exclude",
   "exclude_quest": "Exclude Quest",
   "exclude_invasion": "Exclude Invasion",

packages/masterfile/lib/index.d.ts

@@ -68,6 +68,14 @@ export interface MasterfileWeather {
   types: number[]
 }
 
+export interface MasterfileLocationCard {
+  proto: string
+  formatted: string
+  cardType?: string
+  imageUrl?: string
+  vfxAddress?: string
+}
+
 export interface Masterfile {
   pokemon: Record<string, MasterfilePokemon>
   types: MasterfileObject
@@ -78,6 +86,8 @@ export interface Masterfile {
   weather: Record<string, MasterfileWeather>
   teams: (typeof mfjson)['teams']
   raids: (typeof mfjson)['raids']
+  routeTypes: (typeof mfjson)['routeTypes']
+  locationCards: Record<string, MasterfileLocationCard>
 }
 
 export declare function generate(

packages/types/lib/scanner.d.ts

@@ -244,6 +244,7 @@ export interface Pokemon {
   def_iv: number
   sta_iv: number
   weather: number
+  background?: number
   capture_1: number
   capture_2: number
   capture_3: number

packages/types/lib/server.d.ts

@@ -48,6 +48,7 @@ export interface DbContext {
   hasShowcaseType: boolean
   hasStationedGmax: boolean
   hasBattlePokemonStats: boolean
+  hasPokemonBackground: boolean
   hasPokemonShinyStats?: boolean
   connection?: number
 }

server/src/filters/pokemon/Backend.js

@@ -432,6 +432,7 @@ class PkmnBackend {
       display_pokemon_id: pokemon.display_pokemon_id,
       seen_type: pokemon.seen_type,
       changed: !!pokemon.changed,
+      background: pokemon.background,
     }
     if (!result.seen_type) {
       if (result.spawn_id === null) {

server/src/graphql/typeDefs/scanner.graphql

@@ -179,6 +179,7 @@ type Pokemon {
   def_iv: Int
   sta_iv: Int
   weather: Int
+  background: Int
   capture_1: Float
   capture_2: Float
   capture_3: Float

server/src/models/Pokemon.js

@@ -132,7 +132,16 @@ class Pokemon extends Model {
   static async getAll(perms, args, ctx) {
     const { iv: ivs, pvp, areaRestrictions } = perms
     const { onlyIvOr, onlyHundoIv, onlyZeroIv, onlyAreas = [] } = args.filters
-    const { hasSize, hasHeight, isMad, mem, secret, httpAuth, pvpV2 } = ctx
+    const {
+      hasSize,
+      hasHeight,
+      hasPokemonBackground,
+      isMad,
+      mem,
+      secret,
+      httpAuth,
+      pvpV2,
+    } = ctx
     const { filterMap, globalFilter } = this.getFilters(perms, args, ctx)
 
     let queryPvp = config
@@ -175,7 +184,14 @@ class Pokemon extends Model {
       if (isMad) {
         Pokemon.getMadSql(query)
       } else {
-        query.select(['*', hasSize && !hasHeight ? 'size AS height' : 'size'])
+        const selectColumns = [
+          '*',
+          hasSize && !hasHeight ? 'size AS height' : 'size',
+        ]
+        if (hasPokemonBackground) {
+          selectColumns.push('background')
+        }
+        query.select(selectColumns)
       }
       query.where(
         isMad ? 'disappear_time' : 'expire_timestamp',

server/src/services/DbManager.js

@@ -131,14 +131,16 @@ class DbManager extends Logger {
    * @returns {Promise<import("@rm/types").DbContext>}
    */
   static async schemaCheck(schema) {
-    const [isMad, pvpV2, hasSize, hasHeight] = await schema('pokemon')
-      .columnInfo()
-      .then((columns) => [
-        'cp_multiplier' in columns,
-        'pvp' in columns,
-        'size' in columns,
-        'height' in columns,
-      ])
+    const [isMad, pvpV2, hasSize, hasHeight, hasPokemonBackground] =
+      await schema('pokemon')
+        .columnInfo()
+        .then((columns) => [
+          'cp_multiplier' in columns,
+          'pvp' in columns,
+          'size' in columns,
+          'height' in columns,
+          'background' in columns,
+        ])
     const [
       hasRewardAmount,
       hasPowerUp,
@@ -220,6 +222,7 @@ class DbManager extends Logger {
       hasBattlePokemonStats,
       hasShortcode,
       hasPokemonShinyStats,
+      hasPokemonBackground,
     }
   }
 
@@ -237,7 +240,6 @@ class DbManager extends Logger {
             : {
                 mem: this.endpoints[i].endpoint,
                 secret: this.endpoints[i].secret,
-                // Add support for HTTP authentication
                 httpAuth: this.endpoints[i].httpAuth,
                 pvpV2: true,
               }