* Redesign the header * Responsiveness of the roadmap header * Fix spacing * Redesign roadmap header * Add projects badge * Update badge * Add screen for projects * UI flicker fix * Add question for system design * Code formatting
41 lines
1013 B
TypeScript
41 lines
1013 B
TypeScript
import { Download } from 'lucide-react';
|
|
import { isLoggedIn } from '../lib/jwt.ts';
|
|
import { useEffect, useState } from 'react';
|
|
import { showLoginPopup } from '../lib/popup.ts';
|
|
|
|
type DownloadRoadmapButtonProps = {
|
|
roadmapId: string;
|
|
};
|
|
|
|
export function DownloadRoadmapButton(props: DownloadRoadmapButtonProps) {
|
|
const { roadmapId } = props;
|
|
|
|
const [url, setUrl] = useState<string>('#');
|
|
|
|
useEffect(() => {
|
|
if (isLoggedIn()) {
|
|
setUrl(`/pdfs/roadmaps/${roadmapId}.pdf`);
|
|
}
|
|
}, []);
|
|
|
|
return (
|
|
<a
|
|
className="inline-flex items-center justify-center rounded-md bg-yellow-400 px-3 py-1.5 text-xs font-medium hover:bg-yellow-500 sm:text-sm"
|
|
aria-label="Download Roadmap"
|
|
target="_blank"
|
|
href={url}
|
|
onClick={(e) => {
|
|
if (isLoggedIn()) {
|
|
return;
|
|
}
|
|
|
|
e.preventDefault();
|
|
showLoginPopup();
|
|
}}
|
|
>
|
|
<Download className="h-4 w-4" />
|
|
<span className="ml-2 hidden sm:inline">Download</span>
|
|
</a>
|
|
);
|
|
}
|