Feature: Item sets (#24)

* Add item sets to API * Add item sets to web client
wowserhq · Sep 12, 2018 · ea472ba · ea472ba
1 parent 1ea7346
commit ea472ba
Show file tree

Hide file tree

Showing 15 changed files with 263 additions and 4 deletions.
diff --git a/packages/spelunker-api/src/lib/entities/Item.mjs b/packages/spelunker-api/src/lib/entities/Item.mjs
@@ -4,6 +4,7 @@ import { worldConnection } from '../db/connections';
 import GameObjectLoot from './GameObjectLoot';
 import ItemDisplayInfo from './ItemDisplayInfo';
 import ItemLoot from './ItemLoot';
+import ItemSet from './ItemSet';
 import NPCLoot from './NPCLoot';
 import NPCSale from './NPCSale';
 import Quest from './Quest';
@@ -61,6 +62,10 @@ class Item extends DatabaseEntity {
     return NPCLoot.query.where({ Item: this.id }).orderBy('Chance', 'desc');
   }
 
+  itemSet() {
+    return ItemSet.find(this.data.itemset);
+  }
+
   objectiveOf() {
     const { id } = this;
     return Quest.query

diff --git a/packages/spelunker-api/src/lib/entities/ItemSet.mjs b/packages/spelunker-api/src/lib/entities/ItemSet.mjs
@@ -0,0 +1,26 @@
+import DBCEntity from '../dbc/Entity';
+import { contains } from '../utils/string';
+
+import Item from './Item';
+
+class ItemSet extends DBCEntity {
+  static get dbc() {
+    return 'ItemSet';
+  }
+
+  static search(query, searchQuery) {
+    query.filter(itemSet => contains(itemSet.name, searchQuery));
+  }
+
+  async quality() {
+    const item = await this.items().first().execute();
+    return item.quality;
+  }
+
+  items() {
+    const itemIDs = this.data.itemIDs.filter(id => id);
+    return Item.query.whereIn('entry', itemIDs);
+  }
+}
+
+export default ItemSet;
diff --git a/packages/spelunker-api/src/lib/graph/root.mjs b/packages/spelunker-api/src/lib/graph/root.mjs
@@ -5,6 +5,7 @@ import Class from '../entities/Class';
 import Faction from '../entities/Faction';
 import GameObject from '../entities/GameObject';
 import Item from '../entities/Item';
+import ItemSet from '../entities/ItemSet';
 import Map from '../entities/Map';
 import NPC from '../entities/NPC';
 import Quest from '../entities/Quest';
@@ -31,6 +32,9 @@ export default {
   items: ({ searchQuery }) => Item.query.search(searchQuery),
   item: ({ id }) => Item.find(id),
 
+  itemSets: ({ searchQuery }) => ItemSet.query.search(searchQuery),
+  itemSet: ({ id }) => ItemSet.find(id),
+
   maps: ({ searchQuery }) => Map.query.search(searchQuery),
   map: ({ id }) => Map.find(id),
 

diff --git a/packages/spelunker-api/src/lib/graph/schema/QueryType.mjs b/packages/spelunker-api/src/lib/graph/schema/QueryType.mjs
@@ -14,6 +14,7 @@ import ClassType from './entities/ClassType';
 import FactionType from './entities/FactionType';
 import GameObjectType from './entities/GameObjectType';
 import ItemType from './entities/ItemType';
+import ItemSetType from './entities/ItemSetType';
 import MapType from './entities/MapType';
 import NPCType from './entities/NPCType';
 import QuestType from './entities/QuestType';
@@ -57,6 +58,9 @@ export default new GraphQLObjectType({
     items: searchableCollectionFor(ItemType),
     item: finderFor(ItemType),
 
+    itemSets: searchableCollectionFor(ItemSetType),
+    itemSet: finderFor(ItemSetType),
+
     maps: searchableCollectionFor(MapType),
     map: finderFor(MapType),
 

diff --git a/packages/spelunker-api/src/lib/graph/schema/entities/ItemSetType.mjs b/packages/spelunker-api/src/lib/graph/schema/entities/ItemSetType.mjs
@@ -0,0 +1,22 @@
+import {
+  GraphQLInt,
+  GraphQLNonNull,
+  GraphQLObjectType,
+  GraphQLString,
+} from '../../../graphql';
+
+import CollectionType from '../CollectionType';
+
+import ItemQualityType from './ItemQualityType';
+import ItemType from './ItemType';
+
+export default new GraphQLObjectType({
+  name: 'ItemSet',
+  fields: () => ({
+    id: { type: new GraphQLNonNull(GraphQLInt) },
+    name: { type: new GraphQLNonNull(GraphQLString) },
+    quality: { type: ItemQualityType },
+
+    items: CollectionType.definitionFor(ItemType),
+  }),
+});
diff --git a/packages/spelunker-api/src/lib/graph/schema/entities/ItemType.mjs b/packages/spelunker-api/src/lib/graph/schema/entities/ItemType.mjs
@@ -13,6 +13,7 @@ import ItemDisplayInfoType from './ItemDisplayInfoType';
 import ItemLootType from './ItemLootType';
 import ItemQualityType from './ItemQualityType';
 import NPCLootType from './NPCLootType';
+import ItemSetType from './ItemSetType';
 import NPCSaleType from './NPCSaleType';
 import QuestType from './QuestType';
 
@@ -22,6 +23,7 @@ export default new GraphQLObjectType({
     id: { type: new GraphQLNonNull(GraphQLInt) },
     name: { type: new GraphQLNonNull(GraphQLString) },
     buyPrice: { type: CurrencyType },
+    itemSet: { type: ItemSetType },
     sellPrice: { type: CurrencyType },
     quality: { type: ItemQualityType },
 

diff --git a/packages/spelunker-web/src/components/Search/ResultsTab.jsx b/packages/spelunker-web/src/components/Search/ResultsTab.jsx
@@ -8,6 +8,7 @@ import classColumns from '../entities/Class/columns';
 import factionColumns from '../entities/Faction/columns';
 import gameObjectColumns from '../entities/GameObject/columns';
 import itemColumns from '../entities/Item/columns';
+import itemSetColumns from '../entities/ItemSet/columns';
 import mapColumns from '../entities/Map/columns';
 import npcColumns from '../entities/NPC/columns';
 import questColumns from '../entities/Quest/columns';
@@ -24,6 +25,7 @@ const columnsLookup = {
   factionColumns,
   gameObjectColumns,
   itemColumns,
+  itemSetColumns,
   mapColumns,
   npcColumns,
   questColumns,

diff --git a/packages/spelunker-web/src/components/Search/index.jsx b/packages/spelunker-web/src/components/Search/index.jsx
@@ -37,6 +37,9 @@ const search = gql`
     items(searchQuery: $searchQuery) {
       totalCount
     }
+    itemSets(searchQuery: $searchQuery) {
+      totalCount
+    }
     maps(searchQuery: $searchQuery) {
       totalCount
     }
@@ -104,6 +107,7 @@ class Search extends React.Component {
                 factions: { totalCount: factionCount },
                 objects: { totalCount: objectCount },
                 items: { totalCount: itemCount },
+                itemSets: { totalCount: itemSetCount },
                 maps: { totalCount: mapCount },
                 npcs: { totalCount: npcCount },
                 quests: { totalCount: questCount },
@@ -170,6 +174,15 @@ class Search extends React.Component {
                     columnsFragmentName="itemColumns"
                   />}
 
+                  {itemSetCount > 0 && <Tab
+                    label={`Item Sets (${itemSetCount})`}
+                    component={ResultsTab}
+                    path="item-sets"
+                    match={match}
+                    accessor="itemSets"
+                    columnsFragmentName="itemSetColumns"
+                  />}
+
                   {mapCount > 0 && <Tab
                     label={`Maps (${mapCount})`}
                     component={ResultsTab}

diff --git a/packages/spelunker-web/src/components/Spelunker/index.jsx b/packages/spelunker-web/src/components/Spelunker/index.jsx
@@ -21,6 +21,8 @@ import GameObject from '../entities/GameObject';
 import GameObjectList from '../entities/GameObject/List';
 import Item from '../entities/Item';
 import ItemList from '../entities/Item/List';
+import ItemSet from '../entities/ItemSet';
+import ItemSetList from '../entities/ItemSet/List';
 import Map from '../entities/Map';
 import MapList from '../entities/Map/List';
 import NPC from '../entities/NPC';
@@ -53,6 +55,7 @@ const Spelunker = () => (
               <li><NavLink to="/characters">Characters</NavLink></li>
               <li><NavLink to="/classes">Classes</NavLink></li>
               <li><NavLink to="/factions">Factions</NavLink></li>
+              <li><NavLink to="/item-sets">Item Sets</NavLink></li>
               <li><NavLink to="/items">Items</NavLink></li>
               <li><NavLink to="/maps">Maps</NavLink></li>
               <li><NavLink to="/npcs">NPCs</NavLink></li>
@@ -83,6 +86,9 @@ const Spelunker = () => (
           <Route path="/items/:id" component={Item} />
           <Route path="/items" component={ItemList} />
 
+          <Route path="/item-sets/:id" component={ItemSet} />
+          <Route path="/item-sets" component={ItemSetList} />
+
           <Route path="/maps/:id" component={Map} />
           <Route path="/maps" component={MapList} />
 

diff --git a/packages/spelunker-web/src/components/entities/Item/index.jsx b/packages/spelunker-web/src/components/entities/Item/index.jsx
@@ -2,6 +2,7 @@ import React from 'react';
 import gql from 'graphql-tag';
 
 import Currency from '../../formatters/Currency';
+import ItemSetReference from '../ItemSet/Reference';
 import { Box, Query, Tab, TabbedBox, Title } from '../../core';
 
 import ContainedInObjectTab from './tabs/ContainedInObject';
@@ -20,6 +21,9 @@ const fetchItem = gql`
     item(id: $id) {
       ...ItemReference
       buyPrice
+      itemSet {
+        ...ItemSetReference
+      }
       sellPrice
 
       containedIn {
@@ -53,6 +57,7 @@ const fetchItem = gql`
   }
 
   ${ItemReference.fragment}
+  ${ItemSetReference.fragment}
 `;
 
 const Item = ({ match }) => {
@@ -62,6 +67,10 @@ const Item = ({ match }) => {
       {({ data }) => {
         const { item } = data;
         const {
+          buyPrice,
+          itemSet,
+          sellPrice,
+
           containedIn: { totalCount: containedInCount },
           containedInObject: { totalCount: containedInObjectCount },
           contains: { totalCount: containCount },
@@ -80,15 +89,21 @@ const Item = ({ match }) => {
                 <ItemReference item={item} />
               </h1>
 
-              {item.buyPrice > 0 && (
+              {itemSet && (
+                <p>
+                  Part of: <ItemSetReference itemSet={itemSet} />
+                </p>
+              )}
+
+              {buyPrice > 0 && (
                 <p>
-                  Cost: <Currency value={item.buyPrice} />
+                  Cost: <Currency value={buyPrice} />
                 </p>
               )}
 
-              {item.sellPrice > 0 && (
+              {sellPrice > 0 && (
                 <p>
-                  Sells for: <Currency value={item.sellPrice} />
+                  Sells for: <Currency value={sellPrice} />
                 </p>
               )}
             </Box>

diff --git a/packages/spelunker-web/src/components/entities/ItemSet/List.jsx b/packages/spelunker-web/src/components/entities/ItemSet/List.jsx
@@ -0,0 +1,39 @@
+import React from 'react';
+import gql from 'graphql-tag';
+
+import { Box, Collection, Table, Title } from '../../core';
+
+import itemSetColumns from './columns';
+
+const listItemSets = gql`
+  query($offset: Int) {
+    itemSets(offset: $offset) {
+      totalCount
+      results {
+        ...itemSetColumns
+      }
+    }
+  }
+
+  ${itemSetColumns.fragment}
+`;
+
+const ItemSetList = () => (
+  <Box>
+    <Title path={['Item Sets']} />
+
+    <Collection
+      accessor="itemSets"
+      query={listItemSets}
+    >
+      {({ results }) => (
+        <Table
+          data={results}
+          columns={itemSetColumns}
+        />
+      )}
+    </Collection>
+  </Box>
+);
+
+export default ItemSetList;
diff --git a/packages/spelunker-web/src/components/entities/ItemSet/Reference/index.jsx b/packages/spelunker-web/src/components/entities/ItemSet/Reference/index.jsx
@@ -0,0 +1,24 @@
+import React from 'react';
+import gql from 'graphql-tag';
+import { Link } from 'react-router-dom';
+
+import styles from '../../Item/Reference/index.styl';
+
+const ItemSetReference = ({ itemSet }) => (
+  <Link
+    to={`/item-sets/${itemSet.id}`}
+    className={styles[itemSet.quality.toLowerCase()]}
+  >
+    {itemSet.name}
+  </Link>
+);
+
+ItemSetReference.fragment = gql`
+  fragment ItemSetReference on ItemSet {
+    id
+    name
+    quality
+  }
+`;
+
+export default ItemSetReference;
diff --git a/packages/spelunker-web/src/components/entities/ItemSet/columns/ReferenceColumn.jsx b/packages/spelunker-web/src/components/entities/ItemSet/columns/ReferenceColumn.jsx
@@ -0,0 +1,14 @@
+import React from 'react';
+
+import ItemSetReference from '../Reference';
+
+const ItemSetReferenceColumn = ({ value: itemSet }) => (
+  <ItemSetReference itemSet={itemSet} />
+);
+
+ItemSetReferenceColumn.defaultProps = {
+  id: 'item-set',
+  label: 'Item Set',
+};
+
+export default ItemSetReferenceColumn;
diff --git a/packages/spelunker-web/src/components/entities/ItemSet/columns/index.jsx b/packages/spelunker-web/src/components/entities/ItemSet/columns/index.jsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import gql from 'graphql-tag';
+
+import ItemSetReference from '../Reference';
+import { IDColumn } from '../../../core';
+
+import ItemSetReferenceColumn from './ReferenceColumn';
+
+const columns = [
+  <IDColumn />,
+  <ItemSetReferenceColumn />,
+];
+
+columns.fragment = gql`
+  fragment itemSetColumns on ItemSet {
+    ...ItemSetReference
+  }
+
+  ${ItemSetReference.fragment}
+`;
+
+export {
+  ItemSetReferenceColumn,
+  columns as default,
+};