Add balance and storage alert counts to account card

README.md

@@ -2,7 +2,7 @@
 
 Simple tool to track your PI planet extractors. Login with your characters and enjoy the PI!
 
-Any questions, feedback or suggestions are welcome at [EVE PI Discord](https://discord.gg/GPtw5kfuJu)
+Any questions, feedback or suggestions are welcome at [EVE PI Discord](https://discord.gg/bCdXzU8PHK)
 
 ## [Avanto hosted PI tool](https://pi.avanto.tk)
 

src/app/components/Account/AccountCard.tsx

@@ -376,6 +376,24 @@ export const AccountCard = ({ characters, isCollapsed: propIsCollapsed }: { char
               >
                 Extractors: {runningExtractors}/{totalExtractors}
               </Typography>
+              <Divider orientation="vertical" flexItem sx={{ height: 16, borderColor: theme.palette.divider }} />
+              <Typography 
+                sx={{ 
+                  fontSize: "0.8rem",
+                  color: Object.values(planetDetails).some(d => d.alertState.hasLowStorage) ? theme.palette.error.main : theme.palette.text.secondary,
+                }}
+              >
+                Storage Alerts: {Object.values(planetDetails).filter(d => d.alertState.hasLowStorage).length}
+              </Typography>
+              <Divider orientation="vertical" flexItem sx={{ height: 16, borderColor: theme.palette.divider }} />
+              <Typography 
+                sx={{ 
+                  fontSize: "0.8rem",
+                  color: Object.values(planetDetails).some(d => d.alertState.hasLargeExtractorDifference) ? theme.palette.error.main : theme.palette.text.secondary,
+                }}
+              >
+                Balance Alerts: {Object.values(planetDetails).filter(d => d.alertState.hasLargeExtractorDifference).length}
+              </Typography>
             </Box>
           </Box>
           <IconButton 

src/app/components/Discord/DiscordButton.tsx

@@ -4,7 +4,7 @@ export const DiscordButton = () => {
     <Box>
       <Tooltip title="Come nerd out in discord about PI and this tool">
         <Button
-          href="https://discord.gg/GPtw5kfuJu"
+          href="https://discord.gg/bCdXzU8PHK"
           target="_blank"
           style={{ width: "100%" }}
           sx={{ color: "white", display: "block" }}

src/app/components/PlanetaryInteraction/PlanetTableRow.tsx

@@ -1,6 +1,5 @@
 import { ColorContext, SessionContext } from "@/app/context/Context";
-import { PI_TYPES_MAP, STORAGE_IDS, STORAGE_CAPACITIES, PI_PRODUCT_VOLUMES, EVE_IMAGE_URL, PI_SCHEMATICS, LAUNCHPAD_IDS } from "@/const";
+import { PI_TYPES_MAP, EVE_IMAGE_URL, LAUNCHPAD_IDS } from "@/const";
-import { planetCalculations } from "@/planets";
 import { AccessToken, PlanetWithInfo } from "@/types";
 import { PlanetCalculations, StorageInfo } from "@/types/planet";
 import CloseIcon from "@mui/icons-material/Close";
@@ -419,50 +418,55 @@ export const PlanetTableRow = ({
                     </TableRow>
                   </TableHead>
                   <TableBody>
-                    {planetDetails.storageInfo.map((storage: StorageInfo, idx: number) => {
+                    {planetDetails.storageInfo
-                      const isLaunchpad = LAUNCHPAD_IDS.includes(storage.type_id);
+                      .map(storage => ({
-                      const fillRate = storage.fillRate;
+                        ...storage,
-                      const color = fillRate > 90 ? '#ff0000' : fillRate > 80 ? '#ffa500' : fillRate > 60 ? '#ffd700' : 'inherit';
+                        isLaunchpad: LAUNCHPAD_IDS.includes(storage.type_id)
-                      const contents = planet.info.pins.find(p => p.type_id === storage.type_id)?.contents || [];
+                      }))
-                      
+                      .sort((a, b) => (b.isLaunchpad ? 1 : 0) - (a.isLaunchpad ? 1 : 0))
-                      return (
+                      .map((storage, idx) => {
-                        <React.Fragment key={`storage-${character.character.characterId}-${planet.planet_id}-${storage.type}-${idx}`}>
+                        const fillRate = storage.fillRate;
-                          <TableRow>
+                        const color = fillRate > 90 ? '#ff0000' : fillRate > 80 ? '#ffa500' : fillRate > 60 ? '#ffd700' : 'inherit';
-                            <TableCell>{isLaunchpad ? 'Launchpad' : 'Storage'}</TableCell>
+                        const contents = planet.info.pins.find(p => p.type_id === storage.type_id)?.contents || [];
-                            <TableCell align="right">{storage.capacity.toFixed(1)} m³</TableCell>
+                        
-                            <TableCell align="right">{storage.used.toFixed(1)} m³</TableCell>
+                        return (
-                            <TableCell align="right" sx={{ color }}>{fillRate.toFixed(1)}%</TableCell>
+                          <React.Fragment key={`storage-${character.character.characterId}-${planet.planet_id}-${storage.type}-${idx}`}>
-                            <TableCell align="right">
-                              {storage.value > 0 ? (
-                                storage.value >= 1000000000 
-                                  ? `${(storage.value / 1000000000).toFixed(2)} B` 
-                                  : `${(storage.value / 1000000).toFixed(0)} M`
-                              ) : '-'} ISK
-                            </TableCell>
-                          </TableRow>
-                          {contents.length > 0 && (
                             <TableRow>
-                              <TableCell colSpan={5} sx={{ pt: 0, pb: 0 }}>
+                              <TableCell>{storage.isLaunchpad ? 'Launchpad' : 'Storage'}</TableCell>
-                                <Table size="small">
+                              <TableCell align="right">{storage.capacity.toFixed(1)} m³</TableCell>
-                                  <TableBody>
+                              <TableCell align="right">{storage.used.toFixed(1)} m³</TableCell>
-                                    {contents.map((content, idy) => (
+                              <TableCell align="right" sx={{ color }}>{fillRate.toFixed(1)}%</TableCell>
-                                      <TableRow key={`content-${character.character.characterId}-${planet.planet_id}-${storage.type}-${content.type_id}-${idx}-${idy}`}>
+                              <TableCell align="right">
-                                        <TableCell sx={{ pl: 2 }}>
+                                {storage.value > 0 ? (
-                                          {PI_TYPES_MAP[content.type_id]?.name}
+                                  storage.value >= 1000000000 
-                                        </TableCell>
+                                    ? `${(storage.value / 1000000000).toFixed(2)} B` 
-                                        <TableCell align="right" colSpan={4}>
+                                    : `${(storage.value / 1000000).toFixed(0)} M`
-                                          {content.amount.toFixed(1)} units
+                                ) : '-'} ISK
-                                        </TableCell>
-                                      </TableRow>
-                                    ))}
-                                  </TableBody>
-                                </Table>
                               </TableCell>
                             </TableRow>
-                          )}
+                            {contents.length > 0 && (
-                        </React.Fragment>
+                              <TableRow>
-                      );
+                                <TableCell colSpan={5} sx={{ pt: 0, pb: 0 }}>
-                    })}
+                                  <Table size="small">
+                                    <TableBody>
+                                      {contents.map((content, idy) => (
+                                        <TableRow key={`content-${character.character.characterId}-${planet.planet_id}-${storage.type}-${content.type_id}-${idx}-${idy}`}>
+                                          <TableCell sx={{ pl: 2 }}>
+                                            {PI_TYPES_MAP[content.type_id]?.name}
+                                          </TableCell>
+                                          <TableCell align="right" colSpan={4}>
+                                            {content.amount.toFixed(1)} units
+                                          </TableCell>
+                                        </TableRow>
+                                      ))}
+                                    </TableBody>
+                                  </Table>
+                                </TableCell>
+                              </TableRow>
+                            )}
+                          </React.Fragment>
+                        );
+                      })}
                   </TableBody>
                 </Table>
               </Box>
@@ -482,27 +486,32 @@ export const PlanetTableRow = ({
           >
             <div style={{ display: "flex", flexDirection: "column" }}>
               {planetDetails.storageInfo.length === 0 &&<Typography fontSize={theme.custom.smallText}>No storage</Typography>}
-              {planetDetails.storageInfo.map((storage: StorageInfo, idx: number) => {
+              {planetDetails.storageInfo
-                const isLaunchpad = LAUNCHPAD_IDS.includes(storage.type_id);
+                .map(storage => ({
-                const fillRate = storage.fillRate;
+                  ...storage,
-                const color = fillRate > 90 ? '#ff0000' : fillRate > 80 ? '#ffa500' : fillRate > 60 ? '#ffd700' : 'inherit';
+                  isLaunchpad: LAUNCHPAD_IDS.includes(storage.type_id)
-                
+                }))
-                return (
+                .sort((a, b) => (b.isLaunchpad ? 1 : 0) - (a.isLaunchpad ? 1 : 0))
-                  <div key={`storage-${character.character.characterId}-${planet.planet_id}-${storage.type}-${idx}`} style={{ display: "flex", alignItems: "center" }}>
+                .map((storage, idx) => {
-                    <Typography fontSize={theme.custom.smallText} style={{ marginRight: "5px" }}>
+                  const fillRate = storage.fillRate;
-                      {isLaunchpad ? 'L' : 'S'}
+                  const color = fillRate > 90 ? '#ff0000' : fillRate > 80 ? '#ffa500' : fillRate > 60 ? '#ffd700' : 'inherit';
-                    </Typography>
+                  
-                    <Typography fontSize={theme.custom.smallText} style={{ color }}>
+                  return (
-                      {fillRate.toFixed(1)}%
+                    <div key={`storage-${character.character.characterId}-${planet.planet_id}-${storage.type}-${idx}`} style={{ display: "flex", alignItems: "center" }}>
-                    </Typography>
+                      <Typography fontSize={theme.custom.smallText} style={{ marginRight: "5px" }}>
-                    {storage.value > 0 && (
+                        {storage.isLaunchpad ? 'L' : 'S'}
-                      <Typography fontSize={theme.custom.smallText} style={{ marginLeft: "5px" }}>
-                        ({Math.round(storage.value / 1000000)}M)
                       </Typography>
-                    )}
+                      <Typography fontSize={theme.custom.smallText} style={{ color }}>
-                  </div>
+                        {fillRate.toFixed(1)}%
-                );
+                      </Typography>
-              })}
+                      {storage.value > 0 && (
+                        <Typography fontSize={theme.custom.smallText} style={{ marginLeft: "5px" }}>
+                          ({Math.round(storage.value / 1000000)}M)
+                        </Typography>
+                      )}
+                    </div>
+                  );
+                })}
             </div>
           </Tooltip>
         </TableCell>