copyedits (#232)

* fix case

* fix typos

* fix css class names

---------

Co-authored-by: Carl Downing <carl@undivided.io>

ui/src/components/ActionBar.tsx

@@ -151,7 +151,7 @@ export default function Actionbar({
                 <Button
                   size="XS"
                   theme="light"
-                  text="Wake on Lan"
+                  text="Wake on LAN"
                   onClick={() => {
                     setDisableFocusTrap(true);
                   }}

ui/src/components/Header.tsx

@@ -42,7 +42,7 @@ export default function DashboardNavbar({
     if (!res.ok) return;
 
     setUser(null);
-    // The root route will redirect to appropiate login page, be it the local one or the cloud one
+    // The root route will redirect to appropriate login page, be it the local one or the cloud one
     navigate("/");
   }, [navigate, setUser]);
 

ui/src/components/KvmCard.tsx

@@ -12,7 +12,7 @@ function getRelativeTimeString(date: Date | number, lang = navigator.language):
   // Get the amount of seconds between the given date and now
   const deltaSeconds = Math.round((timeMs - Date.now()) / 1000);
 
-  // Array reprsenting one minute, hour, day, week, month, etc in seconds
+  // Array representing one minute, hour, day, week, month, etc in seconds
   const cutoffs = [60, 3600, 86400, 86400 * 7, 86400 * 30, 86400 * 365, Infinity];
 
   // Array equivalent to the above but in the string representation of the units
@@ -52,7 +52,7 @@ export default function KvmCard({
   return (
     <Card>
       <div className="px-5 py-5 space-y-3">
-        <div className="flex justify-between items-cente">
+        <div className="flex justify-between items-center">
           <div className="space-y-1.5">
             <div className="text-lg font-bold leading-none text-black dark:text-white">
               {title}

ui/src/components/USBStateStatus.tsx

@@ -68,7 +68,7 @@ export default function USBStateStatus({
   };
   const props = StatusCardProps[state];
   if (!props) {
-    console.log("Unsupport USB state: ", state);
+    console.log("Unsupported USB state: ", state);
     return;
   }
 

ui/src/providers/FeatureFlagProvider.tsx

@@ -22,7 +22,7 @@ export const FeatureFlagProvider = ({
 }) => {
   const isFeatureEnabled = (minAppVersion: string) => {
     // If no version is set, feature is disabled.
-    // The feature flag component can deside what to display as a fallback - either omit the component or like a "please upgrade to enable".
+    // The feature flag component can decide what to display as a fallback - either omit the component or like a "please upgrade to enable".
     if (!appVersion) return false;
 
     // Extract the base versions without prerelease identifier

ui/src/routes/devices.$id.mount.tsx

@@ -121,7 +121,7 @@ export function Dialog({ onClose }: { onClose: () => void }) {
           triggerError(err instanceof Error ? err.message : String(err));
         })
         .finally(() => {
-          // We do this beacues the mounting is too fast and the UI gets choppy
+          // We do this because the mounting is too fast and the UI gets choppy
           // and the modal exit animation for like 500ms
           setTimeout(() => {
             setMountInProgress(false);
@@ -283,7 +283,7 @@ function ModeSelectionView({
 
   return (
     <div className="w-full space-y-4">
-      <div className="asnimate-fadeIn space-y-0">
+      <div className="animate-fadeIn space-y-0">
         <h2 className="text-lg font-bold leading-tight dark:text-white">
           Virtual Media Source
         </h2>