fix autocomplete filling in fields
This commit is contained in:
parent
1ed0e72316
commit
3be59f97c3
@ -51,7 +51,7 @@ export default function NavBar(): ReactElement {
|
||||
</div>
|
||||
|
||||
{/* Links */}
|
||||
<div className="absolute inset-x-0 flex justify-start ml-16 lg:ml-0 lg:justify-center xs:justify-center">
|
||||
<div className="absolute inset-x-0 flex justify-center">
|
||||
<div className="flex gap-4">
|
||||
{pages.map((page, index) => {
|
||||
const isActive = path.includes(page.url);
|
||||
|
@ -49,13 +49,14 @@ export function LookupPlayer({ currentPlayer }: PlayerLookupProps): ReactElement
|
||||
description: (err as Error).message,
|
||||
duration: 5000,
|
||||
});
|
||||
return setLoading(false);
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<form
|
||||
className="flex flex-col gap-2 justify-center items-center mt-4 flex-wrap"
|
||||
autoComplete="off"
|
||||
action={(form: FormData) => {
|
||||
lookupPlayer(form.get("query") as string);
|
||||
}}
|
||||
|
27
src/app/components/player/player-skin.tsx
Normal file
27
src/app/components/player/player-skin.tsx
Normal file
@ -0,0 +1,27 @@
|
||||
import { CachedPlayer, SkinPart } from "mcutils-library";
|
||||
import { ReactElement } from "react";
|
||||
import { SkinPartImage } from "@/app/components/player/skin-part-image";
|
||||
|
||||
type PlayerSkinProps = {
|
||||
/**
|
||||
* The player to get the skin from.
|
||||
*/
|
||||
player: CachedPlayer;
|
||||
};
|
||||
|
||||
export function PlayerSkin({ player }: PlayerSkinProps): ReactElement {
|
||||
const skin = player.skin;
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-2">
|
||||
<p className="text-lg">Skin Parts</p>
|
||||
<div className="flex gap-2">
|
||||
{Object.entries(skin.parts)
|
||||
.filter(([part]) => part !== SkinPart.HEAD) // Don't show the head part again
|
||||
.map(([part, url]) => {
|
||||
return <SkinPartImage key={part} playerName={player.username} part={part as SkinPart} url={url} />;
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
@ -7,6 +7,7 @@ import { Button } from "../ui/button";
|
||||
import { Separator } from "../ui/separator";
|
||||
import { SkinPartImage } from "./skin-part-image";
|
||||
import { CacheInformation } from "@/app/components/cache-information";
|
||||
import { PlayerSkin } from "@/app/components/player/player-skin";
|
||||
|
||||
type PlayerViewProps = {
|
||||
/**
|
||||
@ -32,16 +33,7 @@ export function PlayerView({ player }: PlayerViewProps): ReactElement {
|
||||
|
||||
<Separator />
|
||||
|
||||
<div className="flex flex-col gap-2">
|
||||
<p className="text-lg">Skin Parts</p>
|
||||
<div className="flex gap-2">
|
||||
{Object.entries(player.skin.parts)
|
||||
.filter(([part]) => part !== SkinPart.HEAD) // Don't show the head part again
|
||||
.map(([part, url]) => {
|
||||
return <SkinPartImage key={part} playerName={player.username} part={part as SkinPart} url={url} />;
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
<PlayerSkin player={player} />
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
|
@ -57,13 +57,14 @@ export function LookupServer({ currentPlatform, currentServer }: LookupServerPro
|
||||
description: (err as Error).message,
|
||||
duration: 5000,
|
||||
});
|
||||
return setLoading(false);
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<form
|
||||
className="flex flex-col gap-2 justify-center items-center mt-4"
|
||||
autoComplete="off"
|
||||
action={(form: FormData) => {
|
||||
lookupServer(form.get("platform") as ServerPlatform, form.get("query") as string);
|
||||
}}
|
||||
|
@ -1,14 +1,12 @@
|
||||
import { CachedBedrockMinecraftServer, CachedJavaMinecraftServer } from "mcutils-library";
|
||||
import Image from "next/image";
|
||||
import { ReactElement } from "react";
|
||||
import { Card } from "../card";
|
||||
import { CodeDialog } from "../code-dialog";
|
||||
import { Button } from "../ui/button";
|
||||
import config from "@root/config.json";
|
||||
import { cn } from "@/common/utils";
|
||||
import { minecraft } from "@/app/font/fonts";
|
||||
import { CacheInformation } from "@/app/components/cache-information";
|
||||
import { Cache } from "mcutils-library";
|
||||
|
||||
type ServerViewProps = {
|
||||
/**
|
||||
|
@ -1,13 +1,13 @@
|
||||
"use client"
|
||||
"use client";
|
||||
|
||||
import * as React from "react"
|
||||
import * as PopoverPrimitive from "@radix-ui/react-popover"
|
||||
import * as React from "react";
|
||||
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
||||
|
||||
import { cn } from "@/common/utils"
|
||||
import { cn } from "@/common/utils";
|
||||
|
||||
const Popover = PopoverPrimitive.Root
|
||||
const Popover = PopoverPrimitive.Root;
|
||||
|
||||
const PopoverTrigger = PopoverPrimitive.Trigger
|
||||
const PopoverTrigger = PopoverPrimitive.Trigger;
|
||||
|
||||
const PopoverContent = React.forwardRef<
|
||||
React.ElementRef<typeof PopoverPrimitive.Content>,
|
||||
@ -20,12 +20,12 @@ const PopoverContent = React.forwardRef<
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
||||
className
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
</PopoverPrimitive.Portal>
|
||||
))
|
||||
PopoverContent.displayName = PopoverPrimitive.Content.displayName
|
||||
));
|
||||
PopoverContent.displayName = PopoverPrimitive.Content.displayName;
|
||||
|
||||
export { Popover, PopoverTrigger, PopoverContent }
|
||||
export { Popover, PopoverTrigger, PopoverContent };
|
||||
|
Loading…
Reference in New Issue
Block a user