Porning/app
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Using state for weapons (necessary for agent)

Browse Source
This commit is contained in:
AINDUSTRIES
2026-09-28 01:11:52 +02:00
parent 221019f3ca
commit 31ac45f052
3 changed files with 32 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
app/components/inventory.tsx
View File

@@ -13,6 +13,10 @@ export function Inventory({ side }: { side: "T" | "CT" }) {
const [weapons, setWeapons] = useState<Array<WeaponInfo>>([]);
const { notify } = useNotification();
const setWeapon = (index:number, newWeapon:WeaponInfo) => {
setWeapons(weapons.map((v,i) => (i===index ? newWeapon: v)))
}
useEffect(() => {
const fetch_weapons = async () => {
let response = await fetch(
@@ -141,19 +145,22 @@ export function Inventory({ side }: { side: "T" | "CT" }) {
<div className="flex gap-2">
{knife && (
<SkinTile
skinInfo={knife}
skin={knife}
setSkin={(newSkin) => setKnife(newSkin as WeaponInfo)}
side={side}
></SkinTile>
)}
{gloves && (
<SkinTile
skinInfo={gloves}
skin={gloves}
setSkin={(newSkin) => setGloves(newSkin as WeaponInfo)}
side={side}
></SkinTile>
)}
{agent && (
<SkinTile
skinInfo={agent}
skin={agent}
setSkin={(newSkin) => setAgent(newSkin as AgentInfo)}
side={side}
></SkinTile>
)}
@@ -167,7 +174,8 @@ export function Inventory({ side }: { side: "T" | "CT" }) {
{weapons.map((v, i) => (
<SkinTile
key={i}
skinInfo={v}
skin={v}
setSkin={(newWeapon) => setWeapon(i, newWeapon as WeaponInfo)}
side={side}
/>
))}

20
app/components/skin_selector.tsx
View File

@@ -17,7 +17,7 @@ export function SkinSelector({
setIsOpen,
skin,
setSkin,
side
side,
}: {
isOpen: boolean;
setIsOpen: Dispatch<SetStateAction<boolean>>;
@@ -32,7 +32,7 @@ export function SkinSelector({
if (skin instanceof WeaponInfo) {
const newSkin = new WeaponInfo(skin);
newSkin.paint_index = v.paint_index;
newSkin.display = newSkin.display.split("|")[0] + " | " + v.display;
newSkin.display = v.display === "" ? newSkin.display : newSkin.display.split("|")[0] + " | " + v.display;
newSkin.min_float = v.min_float;
newSkin.max_float = v.max_float;
newSkin.color = v.color;
@@ -70,6 +70,7 @@ export function SkinSelector({
fetchSkins();
}
}, [isOpen]);
return (
<Modal isOpen={isOpen}>
<Modal.Backdrop
@@ -79,7 +80,7 @@ export function SkinSelector({
return true;
}}
>
<Modal.Container size="lg">
<Modal.Container size="cover">
<Modal.Dialog>
<Modal.CloseTrigger
onPress={() => {
@@ -87,7 +88,7 @@ export function SkinSelector({
}}
/>
<Modal.Body className="mt-6">
<div className="flex flex-col gap-2">
<div className="grid grid-cols-4 gap-2">
{skins &&
skins.map((v, i) => (
<Button
@@ -95,7 +96,10 @@ export function SkinSelector({
setPaint(v);
setIsOpen(false);
}}
className="flex flex-col w-full h-fit items-center justify-start"
className="flex flex-col w-full h-fit items-center justify-start rounded-none p-0"
style={{
background: `linear-gradient(to bottom, #1f2937, ${v.color}64)`,
}}
>
<img
key={i}
@@ -106,6 +110,12 @@ export function SkinSelector({
<Typography.Heading level={3}>
{v.display}
</Typography.Heading>
<div
className="h-1 w-full"
style={{
backgroundColor: v.color,
}}
></div>
</Button>
))}
</div>

9
app/components/skin_tile.tsx
View File

@@ -1,18 +1,19 @@
import { Button, Typography } from "@heroui/react";
import { Float } from "./float";
import { useState } from "react";
import { useState, type Dispatch, type SetStateAction } from "react";
import { SkinDialog } from "./skin_dialog";
import { WeaponInfo, AgentInfo } from "~/types/skin";
export function SkinTile({
skinInfo,
skin,
setSkin,
side,
}: {
skinInfo: WeaponInfo | AgentInfo;
skin: WeaponInfo | AgentInfo;
setSkin: Dispatch<SetStateAction<WeaponInfo | AgentInfo>>
side: "T" | "CT";
}) {
const [isDialogOpen, setIsDialogOpen] = useState(false);
const [skin, setSkin] = useState(skinInfo);
const acolor = `${skin.color}64`;
return (
<>