Re-add Steam connect url since sometimes it does indeed work

JensForstmann · Apr 22, 2024 · ace501a · ace501a
1 parent b800c38
commit ace501a
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 1 deletion.
diff --git a/frontend/src/assets/Icons.tsx b/frontend/src/assets/Icons.tsx
@@ -104,6 +104,20 @@ export const SvgCopyAll: Component<ComponentProps<'svg'>> = (props) => (
 	</svg>
 );
 
+export const SvgOpenInNew: Component<ComponentProps<'svg'>> = (props) => (
+	<svg
+		xmlns="http://www.w3.org/2000/svg"
+		height="24px"
+		viewBox="0 0 24 24"
+		width="24px"
+		fill="currentColor"
+		{...props}
+	>
+		<path d="M0 0h24v24H0V0z" fill="none" />
+		<path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z" />
+	</svg>
+);
+
 export const SvgNavigateBefore: Component<ComponentProps<'svg'>> = (props) => (
 	<svg
 		xmlns="http://www.w3.org/2000/svg"

diff --git a/frontend/src/components/GameServerCard.tsx b/frontend/src/components/GameServerCard.tsx
@@ -1,6 +1,6 @@
 import { Component } from 'solid-js';
 import { IMatchResponse } from '../../../common';
-import { SvgCopyAll } from '../assets/Icons';
+import { SvgCopyAll, SvgOpenInNew } from '../assets/Icons';
 import { t } from '../utils/locale';
 import { Card } from './Card';
 import { copyToClipboard } from '../utils/copyToClipboard';
@@ -9,6 +9,7 @@ export const GameServerCard: Component<{
 	match: IMatchResponse;
 }> = (props) => {
 	const ipPort = () => `${props.match.gameServer.ip}:${props.match.gameServer.port}`;
+	const steamUrl = () => `steam://connect/${ipPort()}?appid=730/${props.match.serverPassword}`;
 	const command = () =>
 		(props.match.serverPassword ? `password "${props.match.serverPassword}"; ` : '') +
 		`connect ${ipPort()}`;
@@ -17,6 +18,10 @@ export const GameServerCard: Component<{
 		<Card class="text-center">
 			<h2 class="text-lg font-bold">{t('Game Server')}</h2>
 			<p>
+				<a href={steamUrl()}>
+					{steamUrl()} <SvgOpenInNew class="inline-block" />
+				</a>
+				<br />
 				<span class="align-middle">{command()}</span>
 				<button class="ml-1 align-middle" onClick={() => copyToClipboard(command())}>
 					<SvgCopyAll />