refactor: migrate to common eslint+prettier configs (#4168)

* refactor: migrate to common eslint+prettier configs * fix: prettier frontend * feat: config changes * fix: lint issues * fix: lint * fix: type imports * fix: cyclical import issue * fix: lockfile * fix: missing dep * fix: switch to tabs * fix: continue switch to tabs * fix: rustfmt parity * fix: moderation lint issue * fix: lint issues * fix: ui intl * fix: lint issues * Revert "fix: rustfmt parity" This reverts commit cb99d2376c321d813d4b7fc7e2a213bb30a54711. * feat: revert last rs
2025-08-14 21:48:38 +01:00
parent 82697278dc
commit 2aabcf36ee
702 changed files with 101360 additions and 102020 deletions
--- a/packages/ui/src/components/modal/ShareModal.vue
+++ b/packages/ui/src/components/modal/ShareModal.vue
@@ -1,49 +1,50 @@
 <script setup>
 import {
-  ClipboardCopyIcon,
-  LinkIcon,
-  ShareIcon,
-  MailIcon,
-  GlobeIcon,
-  TwitterIcon,
-  MastodonIcon,
-  RedditIcon,
+	ClipboardCopyIcon,
+	GlobeIcon,
+	LinkIcon,
+	MailIcon,
+	MastodonIcon,
+	RedditIcon,
+	ShareIcon,
+	TwitterIcon,
 } from '@modrinth/assets'
-import { computed, ref, nextTick } from 'vue'
 import QrcodeVue from 'qrcode.vue'
+import { computed, nextTick, ref } from 'vue'
+
 import { Button, Modal } from '../index'

 const props = defineProps({
-  header: {
-    type: String,
-    default: 'Share',
-  },
-  shareTitle: {
-    type: String,
-    default: 'Modrinth',
-  },
-  shareText: {
-    type: String,
-    default: null,
-  },
-  link: {
-    type: Boolean,
-    default: false,
-  },
-  openInNewTab: {
-    type: Boolean,
-    default: true,
-  },
-  noblur: {
-    type: Boolean,
-    default: false,
-  },
-  onHide: {
-    type: Function,
-    default() {
-      return () => {}
-    },
-  },
+	header: {
+		type: String,
+		default: 'Share',
+	},
+	shareTitle: {
+		type: String,
+		default: 'Modrinth',
+	},
+	shareText: {
+		type: String,
+		default: null,
+	},
+	link: {
+		type: Boolean,
+		default: false,
+	},
+	openInNewTab: {
+		type: Boolean,
+		default: true,
+	},
+	noblur: {
+		type: Boolean,
+		default: false,
+	},
+	onHide: {
+		type: Function,
+		default() {
+			return () => {}
+		},
+	},
 })

 const shareModal = ref(null)
@@ -54,52 +55,52 @@ const content = ref(null)
 const url = ref(null)
 const canShare = ref(false)
 const share = () => {
-  navigator.share(
-    props.link
-      ? {
-          title: props.shareTitle.toString(),
-          text: props.shareText,
-          url: url.value,
-        }
-      : {
-          title: props.shareTitle.toString(),
-          text: content.value,
-        },
-  )
+	navigator.share(
+		props.link
+			? {
+					title: props.shareTitle.toString(),
+					text: props.shareText,
+					url: url.value,
+				}
+			: {
+					title: props.shareTitle.toString(),
+					text: content.value,
+				},
+	)
 }

 const show = async (passedContent) => {
-  content.value = props.shareText ? `${props.shareText}\n\n${passedContent}` : passedContent
-  shareModal.value.show()
-  if (props.link) {
-    url.value = passedContent
-    nextTick(() => {
-      console.log(qrCode.value)
-      fetch(qrCode.value.getElementsByTagName('canvas')[0].toDataURL('image/png'))
-        .then((res) => res.blob())
-        .then((blob) => {
-          console.log(blob)
-          qrImage.value = blob
-        })
-    })
-  }
-  if (navigator.canShare({ title: props.shareTitle.toString(), text: content.value })) {
-    canShare.value = true
-  }
+	content.value = props.shareText ? `${props.shareText}\n\n${passedContent}` : passedContent
+	shareModal.value.show()
+	if (props.link) {
+		url.value = passedContent
+		nextTick(() => {
+			console.log(qrCode.value)
+			fetch(qrCode.value.getElementsByTagName('canvas')[0].toDataURL('image/png'))
+				.then((res) => res.blob())
+				.then((blob) => {
+					console.log(blob)
+					qrImage.value = blob
+				})
+		})
+	}
+	if (navigator.canShare({ title: props.shareTitle.toString(), text: content.value })) {
+		canShare.value = true
+	}
 }

 const copyImage = async () => {
-  const item = new ClipboardItem({ 'image/png': qrImage.value })
-  await navigator.clipboard.write([item])
+	const item = new ClipboardItem({ 'image/png': qrImage.value })
+	await navigator.clipboard.write([item])
 }

 const copyText = async () => {
-  await navigator.clipboard.writeText(url.value ?? content.value)
+	await navigator.clipboard.writeText(url.value ?? content.value)
 }

 const sendEmail = computed(
-  () =>
-    `mailto:user@test.com
+	() =>
+		`mailto:user@test.com
    ?subject=${encodeURIComponent(props.shareTitle)}
    &body=${encodeURIComponent(content.value)}`,
 )
@@ -107,206 +108,206 @@ const sendEmail = computed(
 const targetParameter = computed(() => (props.openInNewTab ? '_blank' : '_self'))

 const sendTweet = computed(
-  () => `https://twitter.com/intent/tweet?text=${encodeURIComponent(content.value)}`,
+	() => `https://twitter.com/intent/tweet?text=${encodeURIComponent(content.value)}`,
 )

 const sendToot = computed(() => `https://tootpick.org/#text=${encodeURIComponent(content.value)}`)

 const postOnReddit = computed(
-  () =>
-    `https://www.reddit.com/submit?title=${encodeURIComponent(props.shareTitle)}&text=${encodeURIComponent(
-      content.value,
-    )}`,
+	() =>
+		`https://www.reddit.com/submit?title=${encodeURIComponent(props.shareTitle)}&text=${encodeURIComponent(
+			content.value,
+		)}`,
 )

 defineExpose({
-  show,
+	show,
 })
 </script>

 <template>
-  <Modal ref="shareModal" :header="header" :noblur="noblur" :on-hide="onHide">
-    <div class="share-body">
-      <div v-if="link" class="qr-wrapper">
-        <div ref="qrCode">
-          <QrcodeVue :value="url" class="qr-code" margin="3" />
-        </div>
-        <Button
-          v-tooltip="'Copy QR code'"
-          icon-only
-          class="copy-button"
-          aria-label="Copy QR code"
-          @click="copyImage"
-        >
-          <ClipboardCopyIcon aria-hidden="true" />
-        </Button>
-      </div>
-      <div v-else class="resizable-textarea-wrapper">
-        <textarea v-model="content" />
-        <Button
-          v-tooltip="'Copy Text'"
-          icon-only
-          aria-label="Copy Text"
-          class="copy-button transparent"
-          @click="copyText"
-        >
-          <ClipboardCopyIcon aria-hidden="true" />
-        </Button>
-      </div>
-      <div class="all-buttons">
-        <div v-if="link" class="iconified-input">
-          <LinkIcon />
-          <input type="text" :value="url" readonly />
-          <Button v-tooltip="'Copy Text'" aria-label="Copy Text" class="r-btn" @click="copyText">
-            <ClipboardCopyIcon aria-hidden="true" />
-          </Button>
-        </div>
-        <div class="button-row">
-          <Button v-if="canShare" v-tooltip="'Share'" aria-label="Share" icon-only @click="share">
-            <ShareIcon aria-hidden="true" />
-          </Button>
-          <a
-            v-tooltip="'Send as an email'"
-            class="btn icon-only"
-            :href="sendEmail"
-            :target="targetParameter"
-            aria-label="Send as an email"
-          >
-            <MailIcon aria-hidden="true" />
-          </a>
-          <a
-            v-if="link"
-            v-tooltip="'Open link in browser'"
-            class="btn icon-only"
-            :target="targetParameter"
-            :href="url"
-            aria-label="Open link in browser"
-          >
-            <GlobeIcon aria-hidden="true" />
-          </a>
-          <a
-            v-tooltip="'Toot about it'"
-            class="btn mastodon icon-only"
-            :target="targetParameter"
-            :href="sendToot"
-            aria-label="Toot about it"
-          >
-            <MastodonIcon aria-hidden="true" />
-          </a>
-          <a
-            v-tooltip="'Tweet about it'"
-            class="btn twitter icon-only"
-            :target="targetParameter"
-            :href="sendTweet"
-            aria-label="Tweet about it"
-          >
-            <TwitterIcon aria-hidden="true" />
-          </a>
-          <a
-            v-tooltip="'Share on Reddit'"
-            class="btn reddit icon-only"
-            :target="targetParameter"
-            :href="postOnReddit"
-            aria-label="Share on Reddit"
-          >
-            <RedditIcon aria-hidden="true" />
-          </a>
-        </div>
-      </div>
-    </div>
-  </Modal>
+	<Modal ref="shareModal" :header="header" :noblur="noblur" :on-hide="onHide">
+		<div class="share-body">
+			<div v-if="link" class="qr-wrapper">
+				<div ref="qrCode">
+					<QrcodeVue :value="url" class="qr-code" margin="3" />
+				</div>
+				<Button
+					v-tooltip="'Copy QR code'"
+					icon-only
+					class="copy-button"
+					aria-label="Copy QR code"
+					@click="copyImage"
+				>
+					<ClipboardCopyIcon aria-hidden="true" />
+				</Button>
+			</div>
+			<div v-else class="resizable-textarea-wrapper">
+				<textarea v-model="content" />
+				<Button
+					v-tooltip="'Copy Text'"
+					icon-only
+					aria-label="Copy Text"
+					class="copy-button transparent"
+					@click="copyText"
+				>
+					<ClipboardCopyIcon aria-hidden="true" />
+				</Button>
+			</div>
+			<div class="all-buttons">
+				<div v-if="link" class="iconified-input">
+					<LinkIcon />
+					<input type="text" :value="url" readonly />
+					<Button v-tooltip="'Copy Text'" aria-label="Copy Text" class="r-btn" @click="copyText">
+						<ClipboardCopyIcon aria-hidden="true" />
+					</Button>
+				</div>
+				<div class="button-row">
+					<Button v-if="canShare" v-tooltip="'Share'" aria-label="Share" icon-only @click="share">
+						<ShareIcon aria-hidden="true" />
+					</Button>
+					<a
+						v-tooltip="'Send as an email'"
+						class="btn icon-only"
+						:href="sendEmail"
+						:target="targetParameter"
+						aria-label="Send as an email"
+					>
+						<MailIcon aria-hidden="true" />
+					</a>
+					<a
+						v-if="link"
+						v-tooltip="'Open link in browser'"
+						class="btn icon-only"
+						:target="targetParameter"
+						:href="url"
+						aria-label="Open link in browser"
+					>
+						<GlobeIcon aria-hidden="true" />
+					</a>
+					<a
+						v-tooltip="'Toot about it'"
+						class="btn mastodon icon-only"
+						:target="targetParameter"
+						:href="sendToot"
+						aria-label="Toot about it"
+					>
+						<MastodonIcon aria-hidden="true" />
+					</a>
+					<a
+						v-tooltip="'Tweet about it'"
+						class="btn twitter icon-only"
+						:target="targetParameter"
+						:href="sendTweet"
+						aria-label="Tweet about it"
+					>
+						<TwitterIcon aria-hidden="true" />
+					</a>
+					<a
+						v-tooltip="'Share on Reddit'"
+						class="btn reddit icon-only"
+						:target="targetParameter"
+						:href="postOnReddit"
+						aria-label="Share on Reddit"
+					>
+						<RedditIcon aria-hidden="true" />
+					</a>
+				</div>
+			</div>
+		</div>
+	</Modal>
 </template>

 <style scoped lang="scss">
 .share-body {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  flex-wrap: wrap;
-  gap: var(--gap-sm);
-  padding: var(--gap-lg);
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	flex-wrap: wrap;
+	gap: var(--gap-sm);
+	padding: var(--gap-lg);
 }

 .all-buttons {
-  display: flex;
-  flex-direction: column;
-  gap: var(--gap-sm);
-  flex-grow: 1;
-  justify-content: center;
+	display: flex;
+	flex-direction: column;
+	gap: var(--gap-sm);
+	flex-grow: 1;
+	justify-content: center;
 }

 .iconified-input {
-  width: 100%;
+	width: 100%;

-  input {
-    flex-basis: auto;
-  }
+	input {
+		flex-basis: auto;
+	}
 }

 .button-row {
-  display: flex;
-  flex-direction: row;
-  gap: var(--gap-sm);
+	display: flex;
+	flex-direction: row;
+	gap: var(--gap-sm);

-  .btn {
-    fill: var(--color-contrast);
-    color: var(--color-contrast);
+	.btn {
+		fill: var(--color-contrast);
+		color: var(--color-contrast);

-    &.reddit {
-      background-color: #ff4500;
-    }
+		&.reddit {
+			background-color: #ff4500;
+		}

-    &.mastodon {
-      background-color: #563acc;
-    }
+		&.mastodon {
+			background-color: #563acc;
+		}

-    &.twitter {
-      background-color: #1da1f2;
-    }
-  }
+		&.twitter {
+			background-color: #1da1f2;
+		}
+	}
 }

 .qr-wrapper {
-  position: relative;
-  margin: 0 auto;
+	position: relative;
+	margin: 0 auto;

-  &:hover {
-    .copy-button {
-      opacity: 1;
-    }
-  }
+	&:hover {
+		.copy-button {
+			opacity: 1;
+		}
+	}
 }

 .qr-code {
-  background-color: white !important;
-  border-radius: var(--radius-md);
+	background-color: white !important;
+	border-radius: var(--radius-md);
 }

 .copy-button {
-  position: absolute;
-  top: 0;
-  right: 0;
-  margin: var(--gap-sm);
-  transition: all 0.2s ease-in-out;
-  opacity: 0;
+	position: absolute;
+	top: 0;
+	right: 0;
+	margin: var(--gap-sm);
+	transition: all 0.2s ease-in-out;
+	opacity: 0;

-  @media (prefers-reduced-motion) {
-    transition: none !important;
-  }
+	@media (prefers-reduced-motion) {
+		transition: none !important;
+	}
 }

 .resizable-textarea-wrapper {
-  position: relative;
-  height: 100%;
+	position: relative;
+	height: 100%;

-  textarea {
-    width: 100%;
-    margin: 0;
-  }
+	textarea {
+		width: 100%;
+		margin: 0;
+	}

-  .btn {
-    opacity: 1;
-    margin: 0;
-  }
+	.btn {
+		opacity: 1;
+		margin: 0;
+	}
 }
 </style>