Skip to content

Commit 9a90fff

Browse files
guntagunta
committed
feat: Update components for improved user experience and clarity
- Revised the ComparisonTable component to enhance descriptions and add a new entry for Polar's pivot, providing clearer context on funding models. - Updated the FAQ component to clarify refund policies and introduce critical controls for maintainers, ensuring better understanding and preventing abuse. - Enhanced the Hero component by integrating a GitHub star button for increased visibility and engagement. - Improved the InteractiveWorkflow component's payment UI for better visibility and user feedback during transactions. - Adjusted the WhyNow component's links to direct users to the correct GitHub repository, enhancing navigation. These changes aim to create a more informative and engaging user experience across the application.
1 parent 705d931 commit 9a90fff

File tree

11 files changed

+677
-60
lines changed

11 files changed

+677
-60
lines changed

‎package-lock.json‎

Lines changed: 15 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/ComparisonTable.tsx‎

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ const comparisons: ComparisonItem[] = [
3131
estimation: "Manual only",
3232
execution: "None",
3333
control: "Platform-owned",
34-
weakness: "High fees, <1% adoption"
34+
weakness: "Same failed model, 20% fees, platform risk"
3535
},
3636
{
3737
name: "Gitcoin",
@@ -43,6 +43,16 @@ const comparisons: ComparisonItem[] = [
4343
control: "DAO governance",
4444
weakness: "Complex, volatile, high friction"
4545
},
46+
{
47+
name: "Polar (pre-pivot)",
48+
status: "failed",
49+
infrastructure: "External platform",
50+
funding: "Donation model",
51+
estimation: "Manual only",
52+
execution: "None",
53+
control: "Platform-owned",
54+
weakness: "Pivoted 2024 - donations rarely happen"
55+
},
4656
{
4757
name: "GitHub Sponsors",
4858
status: "active",
@@ -203,9 +213,9 @@ export default function ComparisonTable() {
203213
transition={{ delay: 0.6 }}
204214
className="bg-yellow-500/10 border border-yellow-500/20 rounded-xl p-6"
205215
>
206-
<h3 className="text-xl font-semibold text-yellow-400 mb-3">The Friction Problem</h3>
216+
<h3 className="text-xl font-semibold text-yellow-400 mb-3">The Timing Problem</h3>
207217
<p className="text-gray-400 text-sm">
208-
Requiring external accounts, crypto wallets, or complex onboarding kills adoption. If it's not one-click, it's too much.
218+
Polar tried in 2023 without AI - couldn't make it work. The tech wasn't ready. Now with Claude/GPT-4, the economics finally work.
209219
</p>
210220
</motion.div>
211221

@@ -217,7 +227,7 @@ export default function ComparisonTable() {
217227
>
218228
<h3 className="text-xl font-semibold text-green-400 mb-3">The PRiority Way</h3>
219229
<p className="text-gray-400 text-sm">
220-
GitHub-native, AI-powered, repo-owned. No platform risk, no friction, just results. Built on what works, avoiding what doesn't.
230+
GitHub-native, AI-powered, repo-owned. Learning from every failure, leveraging 2024's AI capabilities. The timing is finally right.
221231
</p>
222232
</motion.div>
223233
</div>

‎src/components/CrowdfundingCampaign.astro‎

Lines changed: 88 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import TiltedCard from './TiltedCard.astro';
88
<!-- Hero -->
99
<div class="hero">
1010
<h1>Fund PRiority</h1>
11-
<p class="tagline">Turn GitHub issues into funded priorities. Today.</p>
11+
<p class="tagline">Finally, sustainable funding for open source developers worldwide.</p>
1212
<p class="creator">by <a href="https://github.com/gunta" target="_blank">@gunta</a></p>
1313
</div>
1414

@@ -21,6 +21,31 @@ import TiltedCard from './TiltedCard.astro';
2121
</svg>
2222
Goal: Raise $10,000 to build the MVP and launch on GitHub Marketplace
2323
</div>
24+
25+
<!-- Mission Statement -->
26+
<div class="mission-statement">
27+
<h2 class="mission-title">🌍 Why PRiority Matters</h2>
28+
<div class="mission-grid">
29+
<div class="mission-item">
30+
<div class="mission-number">$8.8T</div>
31+
<p>Unpaid labor in open source. Developers deserve to be paid.</p>
32+
</div>
33+
<div class="mission-item">
34+
<div class="mission-number">5%</div>
35+
<p>Lowest platform fee ever. We take from enterprises, not struggling developers.</p>
36+
</div>
37+
<div class="mission-item">
38+
<div class="mission-number">Zero</div>
39+
<p>Tax hassles with Stripe MoR. Work from anywhere, get paid everywhere.</p>
40+
</div>
41+
</div>
42+
<p class="mission-text">
43+
<strong>Our Philosophy:</strong> Open source powers the world. It's time developers got paid fairly.
44+
PRiority uses AI to make issue funding instant and frictionless. Just 5% platform fee for everyone -
45+
cheaper than any alternative. We handle all international taxes through Stripe.
46+
<span class="highlight">Your support helps us build this for the community, not VCs.</span>
47+
</p>
48+
</div>
2449

2550
<div class="tiers-grid">
2651
<!-- Coffee Tier - Warm & Friendly -->
@@ -533,6 +558,68 @@ import TiltedCard from './TiltedCard.astro';
533558
border: 1px solid rgba(59, 130, 246, 0.2);
534559
}
535560

561+
.mission-statement {
562+
background: linear-gradient(135deg, rgba(34, 197, 94, 0.1), rgba(59, 130, 246, 0.1));
563+
border: 1px solid rgba(59, 130, 246, 0.2);
564+
border-radius: 16px;
565+
padding: 32px;
566+
margin-bottom: 48px;
567+
text-align: center;
568+
}
569+
570+
.mission-title {
571+
font-size: 32px;
572+
font-weight: 700;
573+
margin-bottom: 32px;
574+
background: linear-gradient(135deg, #22c55e 0%, #3b82f6 100%);
575+
-webkit-background-clip: text;
576+
-webkit-text-fill-color: transparent;
577+
}
578+
579+
.mission-grid {
580+
display: grid;
581+
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
582+
gap: 24px;
583+
margin-bottom: 32px;
584+
}
585+
586+
.mission-item {
587+
padding: 20px;
588+
background: rgba(0, 0, 0, 0.3);
589+
border-radius: 12px;
590+
border: 1px solid rgba(255, 255, 255, 0.1);
591+
}
592+
593+
.mission-number {
594+
font-size: 36px;
595+
font-weight: 700;
596+
color: #60a5fa;
597+
margin-bottom: 8px;
598+
}
599+
600+
.mission-item p {
601+
color: #c9d1d9;
602+
font-size: 14px;
603+
line-height: 1.5;
604+
}
605+
606+
.mission-text {
607+
max-width: 800px;
608+
margin: 0 auto;
609+
color: #c9d1d9;
610+
font-size: 16px;
611+
line-height: 1.8;
612+
}
613+
614+
.mission-text strong {
615+
color: #60a5fa;
616+
}
617+
618+
.mission-text .highlight {
619+
color: #22c55e;
620+
font-weight: 600;
621+
}
622+
536623
.rocket-icon {
537624
flex-shrink: 0;
538625
opacity: 0.9;

‎src/components/FAQ.astro‎

Lines changed: 42 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -54,10 +54,10 @@ const { className = "" } = Astro.props;
5454
<div class="group">
5555
<h3 class="text-xl font-semibold mb-3 text-white/90 flex items-start">
5656
<span class="text-green-400 mr-3">→</span>
57-
Can I get a refund if work isn't completed?
57+
Can I get a refund? What about abuse?
5858
</h3>
5959
<p class="text-gray-400 ml-8">
60-
Yes! Automatic refunds trigger after 7 days of inactivity (100% refund), 14 days if blocked waiting for input (minus tokens used), or if scope increases >50%. Refunds are calculated fairly: original amount minus tokens used, time logged, and platform fee (10%).
60+
Refunds are graduated to prevent abuse: 85% before work starts, 40% after code is written, 25% after PR opened, 0% after merge. This prevents the "fund → get code → refund → steal" exploit. Platform fees (10%) and AI tokens are never refundable as they're already consumed.
6161
</p>
6262
</div>
6363

@@ -125,9 +125,48 @@ const { className = "" } = Astro.props;
125125
</div>
126126
</div>
127127

128+
<!-- Additional Critical FAQs -->
129+
<div class="mt-8 p-6 bg-yellow-500/10 border border-yellow-500/20 rounded-xl">
130+
<h3 class="text-xl font-semibold mb-4 text-yellow-400">⚠️ Critical Controls for Maintainers</h3>
131+
132+
<div class="space-y-4">
133+
<div>
134+
<h4 class="font-semibold text-white mb-2">Can I restrict which issues can be funded?</h4>
135+
<p class="text-gray-400 text-sm">
136+
Yes! Use blacklist mode (block `security`, `internal` labels), whitelist mode (only allow `funding-welcome`),
137+
or require approval for amounts over $500. You control what gets funded.
138+
</p>
139+
</div>
140+
141+
<div>
142+
<h4 class="font-semibold text-white mb-2">What if low-priority issues get funded?</h4>
143+
<p class="text-gray-400 text-sm">
144+
Funded issues enter a queue. You choose the order to work on them. Just because something is funded doesn't mean it jumps the line - you maintain control over priorities.
145+
</p>
146+
</div>
147+
148+
<div>
149+
<h4 class="font-semibold text-white mb-2">Does this need VC funding to succeed?</h4>
150+
<p class="text-gray-400 text-sm">
151+
No. Zero infrastructure needed (runs on GitHub Actions). Revenue from day 1 via platform fees.
152+
We can bootstrap and grow organically. This isn't another VC-dependent platform that will fail when funding dries up.
153+
</p>
154+
</div>
155+
156+
<div>
157+
<h4 class="font-semibold text-white mb-2">What about private repositories?</h4>
158+
<p class="text-gray-400 text-sm">
159+
<strong class="text-white">Yes, private repos are fully supported!</strong> Pro ($99/mo) and Enterprise (custom) tiers unlock private repository access.
160+
Perfect for companies using GitHub internally. Open source repos are free (10% platform fee only) to encourage transparency,
161+
but we know enterprises need private development too.
162+
</p>
163+
</div>
164+
</div>
165+
</div>
166+
128167
<div class="mt-12 p-6 bg-gradient-to-r from-blue-500/10 to-purple-500/10 rounded-xl border border-white/10">
129168
<p class="text-center text-gray-400">
130-
Have more questions? Check our <a href="https://docs.priority.dev" class="text-blue-400 hover:text-blue-300 underline">documentation</a> or ask in an issue on <a href="https://github.com/priority/priority" class="text-blue-400 hover:text-blue-300 underline">our GitHub</a>
169+
Have more questions? Ask in an issue on <a href="https://github.com/gunta/PRiority" class="text-blue-400 hover:text-blue-300 underline">our GitHub</a>
131170
</p>
132171
</div>
133172
</div>

‎src/components/GitHubStarButton.tsx‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import React, { useEffect, useState } from 'react';
2+
3+
interface GitHubStarButtonProps {
4+
className?: string;
5+
showCount?: boolean;
6+
large?: boolean;
7+
}
8+
9+
const GitHubStarButton: React.FC<GitHubStarButtonProps> = ({
10+
className = '',
11+
showCount = true,
12+
large = false
13+
}) => {
14+
const [stars, setStars] = useState<number | null>(null);
15+
const [loading, setLoading] = useState(true);
16+
17+
useEffect(() => {
18+
// Fetch GitHub stars count
19+
fetch('https://api.github.com/repos/gunta/PRiority')
20+
.then(res => res.json())
21+
.then(data => {
22+
setStars(data.stargazers_count || 0);
23+
setLoading(false);
24+
})
25+
.catch(err => {
26+
console.error('Failed to fetch GitHub stars:', err);
27+
setLoading(false);
28+
});
29+
}, []);
30+
31+
const formatStars = (count: number): string => {
32+
if (count >= 1000) {
33+
return (count / 1000).toFixed(1) + 'k';
34+
}
35+
return count.toString();
36+
};
37+
38+
return (
39+
<a
40+
href="https://github.com/gunta/PRiority"
41+
target="_blank"
42+
rel="noopener noreferrer"
43+
className={`github-star-button inline-flex items-center gap-2 ${
44+
large ? 'px-6 py-3 text-base' : 'px-4 py-2 text-sm'
45+
} bg-gray-900/80 hover:bg-gray-800 border border-gray-700 hover:border-gray-600 rounded-xl transition-all duration-200 group font-semibold ${className}`}
46+
>
47+
<svg
48+
className={`${large ? 'w-5 h-5' : 'w-4 h-4'} group-hover:text-yellow-400 transition-colors`}
49+
fill="currentColor"
50+
viewBox="0 0 24 24"
51+
>
52+
<path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/>
53+
</svg>
54+
<span className="font-medium">Star</span>
55+
{showCount && (
56+
<>
57+
<div className="w-px h-4 bg-gray-700 group-hover:bg-gray-600"></div>
58+
<span className={`font-semibold ${loading ? 'animate-pulse' : ''}`}>
59+
{loading ? '...' : stars !== null ? formatStars(stars) : '0'}
60+
</span>
61+
</>
62+
)}
63+
</a>
64+
);
65+
};
66+
67+
export default GitHubStarButton;

‎src/components/Hero.astro‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import FadeContent from '../Animations/FadeContent/FadeContent.tsx';
44
import Orb from '../Backgrounds/Orb/Orb.tsx';
55
import ShinyText from './ShinyText.astro';
66
import GradientText from './GradientText.astro';
7+
import GitHubStarButton from './GitHubStarButton.tsx';
78
---
89

910
<div class="hero-container">
@@ -44,12 +45,13 @@ import GradientText from './GradientText.astro';
4445
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6" />
4546
</svg>
4647
</a>
47-
<a href="https://github.com/gunta" target="_blank" rel="noopener noreferrer" class="glow-button bg-gray-800 hover:bg-gray-700 border border-gray-600">
48+
<GitHubStarButton client:load showCount={true} large={true} />
49+
<!-- <a href="https://github.com/gunta" target="_blank" rel="noopener noreferrer" class="glow-button bg-gray-800 hover:bg-gray-700 border border-gray-600">
4850
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 24 24">
4951
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.30.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
5052
</svg>
5153
Follow on GitHub
52-
</a>
54+
</a> -->
5355
</div>
5456
</FadeContent>
5557

0 commit comments

Comments
 (0)