diff --git a/client/src/components/inventory.css b/client/src/components/inventory.css
index bb4eda5..16727e4 100644
--- a/client/src/components/inventory.css
+++ b/client/src/components/inventory.css
@@ -42,7 +42,7 @@
background-color: rgb(255, 242, 190);
}
-.inventory .item:not(.locked) {
+.inventory .item:not(.locked), .inventory .item.enabled {
cursor: pointer;
}
diff --git a/client/src/components/inventory.tsx b/client/src/components/inventory.tsx
index dccadd4..3d085dd 100644
--- a/client/src/components/inventory.tsx
+++ b/client/src/components/inventory.tsx
@@ -7,10 +7,11 @@ import { GameIdContext } from '../app';
import Markdown from './markdown';
import { useLoadDocQuery, InventoryTile, LevelInfo, InventoryOverview } from '../state/api';
-export function Inventory({levelInfo, openDoc } :
+export function Inventory({levelInfo, openDoc, enableAll=false} :
{
levelInfo: LevelInfo|InventoryOverview,
openDoc: (name: string, type: string) => void,
+ enableAll?: boolean,
}) {
return (
@@ -19,27 +20,28 @@ export function Inventory({levelInfo, openDoc } :
TODO: click on paste icon -> paste into command line */}
Tactics
{levelInfo?.tactics &&
-
+
}
Definitions
{levelInfo?.definitions &&
-
+
}
Lemmas
{levelInfo?.lemmas &&
-
+
}
)
}
-function InventoryList({items, docType, openDoc, defaultTab=null, level=undefined} :
+function InventoryList({items, docType, openDoc, defaultTab=null, level=undefined, enableAll=false} :
{
items: InventoryTile[],
docType: string,
openDoc(name: string, type: string): void,
defaultTab? : string,
level? : LevelInfo|InventoryOverview,
+ enableAll?: boolean,
}) {
// TODO: `level` is only used in the `useEffect` below to check if a new level has
// been loaded. Is there a better way to observe this?
@@ -67,22 +69,22 @@ function InventoryList({items, docType, openDoc, defaultTab=null, level=undefine
onClick={() => { setTab(cat) }}>{cat})}
}
- {[...items].sort(
- // For lemas, sort entries `available > disabled > locked`
- // otherwise alphabetically
- (x, y) => +(docType == "Lemma") * (+x.locked - +y.locked || +x.disabled - +y.disabled)
- ).filter(item => ((tab ?? categories[0]) == item.category)).map((item, i) => {
- return {openDoc(item.name, docType)}}
- name={item.name} displayName={item.displayName} locked={item.locked}
- disabled={item.disabled} newly={item.new}/>
- })
- }
+ {[...items].sort(
+ // For lemas, sort entries `available > disabled > locked`
+ // otherwise alphabetically
+ (x, y) => +(docType == "Lemma") * (+x.locked - +y.locked || +x.disabled - +y.disabled)
+ ).filter(item => ((tab ?? categories[0]) == item.category)).map((item, i) => {
+ return {openDoc(item.name, docType)}}
+ name={item.name} displayName={item.displayName} locked={item.locked}
+ disabled={item.disabled} newly={item.new} enableAll={enableAll}/>
+ })
+ }
>
}
-function InventoryItem({name, displayName, locked, disabled, newly, showDoc}) {
+function InventoryItem({name, displayName, locked, disabled, newly, showDoc, enableAll=false}) {
const icon = locked ? :
disabled ? : ""
const className = locked ? "locked" : disabled ? "disabled" : newly ? "new" : ""
@@ -90,12 +92,12 @@ function InventoryItem({name, displayName, locked, disabled, newly, showDoc}) {
disabled ? "Not available in this level" : ""
const handleClick = () => {
- if (!locked) {
+ if (enableAll || !locked) {
showDoc()
}
}
- return {icon} {displayName}
+ return {icon} {displayName}
}
export function Documentation({name, type, handleClose}) {
diff --git a/client/src/components/welcome.tsx b/client/src/components/welcome.tsx
index 16224c5..1d13fbb 100644
--- a/client/src/components/welcome.tsx
+++ b/client/src/components/welcome.tsx
@@ -138,7 +138,7 @@ function Welcome() {
{inventoryDoc ?
:
-
+
}
>}