Problem: merit requests that are only a github are annyoing

src/components/MeritRequestDashboard.svelte

@@ -2,7 +2,7 @@
 	import { base } from '$app/paths';
 	import * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';
 	import type { MeritRequest } from '@/event_helpers/merits';
-	import { getRocketURL } from '@/helpers';
+	import { getRocketURL, parseProblem } from '@/helpers';
 	import type { NDKEvent } from '@nostr-dev-kit/ndk';
 	import MeritSummaryCard from './MeritSummaryCard.svelte';
 
@@ -27,11 +27,13 @@
 				</Breadcrumb.Item>
 				<Breadcrumb.Separator />
 				<Breadcrumb.Item>
-					<Breadcrumb.Page
-						>{merit
-							.Problem()
-							.substring(0, 16)}{#if merit.Problem().length > 16}...{/if}</Breadcrumb.Page
-					>
+					<Breadcrumb.Page>
+						{#await parseProblem(merit.Problem())}
+							{merit.Problem().substring(0, 16)}{#if merit.Problem().length > 16}...{/if}
+						{:then parsed}
+							{parsed.substring(0, 16)}{#if parsed.length > 16}...{/if}
+						{/await}
+					</Breadcrumb.Page>
 				</Breadcrumb.Item>
 			</Breadcrumb.List>
 		</Breadcrumb.Root>

src/components/MeritRequests.svelte

@@ -5,7 +5,7 @@
 	import * as Table from '@/components/ui/table';
 	import { MapOfMeritResult, MeritRequest } from '@/event_helpers/merits';
 	import { Rocket, RocketATagFilter } from '@/event_helpers/rockets';
-	import { unixToRelativeTime } from '@/helpers';
+	import { parseProblem, unixToRelativeTime } from '@/helpers';
 	import { ndk } from '@/ndk';
 	import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
 	import { Avatar, Name } from '@nostr-dev-kit/ndk-svelte-components';
@@ -114,7 +114,13 @@
 								/>
 							</div>
 						</Table.Cell>
-						<Table.Cell class="hidden text-left md:table-cell">{merit.Problem()}</Table.Cell>
+						<Table.Cell class="hidden text-left md:table-cell">
+							{#await parseProblem(merit.Problem())}
+								{merit.Problem()}
+							{:then parsed}
+								{parsed}
+							{/await}
+						</Table.Cell>
 						<Table.Cell class="table-cell">{merit.Sats}</Table.Cell>
 						<Table.Cell class="table-cell">{merit.Merits}</Table.Cell>
 						<Table.Cell class="hidden text-right md:table-cell"

src/components/MeritSummaryCard.svelte

@@ -11,7 +11,13 @@
 	import { Separator } from '$lib/components/ui/separator/index.js';
 	import * as Table from '@/components/ui/table';
 	import { Rocket, RocketATagFilter } from '@/event_helpers/rockets';
-	import { formatReferenceTime, getCuckPrice, getRocketURL, unixToRelativeTime } from '@/helpers';
+	import {
+		formatReferenceTime,
+		getCuckPrice,
+		getRocketURL,
+		parseProblem,
+		unixToRelativeTime
+	} from '@/helpers';
 	import { derived } from 'svelte/store';
 
 	import { goto } from '$app/navigation';
@@ -116,7 +122,13 @@
 <Card.Root class="sm:col-span-2 {border}">
 	<Card.Header class="pb-3">
 		<div class="flex flex-nowrap justify-between">
-			<Card.Title>Problem: {merit.Problem().substring(0, 20)}</Card.Title>{#if merit.Solution()}<a
+			<Card.Title>
+				{#await parseProblem(merit.Problem())}
+					Problem: {merit.Problem().substring(0, 20)}
+				{:then parsed}
+					{parsed}
+				{/await}
+			</Card.Title>{#if merit.Solution()}<a
 					class="flex flex-nowrap text-orange-500 underline decoration-orange-500"
 					href={merit.Solution()}>View Solution <ExternalLink size={18} class="m-1" /></a
 				>{/if}
@@ -129,9 +141,6 @@
 			/>
 			<Name ndk={$ndk} pubkey={merit.Pubkey} class="inline-block max-w-32 truncate p-2" />
 		</div>
-		<Card.Description class="max-w-lg text-balance leading-relaxed">
-			{#if merit.Problem().length > 20}{merit.Problem()}{/if}
-		</Card.Description>
 		<Card.Content class="p-6 text-sm">
 			<div class="grid gap-3">
 				<div class="font-semibold">Merit Request Details</div>

src/lib/helpers.ts

@@ -88,3 +88,56 @@ export async function getCuckPrice(): Promise<number | Error> {
 		return e as Error;
 	}
 }
+
+export async function parseProblem(problem: string) {
+	try {
+		if (isGitHubIssueUrl(problem)) {
+			const apiURL = convertToGitHubApiUrl(problem);
+			if (!apiURL) {
+				return problem;
+			}
+			const response = await fetch(apiURL);
+			const json = await response.json();
+			return json.title;
+		} else {
+			return problem;
+		}
+	} catch (error) {
+		console.error('Get title error:', error);
+		return problem;
+	}
+}
+
+function isGitHubIssueUrl(url: string): boolean {
+	try {
+		const parsedUrl: URL = new URL(url);
+		if (parsedUrl.hostname !== 'github.com') {
+			return false;
+		}
+		const pathParts: string[] = parsedUrl.pathname.split('/').filter((part) => part !== '');
+		if (pathParts.length !== 4 || pathParts[2] !== 'issues' || !/^[1-9]\d*$/.test(pathParts[3])) {
+			return false;
+		}
+		return true;
+	} catch (error) {
+		return false;
+	}
+}
+
+function convertToGitHubApiUrl(issueUrl: URL | string): URL | null {
+	try {
+		const url = new URL(issueUrl);
+		if (url.hostname !== 'github.com') {
+			throw new Error('Not a valid GitHub URL');
+		}
+		const pathParts = url.pathname.split('/').filter((part) => part !== '');
+		if (pathParts.length !== 4 || pathParts[2] !== 'issues') {
+			throw new Error('Not a valid GitHub issue URL');
+		}
+		const [owner, repo, , issueNumber] = pathParts;
+		return new URL(`https://api.github.com/repos/${owner}/${repo}/issues/${issueNumber}`);
+	} catch (error) {
+		console.error('URL conversion error:', error);
+		return null;
+	}
+}