Update Activity.tsx links to open in new windows for Discord isolation
cgen-5c1c9384a0314221a4919ca678ff7dc8
This commit is contained in:
parent
40edbd9e3a
commit
8e14336698
1 changed files with 105 additions and 28 deletions
|
|
@ -75,14 +75,90 @@ export default function Activity() {
|
|||
);
|
||||
}
|
||||
|
||||
if (!isActivity) {
|
||||
return null;
|
||||
// Not in Discord Activity - show informational message
|
||||
if (!isActivity && !isLoading) {
|
||||
return (
|
||||
<div className="flex items-center justify-center min-h-screen bg-gray-900">
|
||||
<div className="text-center max-w-md">
|
||||
<h1 className="text-3xl font-bold text-white mb-4">
|
||||
🎮 Discord Activity
|
||||
</h1>
|
||||
<p className="text-gray-300 mb-8">
|
||||
This page is designed to run as a Discord Activity. Open it within Discord to get started!
|
||||
</p>
|
||||
<p className="text-gray-500 text-sm">
|
||||
Not in Discord? Visit the main app at{" "}
|
||||
<a
|
||||
href="https://aethex.dev"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-blue-400 hover:text-blue-300 underline"
|
||||
>
|
||||
aethex.dev
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (user) {
|
||||
if (isLoading) {
|
||||
return (
|
||||
<LoadingScreen
|
||||
message="Initializing Discord Activity..."
|
||||
showProgress={true}
|
||||
duration={5000}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<div className="flex items-center justify-center min-h-screen bg-gray-900">
|
||||
<div className="text-center max-w-md">
|
||||
<h1 className="text-3xl font-bold text-red-500 mb-4">
|
||||
❌ Activity Error
|
||||
</h1>
|
||||
<p className="text-gray-300 mb-8 text-sm">{error}</p>
|
||||
|
||||
<div className="bg-gray-800 border border-gray-700 rounded-lg p-4 mb-6 text-left">
|
||||
<h3 className="text-white font-semibold mb-3">
|
||||
Troubleshooting Steps:
|
||||
</h3>
|
||||
<ol className="text-gray-400 text-sm space-y-2 list-decimal list-inside">
|
||||
<li>Clear your browser cache (Ctrl+Shift+Delete)</li>
|
||||
<li>Close Discord completely</li>
|
||||
<li>Reopen Discord</li>
|
||||
<li>Try opening the Activity again</li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div className="bg-blue-900/20 border border-blue-700 rounded-lg p-3 mb-6">
|
||||
<p className="text-blue-300 text-xs">
|
||||
💡 Open Discord DevTools (Ctrl+Shift+I) and check the console for messages starting with{" "}
|
||||
<code className="bg-blue-950 px-1 rounded">
|
||||
[Discord Activity]
|
||||
</code>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<button
|
||||
onClick={() => window.location.reload()}
|
||||
className="px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg transition-colors text-sm"
|
||||
>
|
||||
Retry
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (user && showContent) {
|
||||
const appBaseUrl = "https://aethex.dev";
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-900">
|
||||
<div className="max-w-7xl mx-auto px-4 py-8">
|
||||
<div className="max-w-2xl mx-auto px-4 py-8">
|
||||
<div className="text-center mb-8">
|
||||
<h1 className="text-3xl font-bold text-white">
|
||||
Welcome to AeThex, {user.full_name || user.username}! 🎉
|
||||
|
|
@ -127,48 +203,48 @@ export default function Activity() {
|
|||
Your primary realm determines your Discord role and access to
|
||||
realm-specific features.
|
||||
</p>
|
||||
<button className="mt-4 px-4 py-2 bg-purple-600 hover:bg-purple-700 text-white rounded-lg transition-colors">
|
||||
<button
|
||||
onClick={() => window.open(`${appBaseUrl}/profile/settings`, "_blank")}
|
||||
className="mt-4 px-4 py-2 bg-purple-600 hover:bg-purple-700 text-white rounded-lg transition-colors"
|
||||
>
|
||||
Change Realm
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-gray-800 rounded-lg p-6 border border-gray-700">
|
||||
<div className="bg-gray-800 rounded-lg p-6 border border-gray-700 mb-8">
|
||||
<h2 className="text-xl font-bold text-white mb-4">
|
||||
🚀 Quick Actions
|
||||
</h2>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<a
|
||||
href="/creators"
|
||||
className="p-4 bg-gray-700 hover:bg-gray-600 rounded-lg text-white text-center transition-colors"
|
||||
<button
|
||||
onClick={() => window.open(`${appBaseUrl}/creators`, "_blank")}
|
||||
className="p-4 bg-gray-700 hover:bg-gray-600 rounded-lg text-white text-center transition-colors font-medium"
|
||||
>
|
||||
🎨 Browse Creators
|
||||
</a>
|
||||
<a
|
||||
href="/opportunities"
|
||||
className="p-4 bg-gray-700 hover:bg-gray-600 rounded-lg text-white text-center transition-colors"
|
||||
</button>
|
||||
<button
|
||||
onClick={() => window.open(`${appBaseUrl}/opportunities`, "_blank")}
|
||||
className="p-4 bg-gray-700 hover:bg-gray-600 rounded-lg text-white text-center transition-colors font-medium"
|
||||
>
|
||||
💼 Find Opportunities
|
||||
</a>
|
||||
<a
|
||||
href="/profile/settings"
|
||||
className="p-4 bg-gray-700 hover:bg-gray-600 rounded-lg text-white text-center transition-colors"
|
||||
</button>
|
||||
<button
|
||||
onClick={() => window.open(`${appBaseUrl}/profile/settings`, "_blank")}
|
||||
className="p-4 bg-gray-700 hover:bg-gray-600 rounded-lg text-white text-center transition-colors font-medium"
|
||||
>
|
||||
⚙️ Settings
|
||||
</a>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-8 p-4 bg-blue-900 border border-blue-700 rounded-lg">
|
||||
<p className="text-blue-100">
|
||||
💡 <strong>Tip:</strong> Use Discord commands like{" "}
|
||||
<code className="bg-blue-800 px-2 py-1 rounded">/profile</code>,{" "}
|
||||
<code className="bg-blue-800 px-2 py-1 rounded">/set-realm</code>,
|
||||
and{" "}
|
||||
<code className="bg-blue-800 px-2 py-1 rounded">
|
||||
/verify-role
|
||||
</code>{" "}
|
||||
to manage your account within Discord.
|
||||
<div className="bg-blue-900/20 border border-blue-700 rounded-lg p-4">
|
||||
<p className="text-blue-100 text-sm">
|
||||
💡 <strong>Discord Commands:</strong> Use{" "}
|
||||
<code className="bg-blue-950 px-2 py-1 rounded text-xs">/profile</code>,{" "}
|
||||
<code className="bg-blue-950 px-2 py-1 rounded text-xs">/set-realm</code>, and{" "}
|
||||
<code className="bg-blue-950 px-2 py-1 rounded text-xs">/verify-role</code>{" "}
|
||||
to manage your account directly in Discord.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -176,6 +252,7 @@ export default function Activity() {
|
|||
);
|
||||
}
|
||||
|
||||
// Still loading
|
||||
return (
|
||||
<LoadingScreen
|
||||
message="Loading your profile..."
|
||||
|
|
|
|||
Loading…
Reference in a new issue