@rpg-engine/long-bow 0.4.87 → 0.4.89

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rpg-engine/long-bow",
-  "version": "0.4.87",
+  "version": "0.4.89",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -83,7 +83,7 @@
   },
   "dependencies": {
     "@rollup/plugin-image": "^2.1.1",
-    "@rpg-engine/shared": "^0.8.42",
+    "@rpg-engine/shared": "^0.8.35",
     "dayjs": "^1.11.2",
     "font-awesome": "^4.7.0",
     "fs-extra": "^10.1.0",

package/src/components/PartySystem/PartyManager/PartyManager.tsx

@@ -1,15 +1,21 @@
+import { ICharacterPartyShared } from '@rpg-engine/shared';
 import React from 'react';
 import styled from 'styled-components';
 import { uiColors } from '../../../constants/uiColors';
 import { DraggableContainer } from '../../DraggableContainer';
 import { RPGUIContainerTypes } from '../../RPGUIContainer';
-import { IPartyManagerRowProps, PartyManagerRow } from './PartyManagerRows';
+import { PartyManagerRow } from './PartyManagerRows';
 
 export interface IPartyManagerProps {
-  partyRows: IPartyManagerRowProps[];
+  partyRows: ICharacterPartyShared | null;
+  isLeader: boolean;
+  onClose?: () => void;
 }
 
-export const PartyManager: React.FC<IPartyManagerProps> = ({ partyRows }) => {
+export const PartyManager: React.FC<IPartyManagerProps> = ({
+  partyRows,
+  isLeader,
+}) => {
   return (
     <DraggableContainer
       type={RPGUIContainerTypes.Framed}
@@ -27,15 +33,34 @@ export const PartyManager: React.FC<IPartyManagerProps> = ({ partyRows }) => {
         </div>
       </Wrapper>
       <RowsWrapper className="partyRows">
-        {partyRows.map(partyRows => (
-          <PartyManagerRow
-            key={partyRows.id}
-            charName={partyRows.charName}
-            charClass={partyRows.charClass}
-            charLevel={partyRows.charLevel}
-            id={partyRows.id}
-          />
-        ))}
+        {partyRows ? (
+          <>
+            <PartyManagerRow
+              key={partyRows.leader._id}
+              id={partyRows.leader._id}
+              charName={partyRows.leader.name}
+              charClass={partyRows.leader.class}
+              isLeader={isLeader}
+              isLeaderRow={true}
+            />
+            {partyRows.members.map(partyRows => (
+              <PartyManagerRow
+                key={partyRows._id}
+                charName={partyRows.name}
+                charClass={partyRows.class}
+                id={partyRows._id}
+                isLeader={isLeader}
+              />
+            ))}
+          </>
+        ) : (
+          <>
+            <NotinParty>
+              You are not in party. <br />
+              Please create a new party
+            </NotinParty>
+          </>
+        )}
       </RowsWrapper>
     </DraggableContainer>
   );
@@ -55,3 +80,8 @@ const Title = styled.h1`
   font-size: 0.6rem;
   color: ${uiColors.yellow} !important;
 `;
+
+const NotinParty = styled.h1`
+  font-size: 0.6rem;
+  margin: auto;
+`;

package/src/components/PartySystem/PartyManager/PartyManagerRows.tsx

@@ -7,23 +7,28 @@ export interface IPartyManagerRowProps {
   id: string;
   charName: string;
   charClass: string;
-  charLevel: number;
+  isLeader: boolean;
+  isLeaderRow?: boolean;
 }
 
 export const PartyManagerRow: React.FC<IPartyManagerRowProps> = ({
   charName,
   charClass,
-  charLevel,
+  isLeader,
+  isLeaderRow,
 }) => {
   return (
     <PartyWrapper>
       <TextContainer>{charName}</TextContainer>
       <TextContainer>{charClass}</TextContainer>
-      <TextContainer>{charLevel}</TextContainer>
       <div className="cancel-button">
-        <Button buttonType={ButtonTypes.RPGUIButton}>Remove</Button>
+        <Button buttonType={ButtonTypes.RPGUIButton} disabled={!isLeader}>
+          {isLeaderRow ? 'Leader' : 'Remove'}
+        </Button>
       </div>
-      <Button buttonType={ButtonTypes.RPGUIButton}>New Leader</Button>
+      <Button buttonType={ButtonTypes.RPGUIButton} disabled={!isLeader}>
+        New Leader
+      </Button>
     </PartyWrapper>
   );
 };

package/src/components/PartySystem/mockedConstantes/mockedValues.tsx

@@ -1,3 +1,4 @@
+import { CharacterClass, ICharacterPartyShared } from '@rpg-engine/shared';
 import { v4 as uuidv4 } from 'uuid';
 import { IPartyRowProps } from '../PartyDashboard/PartyRows';
 import { IPlayersRowProps } from '../PartyInvite';
@@ -78,6 +79,23 @@ export const mockedPartyRows: IPartyRowProps[] = [
   },
 ];
 
+export const mockedPlayersRows2: ICharacterPartyShared = {
+  id: uuidv4(),
+  leader: {
+    _id: uuidv4(),
+    class: CharacterClass.Druid,
+    name: 'leader',
+  },
+  members: [
+    { _id: uuidv4(), class: CharacterClass.Druid, name: 'blblb' },
+    { _id: uuidv4(), class: CharacterClass.Druid, name: 'blblb' },
+    { _id: uuidv4(), class: CharacterClass.Druid, name: 'blblb' },
+    { _id: uuidv4(), class: CharacterClass.Druid, name: 'blblb' },
+  ],
+  maxSize: 5,
+  size: 4,
+};
+
 export const mockedPlayersRows: IPlayersRowProps[] = [
   {
     id: uuidv4(),
@@ -121,30 +139,30 @@ export const mockedPartyManager: IPartyManagerRowProps[] = [
     id: uuidv4(),
     charName: 'CharNome',
     charClass: 'CharClass',
-    charLevel: 1,
+    isLeader: false,
   },
   {
     id: uuidv4(),
     charName: 'CharNome',
     charClass: 'CharClass',
-    charLevel: 1,
+    isLeader: false,
   },
   {
     id: uuidv4(),
     charName: 'CharNome',
     charClass: 'CharClass',
-    charLevel: 1,
+    isLeader: false,
   },
   {
     id: uuidv4(),
     charName: 'CharNome',
     charClass: 'CharClass',
-    charLevel: 1,
+    isLeader: false,
   },
   {
     id: uuidv4(),
     charName: 'CharNome',
     charClass: 'CharClass',
-    charLevel: 1,
+    isLeader: false,
   },
 ];

package/src/components/SkillProgressBar.tsx

@@ -37,14 +37,11 @@ export const SkillProgressBar: React.FC<ISkillProgressBarProps> = ({
     skillPointsToNextLevel = getSPForLevel(level + 1);
   }
 
-  const skillsBuffsCalc = (level: number, buffAndDebuff: number): string => {
-    const result = level * (buffAndDebuff / 100);
-
-    if (result > 0) {
-      return `+${result.toFixed(2)}`;
-    } else {
-      return `${result.toFixed(2)}`;
+  const skillsBuffsCalc = () => {
+    if (buffAndDebuff) {
+      return 1 + buffAndDebuff / 100;
     }
+    return;
   };
 
   return (
@@ -57,7 +54,7 @@ export const SkillProgressBar: React.FC<ISkillProgressBarProps> = ({
                 <TitleNameContainer>
                   <TitleNameBuff>{skillName}</TitleNameBuff>
                   <TitleNameBuff>
-                    lv {level} ({skillsBuffsCalc(level, buffAndDebuff)})
+                    lv {level} ({skillsBuffsCalc()})
                   </TitleNameBuff>
                 </TitleNameContainer>
                 <TitleNameBuffContainer>
@@ -69,7 +66,7 @@ export const SkillProgressBar: React.FC<ISkillProgressBarProps> = ({
                 <TitleNameContainer>
                   <TitleNameDebuff>{skillName}</TitleNameDebuff>
                   <TitleNameDebuff>
-                    lv {level} ({skillsBuffsCalc(level, buffAndDebuff)})
+                    lv {level} ({skillsBuffsCalc()})
                   </TitleNameDebuff>
                 </TitleNameContainer>
                 <div>

package/src/stories/PartyManager.stories.tsx

@@ -1,10 +1,10 @@
 import { Meta, Story } from '@storybook/react';
 import React from 'react';
+import { mockedPlayersRows2 } from '../components/PartySystem';
 import {
   IPartyManagerProps,
   PartyManager,
 } from '../components/PartySystem/PartyManager/PartyManager';
-import { mockedPartyManager } from '../components/PartySystem/mockedConstantes/mockedValues';
 import { RPGUIRoot } from '../components/RPGUIRoot';
 
 const meta: Meta = {
@@ -23,5 +23,5 @@ const Template: Story<IPartyManagerProps> = args => (
 export const Default = Template.bind({});
 
 Default.args = {
-  partyRows: mockedPartyManager,
+  partyRows: mockedPlayersRows2,
 };