From 0e780afbce9c62706eb0d8428093746c82eeac73 Mon Sep 17 00:00:00 2001
From: Oliver <oliver@mohlin.dev>
Date: Tue, 17 Dec 2024 22:47:55 +0100
Subject: [PATCH 1/2] Move transient props to types folder

---
 .../mullvad-vpn/src/renderer/components/ImageView.tsx    | 2 +-
 .../src/renderer/lib/components/typography/Text.tsx      | 2 +-
 .../packages/mullvad-vpn/src/renderer/lib/types/index.ts | 1 +
 .../src/renderer/lib/types/transient-props.ts            | 9 +++++++++
 4 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 desktop/packages/mullvad-vpn/src/renderer/lib/types/index.ts
 create mode 100644 desktop/packages/mullvad-vpn/src/renderer/lib/types/transient-props.ts

diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/ImageView.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/ImageView.tsx
index f40a93fbbcfa..20ec42236d2b 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/ImageView.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/ImageView.tsx
@@ -1,7 +1,7 @@
 import React, { useMemo } from 'react';
 import styled from 'styled-components';
 
-import { NonTransientProps } from '../lib/styles';
+import { NonTransientProps } from '../lib/types';
 
 export interface IImageViewProps
   extends NonTransientProps<IImageMaskProps, 'tintColor' | 'tintHoverColor'> {
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/typography/Text.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/typography/Text.tsx
index a590fbe11963..93834cb4a8da 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/typography/Text.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/typography/Text.tsx
@@ -2,7 +2,7 @@ import { forwardRef } from 'react';
 import styled from 'styled-components';
 
 import { Colors, Typography, typography, TypographyProperties } from '../../foundations';
-import { TransientProps } from '../../styles';
+import { TransientProps } from '../../types';
 
 export type TextProps = React.PropsWithChildren<{
   variant?: Typography;
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/types/index.ts b/desktop/packages/mullvad-vpn/src/renderer/lib/types/index.ts
new file mode 100644
index 000000000000..dd810c806169
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/types/index.ts
@@ -0,0 +1 @@
+export * from './transient-props';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/types/transient-props.ts b/desktop/packages/mullvad-vpn/src/renderer/lib/types/transient-props.ts
new file mode 100644
index 000000000000..ea527ab79105
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/types/transient-props.ts
@@ -0,0 +1,9 @@
+type NonTransientPropKey<K> = K extends `$${infer L}` ? L : K;
+
+export type NonTransientProps<T, K extends NonTransientPropKey<keyof T>> = {
+  [P in keyof T as NonTransientPropKey<P> extends K ? NonTransientPropKey<P> : P]: T[P];
+};
+
+export type TransientProps<T, K extends keyof T = keyof T> = {
+  [P in keyof T as P extends K ? `$${P & string}` : P]: T[P];
+};

From cebf31cf1f94c267cab8760b83db4265eea3baa2 Mon Sep 17 00:00:00 2001
From: Oliver <oliver@mohlin.dev>
Date: Tue, 17 Dec 2024 22:51:42 +0100
Subject: [PATCH 2/2] Move button reset to style folder

---
 .../src/renderer/lib/components/layout/Theme.tsx         | 7 -------
 .../src/renderer/lib/components/molecules/Button.tsx     | 2 +-
 .../src/renderer/lib/components/molecules/IconButton.tsx | 2 +-
 .../src/renderer/lib/components/typography/Link.tsx      | 2 +-
 desktop/packages/mullvad-vpn/src/renderer/lib/styles.ts  | 9 ---------
 .../mullvad-vpn/src/renderer/lib/styles/index.ts         | 1 +
 .../lib/{components => styles}/mixins/button-reset.ts    | 0
 .../renderer/lib/{components => styles}/mixins/index.ts  | 0
 8 files changed, 4 insertions(+), 19 deletions(-)
 delete mode 100644 desktop/packages/mullvad-vpn/src/renderer/lib/styles.ts
 create mode 100644 desktop/packages/mullvad-vpn/src/renderer/lib/styles/index.ts
 rename desktop/packages/mullvad-vpn/src/renderer/lib/{components => styles}/mixins/button-reset.ts (100%)
 rename desktop/packages/mullvad-vpn/src/renderer/lib/{components => styles}/mixins/index.ts (100%)

diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/layout/Theme.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/layout/Theme.tsx
index 5d0e86f30e11..63c762c4c1b6 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/layout/Theme.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/layout/Theme.tsx
@@ -13,12 +13,6 @@ import {
 
 type VariablesProps = React.PropsWithChildren<object>;
 
-const Reset = createGlobalStyle`
-  button {
-    all: unset;
-  }
-`;
-
 const VariablesGlobalStyle = createGlobalStyle`
   :root {
     ${Object.entries({
@@ -36,7 +30,6 @@ const VariablesGlobalStyle = createGlobalStyle`
 export const Theme = ({ children }: VariablesProps) => {
   return (
     <>
-      <Reset />
       <VariablesGlobalStyle />
       {children}
     </>
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/molecules/Button.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/molecules/Button.tsx
index bc1979dcf680..0721fbf54aa6 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/molecules/Button.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/molecules/Button.tsx
@@ -2,8 +2,8 @@ import React, { forwardRef } from 'react';
 import styled from 'styled-components';
 
 import { Colors, Radius, Spacings } from '../../foundations';
+import { buttonReset } from '../../styles';
 import { Flex } from '../layout';
-import { buttonReset } from '../mixins';
 import { BodySmallSemiBold } from '../typography';
 
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/molecules/IconButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/molecules/IconButton.tsx
index 1e59dd67902e..d6f1dcc242f2 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/molecules/IconButton.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/molecules/IconButton.tsx
@@ -3,7 +3,7 @@ import styled from 'styled-components';
 
 import ImageView from '../../../components/ImageView';
 import { Colors } from '../../foundations';
-import { buttonReset } from '../mixins';
+import { buttonReset } from '../../styles';
 
 export interface IconButtonProps
   extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/typography/Link.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/typography/Link.tsx
index 32d18b48618f..e3c8673a544c 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/typography/Link.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/typography/Link.tsx
@@ -4,7 +4,7 @@ import styled from 'styled-components';
 import { Colors, Radius } from '../../foundations';
 import { useHistory } from '../../history';
 import { RoutePath } from '../../routes';
-import { buttonReset } from '../mixins';
+import { buttonReset } from '../../styles';
 import { Text, TextProps } from './Text';
 
 export interface LinkProps extends TextProps, Omit<React.HtmlHTMLAttributes<'button'>, 'color'> {
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/styles.ts b/desktop/packages/mullvad-vpn/src/renderer/lib/styles.ts
deleted file mode 100644
index ea527ab79105..000000000000
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/styles.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-type NonTransientPropKey<K> = K extends `$${infer L}` ? L : K;
-
-export type NonTransientProps<T, K extends NonTransientPropKey<keyof T>> = {
-  [P in keyof T as NonTransientPropKey<P> extends K ? NonTransientPropKey<P> : P]: T[P];
-};
-
-export type TransientProps<T, K extends keyof T = keyof T> = {
-  [P in keyof T as P extends K ? `$${P & string}` : P]: T[P];
-};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/styles/index.ts b/desktop/packages/mullvad-vpn/src/renderer/lib/styles/index.ts
new file mode 100644
index 000000000000..2b3d8cffd689
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/styles/index.ts
@@ -0,0 +1 @@
+export * from './mixins';
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/mixins/button-reset.ts b/desktop/packages/mullvad-vpn/src/renderer/lib/styles/mixins/button-reset.ts
similarity index 100%
rename from desktop/packages/mullvad-vpn/src/renderer/lib/components/mixins/button-reset.ts
rename to desktop/packages/mullvad-vpn/src/renderer/lib/styles/mixins/button-reset.ts
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/mixins/index.ts b/desktop/packages/mullvad-vpn/src/renderer/lib/styles/mixins/index.ts
similarity index 100%
rename from desktop/packages/mullvad-vpn/src/renderer/lib/components/mixins/index.ts
rename to desktop/packages/mullvad-vpn/src/renderer/lib/styles/mixins/index.ts