From ccae7a33e0724fd1271ea1506f0844997b1f648b Mon Sep 17 00:00:00 2001 From: Dilson's Pickles Date: Tue, 8 Oct 2024 09:40:58 +1100 Subject: [PATCH 1/4] Install @types/platform --- package-lock.json | 7 +++++++ package.json | 1 + 2 files changed, 8 insertions(+) diff --git a/package-lock.json b/package-lock.json index 4d8da6f..b3f2651 100644 --- a/package-lock.json +++ b/package-lock.json @@ -27,6 +27,7 @@ }, "devDependencies": { "@tailwindcss/typography": "^0.5.10", + "@types/platform": "^1.3.6", "postcss-nesting": "^12.0.2" } }, @@ -1137,6 +1138,12 @@ "resolved": "https://registry.npmjs.org/@types/parse5/-/parse5-6.0.3.tgz", "integrity": "sha512-SuT16Q1K51EAVPz1K29DJ/sXjhSQ0zjvsypYJ6tlwVsRV9jwW5Adq2ch8Dq8kDBCkYnELS7N7VNCSB5nC56t/g==" }, + "node_modules/@types/platform": { + "version": "1.3.6", + "resolved": "https://registry.npmjs.org/@types/platform/-/platform-1.3.6.tgz", + "integrity": "sha512-ZmSaqHuvzv+jC232cFoz2QqPUkaj6EvMmCrWcx3WRr7xTPVFCMUOTcOq8m2d+Zw1iKRc1kDiaA+jtNrV0hkVew==", + "dev": true + }, "node_modules/@types/prop-types": { "version": "15.7.5", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", diff --git a/package.json b/package.json index d556f7a..245d54c 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ }, "devDependencies": { "@tailwindcss/typography": "^0.5.10", + "@types/platform": "^1.3.6", "postcss-nesting": "^12.0.2" } } From 76d0bb353d6c15158b2e16cdce0e4553e700ed97 Mon Sep 17 00:00:00 2001 From: Dilson's Pickles Date: Tue, 8 Oct 2024 09:41:53 +1100 Subject: [PATCH 2/4] Create useDetectOS hook --- src/components/banner/PromoBanner.tsx | 81 +++++++++++++-------------- src/hooks/useDetectOS.ts | 17 ++++++ src/layouts/BaseLayout.astro | 2 + 3 files changed, 58 insertions(+), 42 deletions(-) create mode 100644 src/hooks/useDetectOS.ts diff --git a/src/components/banner/PromoBanner.tsx b/src/components/banner/PromoBanner.tsx index 3f7b498..84e3a8b 100644 --- a/src/components/banner/PromoBanner.tsx +++ b/src/components/banner/PromoBanner.tsx @@ -1,27 +1,21 @@ -import React, { useState, useEffect } from "react"; -import { museHubReleases, audacityReleases } from "../../assets/js/releaseData"; +import { museHubReleases } from "../../assets/js/releaseData"; import "../../styles/icons.css"; -import DownloadMuseHubButton from "../button/DownloadMuseHubButton"; -import platform from "platform"; -declare interface Props { - url: string; -} +import useBrowserOS from "../../hooks/useDetectOS"; -function PromoBanner({ url }: Props) { - //no promo running - //return null; - const [showBanner, setShowBanner] = useState(true); +function PromoBanner() { + const browserOS = useBrowserOS(); - function getHref() { - switch(platform.os.family){ - case "OS X": - return museHubReleases.mac[0].browser_download_url; - case "Windows": - return museHubReleases.win[0].browser_download_url; - default: - setShowBanner(false); return "#"; + const getHref = () => { + if (browserOS === "OS X") { + return museHubReleases.mac[0].browser_download_url; + } else if (browserOS === "Windows") { + return museHubReleases.win[0].browser_download_url; } - } + return "#"; // Default if OS is not supported + }; + + // Only show the banner for supported OSes + const showBanner = browserOS === "OS X" || browserOS === "Windows"; function handleButtonClick() { if (typeof _paq !== "undefined") { @@ -34,29 +28,32 @@ function PromoBanner({ url }: Props) { } } - return ( <> { showBanner && -
-
-

🔥Limited-Time Offer: 80% OFF

-

- Polyspectral MBC Multiband Compressor! Now $9.99🔥 -

-
- - + {showBanner && ( + - } +
+

🔥Limited-Time Offer: 80% OFF

+

+ Polyspectral MBC Multiband Compressor! Now $9.99🔥 +

+
+ + + Get it on the Muse Hub + +
+ )} + ); } -export default PromoBanner; +export default PromoBanner; \ No newline at end of file diff --git a/src/hooks/useDetectOS.ts b/src/hooks/useDetectOS.ts new file mode 100644 index 0000000..3c6565c --- /dev/null +++ b/src/hooks/useDetectOS.ts @@ -0,0 +1,17 @@ +import { useState, useEffect } from 'react'; +import platform from 'platform'; + +const useBrowserOS = () => { + // Define the state with an explicit string type or null + const [browserOS, setBrowserOS] = useState(null); + + useEffect(() => { + // Set the OS using the platform library, ensuring it's a string + const detectedOS = platform.os?.family ?? 'Unknown OS'; + setBrowserOS(detectedOS); + }, []); + + return browserOS; +}; + +export default useBrowserOS; \ No newline at end of file diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index bbc0270..30f0c99 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -6,6 +6,7 @@ import "../styles/input.css"; import BetaBanner from "../components/banner/BetaBanner"; import SurveyBanner from "../components/banner/SurveyBanner"; import PromoBanner from "../components/banner/PromoBanner"; +import useBrowserOS from "../hooks/useDetectOS"; export interface Props { title: string; @@ -15,6 +16,7 @@ const { title = "Audacity | Free Audio editor, recorder, music making and more!", description = "Audacity is the world's most popular audio editing and recording app. Edit, mix, and enhance your audio tracks with the power of Audacity. Download now!", } = Astro.props; + --- From 7543cb3091fbd8afd1c34ec9ef22510351eb94be Mon Sep 17 00:00:00 2001 From: Dilson's Pickles Date: Tue, 8 Oct 2024 09:43:52 +1100 Subject: [PATCH 3/4] Remove unused import --- src/pages/index.astro | 1 - 1 file changed, 1 deletion(-) diff --git a/src/pages/index.astro b/src/pages/index.astro index 1ea136e..39f9fbc 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -1,6 +1,5 @@ --- import BlogPosts from "../components/homepage/BlogPosts.astro"; -import DownloadBanner from "../components/homepage/DownloadBanner.astro"; import HeroBanner from "../components/homepage/HeroBanner.astro"; import ReleaseVideo from "../components/homepage/ReleaseVideo"; import BaseLayout from "../layouts/BaseLayout.astro"; From 7e740d00f6d0c1084bc19af9f297f8657f185e02 Mon Sep 17 00:00:00 2001 From: Dilson's Pickles Date: Tue, 8 Oct 2024 09:44:32 +1100 Subject: [PATCH 4/4] Remove unused prop --- src/layouts/BaseLayout.astro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index 30f0c99..342895d 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -47,7 +47,7 @@ const { - +