Updated setup to vite and moved to hooks instead of class

src/HUD/Weapon/Weapon.tsx

@@ -1,19 +1,25 @@
-import React from 'react';
-import * as Weapons from './../../assets/Weapons';
+import React from "react";
+import * as Weapons from "./../../assets/Weapons";
 
 interface IProps extends React.SVGProps<SVGSVGElement> {
-	weapon: string,
-	active: boolean,
-	isGrenade?: boolean
+  weapon: string;
+  active: boolean;
+  isGrenade?: boolean;
 }
-export default class WeaponImage extends React.Component<IProps> {
-	render() {
-		const { weapon, active, isGrenade, ...rest } = this.props;
-		const Weapon = (Weapons as any)[weapon];
-		const { className, ...svgProps } = rest;
-		if(!Weapon) return null;
-		return (
-			<Weapon fill="white" className={`${active ? 'active':''} weapon ${isGrenade ? 'grenade' : ''} ${className || ''}`} {...svgProps} />
-		);
-	}	
-}
+const WeaponImage = ({ weapon, active, isGrenade, ...rest }: IProps) => {
+  const weaponId = weapon.replace("weapon_", "");
+  const Weapon = (Weapons as any)[weaponId];
+  const { className, ...svgProps } = rest;
+  if (!Weapon) return null;
+  return (
+    <Weapon
+      fill="white"
+      className={`${active ? "active" : ""} weapon ${
+        isGrenade ? "grenade" : ""
+      } ${className || ""}`}
+      {...svgProps}
+    />
+  );
+};
+
+export default React.memo(WeaponImage);