Added filter for pre releases

src/hooks/useLocalStorage.ts

@@ -0,0 +1,21 @@
+import { useState, useEffect } from "react";
+
+function getStorageValue(key, defaultValue) {
+    // getting stored value
+    const saved = localStorage.getItem(key);
+    const initial = JSON.parse(saved ?? defaultValue);
+    return initial || defaultValue;
+}
+
+export const useLocalStorage = (key, defaultValue) => {
+    const [value, setValue] = useState(() => {
+        return getStorageValue(key, defaultValue);
+    });
+
+    useEffect(() => {
+        // storing input name
+        localStorage.setItem(key, JSON.stringify(value));
+    }, [key, value]);
+
+    return [value, setValue];
+};

src/panels/firmware/Firmware.tsx

@@ -12,6 +12,8 @@ import Choice from "../../components/choice";
 import { Markdown } from "../../components/markdown/Markdown";
 import PageTitle from "../../components/pagetitle/PageTitle";
 import FirmwareBreadCrumbList from "./FirmwareBreadcrumbList";
+import { FormCheck } from "react-bootstrap";
+import { useLocalStorage } from "../../hooks/useLocalStorage";
 
 type Props = {
     onInstall: (
@@ -31,6 +33,10 @@ const Firmware = ({ onInstall }: Props) => {
     const [releaseManifest, setReleaseManifest] = useState<
         GithubReleaseManifest | undefined
     >();
+    const [showPrerelease, setShowPrerelease] = useLocalStorage(
+        "showPrerelease",
+        false
+    );
 
     const choice = useMemo(
         () => selectedChoices[selectedChoices.length - 1],
@@ -55,7 +61,7 @@ const Firmware = ({ onInstall }: Props) => {
     };
 
     const fetchReleases = () => {
-        GithubService.getReleases()
+        GithubService.getReleases(showPrerelease)
             .then((releases) => {
                 setReleases(releases);
             })
@@ -80,7 +86,7 @@ const Firmware = ({ onInstall }: Props) => {
         }
     }, [releases]);
 
-    useEffect(() => fetchReleases(), []);
+    useEffect(() => fetchReleases(), [showPrerelease]);
 
     return (
         <div className="firmware-component">
@@ -94,6 +100,7 @@ const Firmware = ({ onInstall }: Props) => {
                         Select which firmware you want to install on your
                         controller.
                     </p>
+
                     <select
                         className="form-select form-select-lg mb-3"
                         onChange={(event) => chooseFirmware(event.target.value)}
@@ -105,6 +112,12 @@ const Firmware = ({ onInstall }: Props) => {
                             </option>
                         ))}
                     </select>
+                    <FormCheck
+                        type="switch"
+                        label="Show pre-releases"
+                        checked={showPrerelease}
+                        onChange={() => setShowPrerelease((value) => !value)}
+                    />
                 </>
             )}
 

src/services/GitHubService.ts

@@ -57,26 +57,30 @@ export const GithubService = {
      *
      * @returns a promise with all available github releases
      */
-    getReleases: (): Promise<GithubRelease[]> => {
+    getReleases: (
+        includePrerelease: boolean = false
+    ): Promise<GithubRelease[]> => {
         return fetch("https://api.github.com/repos/bdring/FluidNC/releases")
             .then((res) => res.json())
             .then((releases) => {
-                return (
-                    releases
-                        //.filter((release) => !release.draft && !release.prerelease)
-                        .filter(
-                            (release) =>
-                                new Date(release.created_at) >
-                                new Date("2023-06-08T21:23:04Z")
+                return releases
+                    .filter(
+                        (release) =>
+                            includePrerelease ||
+                            (!release.draft && !release.prerelease)
+                    )
+                    .filter(
+                        (release) =>
+                            new Date(release.created_at) >
+                            new Date("2023-06-08T21:23:04Z")
+                    )
+                    .filter((release) =>
+                        release.assets.filter(
+                            (asset) =>
+                                asset.name.endsWith("-posix.zip").length > 0
                         )
-                        .filter((release) =>
-                            release.assets.filter(
-                                (asset) =>
-                                    asset.name.endsWith("-posix.zip").length > 0
-                            )
-                        )
-                        .sort((release1, release2) => release1.id > release2.id)
-                );
+                    )
+                    .sort((release1, release2) => release2?.id - release1?.id);
             });
     },