Implement give item (frontend)

src/handbook/src/backend/server.ts

@@ -12,6 +12,15 @@ export function setTargetPlayer(player: number): void {
     console.log(`Target Player is now: ${targetPlayer}`);
 }
 
+/**
+ * Validates a number.
+ *
+ * @param value The number to validate.
+ */
+function invalid(value: number): boolean {
+    return isNaN(value) || value < 0;
+}
+
 /**
  * Grants an avatar to a player.
  *
@@ -24,6 +33,11 @@ export async function grantAvatar(
     avatar: number, level = 90,
     constellations = 6, talents = 6
 ): Promise<CommandResponse> {
+    // Validate the numbers.
+    if (invalid(avatar) || invalid(level)
+        || invalid(constellations) || invalid(talents))
+        return { status: -1, message: "Invalid arguments." };
+
     return await fetch(`https://localhost:443/handbook/avatar`, {
         method: "POST", body: JSON.stringify({
             player: targetPlayer.toString(),
@@ -32,3 +46,27 @@ export async function grantAvatar(
         })
     }).then(res => res.json());
 }
+
+/**
+ * Gives an item to the player.
+ * This does not support weapons.
+ * This does not support relics.
+ *
+ * @param item The item's ID.
+ * @param amount The amount of the item to give.
+ */
+export async function giveItem(
+    item: number, amount = 1
+): Promise<CommandResponse> {
+    // Validate the number.
+    if (isNaN(amount) || amount < 1)
+        return { status: -1, message: "Invalid amount." };
+
+    return await fetch(`https://localhost:443/handbook/item`, {
+        method: "POST", body: JSON.stringify({
+            player: targetPlayer.toString(),
+            item: item.toString(),
+            amount
+        })
+    }).then(res => res.json());
+}

src/handbook/src/ui/widgets/ItemCard.tsx

@@ -3,6 +3,7 @@ import React from "react";
 import type { Item as ItemType, ItemInfo } from "@backend/types";
 import { itemTypeToString } from "@backend/types";
 import { itemIcon } from "@app/utils";
+import { giveItem } from "@backend/server";
 
 import "@css/widgets/ItemCard.scss";
 
@@ -81,7 +82,9 @@ class ItemCard extends React.Component<IProps, IState> {
      * @private
      */
     private async addToInventory(): Promise<void> {
-        // TODO: Implement server access.
+        await giveItem(this.props.item?.id ?? 102,
+            typeof(this.state.count) == "string" ?
+                parseInt(this.state.count) : this.state.count);
     }
 
     componentDidUpdate(prevProps: Readonly<IProps>, prevState: Readonly<IState>, snapshot?: any) {