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

20
app/components/skin_selector.tsx
View File

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

9
app/components/skin_tile.tsx
View File

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