refactor: style cleanups and migrations

fix: close modal with button
refactor: small type improvements
refactor: migrate time inputs
refactor: migrate tooltips
refactor: prevent component resizing

apps/client/src/features/app-settings/panel/feature-panel/FeaturePanel.tsx

@@ -23,13 +23,13 @@ export default function FeaturePanel({ location }: PanelBaseProps) {
         <Panel.Section>
           <Panel.Card>
             <Panel.SubHeader>Share Ontime Link</Panel.SubHeader>
-            <Panel.Divider />
             {!isOntimeCloud && (
               <>
                 <Panel.Paragraph>Ontime is streaming on the following network interfaces</Panel.Paragraph>
                 <InfoNif />
               </>
             )}
+            <Panel.Divider />
             <GenerateLinkFormExport />
           </Panel.Card>
         </Panel.Section>

apps/client/src/features/app-settings/panel/feature-panel/GenerateLinkForm.tsx

@@ -73,18 +73,12 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, isLockedToV
   };
 
   return (
-    <Panel.Section as='form' onSubmit={handleSubmit(onSubmit)} onKeyDown={(event) => preventEscape(event)}>
+    <form onSubmit={handleSubmit(onSubmit)} onKeyDown={(event) => preventEscape(event)}>
       {errors.root && <Panel.Error>{errors.root.message}</Panel.Error>}
       {!isLockedToView ? (
-        <Info>
-          <Panel.Paragraph>
-            You can generate a link to share with your team or to use in automation (such as companion).
-          </Panel.Paragraph>
-        </Info>
+        <Info>You can generate a link to share with your team or to use in automation (such as companion).</Info>
       ) : (
-        <Info>
-          <Panel.Paragraph>You can generate a link to share with your team</Panel.Paragraph>
-        </Info>
+        <Info>You can generate a link to share with your team</Info>
       )}
       <Panel.ListGroup>
         <Panel.ListItem>
@@ -136,6 +130,6 @@ export default function GenerateLinkForm({ hostOptions, pathOptions, isLockedToV
           </div>
         </Panel.ListItem>
       </Panel.ListGroup>
-    </Panel.Section>
+    </form>
   );
 }

apps/client/src/features/app-settings/panel/feature-panel/UrlPresetsForm.tsx

@@ -8,10 +8,10 @@ import { postUrlPresets } from '../../../../common/api/urlPresets';
 import { maybeAxiosError } from '../../../../common/api/utils';
 import Button from '../../../../common/components/buttons/Button';
 import IconButton from '../../../../common/components/buttons/IconButton';
-import TooltipActionBtn from '../../../../common/components/buttons/TooltipActionBtn';
 import Info from '../../../../common/components/info/Info';
 import Input from '../../../../common/components/input/input/Input';
 import ExternalLink from '../../../../common/components/link/external-link/ExternalLink';
+import Tooltip from '../../../../common/components/tooltip/Tooltip';
 import useUrlPresets from '../../../../common/hooks-query/useUrlPresets';
 import { preventEscape } from '../../../../common/utils/keyEvent';
 import { handleLinks } from '../../../../common/utils/linkUtils';
@@ -194,17 +194,15 @@ export default function UrlPresetsForm() {
                       <Panel.Error>{maybeUrlError}</Panel.Error>
                     </td>
                     <Panel.InlineElements relation='inner' as='td'>
-                      <TooltipActionBtn
-                        size='sm'
-                        isDisabled={!canTest}
-                        clickHandler={(event) => handleLinks(preset.alias, event)}
-                        tooltip='Test preset'
-                        aria-label='Test preset'
-                        variant='ontime-ghosted'
-                        color='#e2e2e2' // $gray-200
-                        icon={<IoOpenOutline />}
+                      <Tooltip
+                        text='Test preset'
+                        render={<IconButton variant='ghosted-white' />}
                         data-testid={`field__test_${index}`}
-                      />
+                        onClick={(event) => handleLinks(preset.alias, event)}
+                        disabled={!canTest}
+                      >
+                        <IoOpenOutline />
+                      </Tooltip>
                       <IconButton
                         onClick={() => remove(index)}
                         variant='ghosted-destructive'