Adds quality selection, all dungeons

src/components/QualitySelector.tsx

@@ -0,0 +1,27 @@
+import { useAppState } from "../lib/context/StateContext";
+import { Quality, type EquipedItem } from "../lib/types";
+
+export type Props = {
+  item: EquipedItem;
+};
+
+export const QualitySelector = ({ item }: Props) => {
+  const { dispatch } = useAppState();
+
+  const handleOnChange = (event: React.ChangeEvent<HTMLSelectElement>) => {
+    dispatch({
+      action: "changeQuality",
+      itemId: item.id,
+      quality: event.target.value as Quality,
+    });
+  };
+  return (
+    <select onChange={handleOnChange}>
+      {Object.values(Quality).map((quality) => (
+        <option value={quality} selected={item.quality === quality}>
+          {quality.charAt(0).toUpperCase() + quality.slice(1)}
+        </option>
+      ))}
+    </select>
+  );
+};