@rpg-engine/long-bow 0.3.34 → 0.3.36

package/src/mocks/itemContainer.mocks.ts

@@ -39,7 +39,7 @@ export const items: IItem[] = [
     isStackable: false,
     createdAt: '2022-06-04T03:18:09.335Z',
     updatedAt: '2022-06-04T18:16:49.056Z',
-    rarity: ItemRarities.Common
+    rarity: ItemRarities.Legendary
   },
   {
     _id: '629acef1c7c8e8002ff73564',
@@ -72,7 +72,7 @@ export const items: IItem[] = [
     isStackable: false,
     createdAt: '2022-06-04T03:18:09.335Z',
     updatedAt: '2022-06-04T18:16:49.056Z',
-    rarity: ItemRarities.Common
+    rarity: ItemRarities.Epic
   },
   {
     _id: '629acef1c7c8e8002ff60723',
@@ -106,7 +106,7 @@ export const items: IItem[] = [
     fullDescription: 'Recover your life',
     createdAt: '2022-06-04T03:18:09.335Z',
     updatedAt: '2022-06-04T18:16:49.056Z',
-    rarity: ItemRarities.Common
+    rarity: ItemRarities.Uncommon
   },
   {
     _id: '629acek4j7c8e8002ff60034',
@@ -140,7 +140,7 @@ export const items: IItem[] = [
     fullDescription: 'Recover your mana',
     createdAt: '2022-06-04T03:18:09.335Z',
     updatedAt: '2022-06-04T18:16:49.056Z',
-    rarity: ItemRarities.Common
+    rarity: ItemRarities.Rare
   },
   {
     _id: '629acek4j7c8e8002fg60034',

package/src/stories/QuickSpells.stories.tsx

@@ -0,0 +1,38 @@
+import { Meta, Story } from '@storybook/react';
+import React from 'react';
+import { RPGUIRoot } from '../components/RPGUIRoot';
+import { SPELL_SHORTCUTS_STORAGE_KEY } from '../components/Spellbook/constants';
+import {
+  QuickSpells,
+  QuickSpellsProps,
+} from '../components/Spellbook/QuickSpells';
+
+const meta: Meta = {
+  title: 'QuickSpells',
+  component: QuickSpells,
+};
+
+export default meta;
+
+const Template: Story<QuickSpellsProps> = args => {
+  return (
+    <RPGUIRoot>
+      <div
+        style={{
+          width: '100%',
+        }}
+      >
+        <QuickSpells {...args} />
+      </div>
+    </RPGUIRoot>
+  );
+};
+
+export const Default = Template.bind({});
+Default.args = {
+  onSpellCast: spellKey => console.log(spellKey),
+  quickSpells: JSON.parse(
+    localStorage.getItem(SPELL_SHORTCUTS_STORAGE_KEY) as string
+  ),
+  mana: 100,
+};

package/src/stories/Spellbook.stories.tsx

@@ -0,0 +1,107 @@
+import { Meta, Story } from '@storybook/react';
+import React, { useEffect, useState } from 'react';
+import { RPGUIRoot } from '../components/RPGUIRoot';
+import {
+  defaultSpellShortcut,
+  SPELL_SHORTCUTS_STORAGE_KEY,
+} from '../components/Spellbook/constants';
+import { mockSpells } from '../components/Spellbook/mockSpells';
+import { ISpellbookProps, Spellbook } from '../components/Spellbook/Spellbook';
+
+const meta: Meta = {
+  title: 'Spellbook',
+  component: Spellbook,
+};
+
+export default meta;
+
+const Template: Story<ISpellbookProps> = args => {
+  const [spellShortcuts, setSpellShortcuts] = useState([]);
+
+  useEffect(() => {
+    const shortcuts = localStorage.getItem(SPELL_SHORTCUTS_STORAGE_KEY);
+    if (shortcuts) {
+      setSpellShortcuts(JSON.parse(shortcuts));
+    }
+  }, []);
+
+  const setSpellShortcut = (key: string, index: number) => {
+    const spellShortcuts = JSON.parse(
+      localStorage.getItem(SPELL_SHORTCUTS_STORAGE_KEY) as string
+    );
+
+    const spell = mockSpells.find(s => s.key === key);
+    if (!spell) {
+      return;
+    }
+
+    if (!spellShortcuts) {
+      const newSpellShortcuts = [
+        defaultSpellShortcut,
+        defaultSpellShortcut,
+        defaultSpellShortcut,
+        defaultSpellShortcut,
+      ];
+
+      newSpellShortcuts[index] = spell;
+
+      localStorage.setItem(
+        SPELL_SHORTCUTS_STORAGE_KEY,
+        JSON.stringify(newSpellShortcuts)
+      );
+    } else {
+      spellShortcuts[index] = spell;
+
+      localStorage.setItem(
+        SPELL_SHORTCUTS_STORAGE_KEY,
+        JSON.stringify(spellShortcuts)
+      );
+    }
+
+    setSpellShortcuts(spellShortcuts);
+  };
+
+  const removeSpellShortcut = (index: number) => {
+    const spellShortcuts = JSON.parse(
+      localStorage.getItem(SPELL_SHORTCUTS_STORAGE_KEY) as string
+    );
+
+    if (!spellShortcuts) return;
+
+    spellShortcuts[index] = defaultSpellShortcut;
+
+    localStorage.setItem(
+      SPELL_SHORTCUTS_STORAGE_KEY,
+      JSON.stringify(spellShortcuts)
+    );
+
+    setSpellShortcuts(spellShortcuts);
+  };
+
+  return (
+    <RPGUIRoot>
+      <div
+        style={{
+          width: '50%',
+          height: '75%',
+        }}
+      >
+        <Spellbook
+          {...args}
+          setSpellShortcut={setSpellShortcut}
+          removeSpellShortcut={removeSpellShortcut}
+          spellShortcuts={spellShortcuts}
+        />
+      </div>
+    </RPGUIRoot>
+  );
+};
+
+export const Default = Template.bind({});
+Default.args = {
+  onClose: () => console.log('close'),
+  onSpellClick: spellKey => console.log(spellKey),
+  spells: mockSpells,
+  magicLevel: 3,
+  mana: 5,
+};