Stock availability docs (#10927)

* Add deficit stock badge

* screenshots

* Add "stock availability" page

* Update stock index page

src/frontend/src/pages/part/PartDetail.tsx

@@ -979,6 +979,8 @@ export default function PartDetail() {
       partRequirements.required_for_build_orders +
       partRequirements.required_for_sales_orders;
 
+    const shortfall = Math.max(required - partRequirements.total_stock, 0);
+
     return [
       <DetailsBadge
         label={`${t`In Stock`}: ${formatDecimal(partRequirements.total_stock)}`}
@@ -1023,6 +1025,12 @@ export default function PartDetail() {
         visible={partRequirements.building > 0}
         key='in_production'
       />,
+      <DetailsBadge
+        label={`${t`Deficit`}: ${formatDecimal(shortfall)}`}
+        color='red'
+        visible={shortfall > 0}
+        key='deficit'
+      />,
       <DetailsBadge
         label={t`Inactive`}
         color='red'