Compare commits

...

4 Commits

5 changed files with 41 additions and 35 deletions

View File

@@ -20,6 +20,15 @@ export function Float({
acceptInput?: boolean; acceptInput?: boolean;
hasLabel?: boolean; hasLabel?: boolean;
}) { }) {
useEffect(() => {
const newSkin = new WeaponInfo(skin);
newSkin.float = Math.max(
skin.min_float,
Math.min(skin.max_float, skin.float),
);
setSkin(newSkin);
}, [skin.min_float, skin.max_float]);
const handleChange = (newValue: number | number[]) => { const handleChange = (newValue: number | number[]) => {
const val = Array.isArray(newValue) ? newValue[0] : newValue; const val = Array.isArray(newValue) ? newValue[0] : newValue;
const newSkin = new WeaponInfo(skin); const newSkin = new WeaponInfo(skin);

View File

@@ -29,7 +29,7 @@ export function Inventory({ side }: { side: "T" | "CT" }) {
setGloves(new WeaponInfo(data[0])); setGloves(new WeaponInfo(data[0]));
[success, data] = await get(`skin?team=${side}`); [success, data] = await get(`skin?team=${side}&category=Weapons`);
setWeapons(data.map((item: any) => (new WeaponInfo(item)))); setWeapons(data.map((item: any) => (new WeaponInfo(item))));

View File

@@ -37,7 +37,7 @@ export function SkinDialog({
const applySkin = (side: "SIDE" | "BOTH") => { const applySkin = (side: "SIDE" | "BOTH") => {
setSkin(localSkin); setSkin(localSkin);
} };
useEffect(() => { useEffect(() => {
if (!selectorOpen) { if (!selectorOpen) {
@@ -82,14 +82,8 @@ export function SkinDialog({
> >
{localSkin.display} {localSkin.display}
</Typography.Heading> </Typography.Heading>
<Button <div className="gap-0">
onClick={() => { <div className="bg-mist-700 flex flex-col h-full p-0 rounded-none gap-0 w-full">
setCanClose(false);
setSelectorOpen(true);
}}
className="bg-mist-700 flex flex-col h-full p-0 rounded-none gap-0 hover:bg-indigo-800 active:bg-indigo-900"
>
<div className="flex flex-col w-full h-full">
<div <div
className="bg-linear-to-b pointer-events-none w-full h-full relative" className="bg-linear-to-b pointer-events-none w-full h-full relative"
style={{ style={{
@@ -101,25 +95,6 @@ export function SkinDialog({
className="pointer-events-none object-contain object-bottom h-full" className="pointer-events-none object-contain object-bottom h-full"
alt="Weapon image" alt="Weapon image"
/> />
<Surface
className="rounded-full w-fit h-fit p-2 absolute bottom-2 right-2"
variant="secondary"
>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="size-6 m-0"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"
/>
</svg>
</Surface>
</div> </div>
<div <div
className={`h-1 w-full`} className={`h-1 w-full`}
@@ -128,7 +103,16 @@ export function SkinDialog({
}} }}
></div> ></div>
</div> </div>
<Button
onClick={() => {
setCanClose(false);
setSelectorOpen(true);
}}
className="w-full rounded-b-xl rounded-t-none"
>
Change skin
</Button> </Button>
</div>
{localSkin instanceof WeaponInfo && ( {localSkin instanceof WeaponInfo && (
<Float <Float
skin={localSkin} skin={localSkin}
@@ -156,12 +140,24 @@ export function SkinDialog({
Transaction id: {localSkin.id} Transaction id: {localSkin.id}
</Typography.Code> </Typography.Code>
<div className="flex gap-2 justify-end"> <div className="flex gap-2 justify-end">
<div className="flex-1">
<Button>Inspect</Button>
</div>
{localSkin instanceof WeaponInfo && ( {localSkin instanceof WeaponInfo && (
<Button onClick={() => {applySkin("BOTH")}} variant="secondary"> <Button
onClick={() => {
applySkin("BOTH");
}}
variant="secondary"
>
Apply to Both Apply to Both
</Button> </Button>
)} )}
<Button onClick={() => {applySkin("SIDE")}}> <Button
onClick={() => {
applySkin("SIDE");
}}
>
Apply Apply
{localSkin instanceof WeaponInfo {localSkin instanceof WeaponInfo
? ` to ${side}` ? ` to ${side}`

View File

@@ -85,8 +85,8 @@ export function AuthProvider({ children }: PropsWithChildren) {
}; };
const logout = async () => { const logout = async () => {
const [_, data] = await get("logout"); const [ok, _] = await get("logout");
if (data === null) { if (ok) {
setUser(null); setUser(null);
notify( notify(
{ {

View File

@@ -1,6 +1,6 @@
import { useState } from "react"; import { useState } from "react";
import Base from "./base"; import Base from "./base";
import { Surface, Tabs } from "@heroui/react"; import { Button, Surface, Tabs } from "@heroui/react";
import { Inventory } from "~/components/inventory"; import { Inventory } from "~/components/inventory";
export function InventoryPage() { export function InventoryPage() {
@@ -11,7 +11,7 @@ export function InventoryPage() {
className="flex flex-col flex-1 min-h-0 h-0 shadow-lg shadow-indigo-900 ring-1 ring-indigo-800 p-2 m-2 rounded-3xl gap-2" className="flex flex-col flex-1 min-h-0 h-0 shadow-lg shadow-indigo-900 ring-1 ring-indigo-800 p-2 m-2 rounded-3xl gap-2"
variant="default" variant="default"
> >
<div className="w-full h-min flex"> <div className="w-full h-min flex justify-between items-center">
<Tabs <Tabs
selectedKey={side} selectedKey={side}
onSelectionChange={(key) => { onSelectionChange={(key) => {
@@ -40,6 +40,7 @@ export function InventoryPage() {
</Tabs.List> </Tabs.List>
</Tabs.ListContainer> </Tabs.ListContainer>
</Tabs> </Tabs>
<Button>Need help?</Button>
</div> </div>
<Inventory side={side} /> <Inventory side={side} />
</Surface> </Surface>