93:I[903690,["/chat-static/_next/static/chunks/19ru4sx2xipbx.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0c34czz85xh3f.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3ot6wcd5ecpln.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1c4pf12npy4a_.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2j46pilgqkinh.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3wiwg53adn758.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2b2k-zf-b56kd.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0l5nai4znivqy.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/35cffbjvsl8sh.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3abf52lxefhni.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1qn4-ha2vsd-p.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/095lel5ufcr08.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1rz_9ckgsy-eb.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0zgz5up_moiwf.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2cv_oykzmlqpk.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2eq_3tgsc9fan.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3u5f5fge21f5p.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/37xbvek5lee4t.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2cbmnugpvavl4.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0zt6uezrjc89m.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/09z6ri07r3sma.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/11e80b-y89mrs.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/420uifudym9av.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3nl30ufs08xyt.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/194j0nolabgr9.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1fvo0xwkj8x_o.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3z-fk_6xzfhai.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/04dkbwvbkscb6.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0-9zq73z_eohn.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1axcumexuksf-.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2iwiq6nmum4w5.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3eqa6zdyi0ea7.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/10pk7j95y2dsq.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3r5qyv0elhezz.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0rr17y2zzppmc.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0n-x3aspzp3e2.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1_kx0_cln4rnk.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0o-tlt78ggel0.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1ks0r-j8ozfdw.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3fqvzp2yqv6c9.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/001c2fksllqct.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3pwc98sa29io0.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr"],"ExplicitChatIdProvider"] 94:I[838238,["/chat-static/_next/static/chunks/19ru4sx2xipbx.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0c34czz85xh3f.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3ot6wcd5ecpln.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1c4pf12npy4a_.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2j46pilgqkinh.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3wiwg53adn758.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2b2k-zf-b56kd.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0l5nai4znivqy.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/35cffbjvsl8sh.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3abf52lxefhni.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1qn4-ha2vsd-p.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/095lel5ufcr08.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1rz_9ckgsy-eb.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0zgz5up_moiwf.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2cv_oykzmlqpk.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2eq_3tgsc9fan.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3u5f5fge21f5p.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/37xbvek5lee4t.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2cbmnugpvavl4.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0zt6uezrjc89m.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/09z6ri07r3sma.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/11e80b-y89mrs.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/420uifudym9av.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3nl30ufs08xyt.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/194j0nolabgr9.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1fvo0xwkj8x_o.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3z-fk_6xzfhai.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/04dkbwvbkscb6.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0-9zq73z_eohn.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1axcumexuksf-.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/2iwiq6nmum4w5.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3eqa6zdyi0ea7.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/10pk7j95y2dsq.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3r5qyv0elhezz.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0rr17y2zzppmc.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0n-x3aspzp3e2.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1_kx0_cln4rnk.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/0o-tlt78ggel0.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/1ks0r-j8ozfdw.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3fqvzp2yqv6c9.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/001c2fksllqct.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr","/chat-static/_next/static/chunks/3pwc98sa29io0.js?dpl=dpl_FmuAiNQeixYdcrheJD26fgu5FpQr"],"SWRDataProvider"] 95:T3908,[V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" isQuickEdit="true" isMerged="true" import type React from "react" import "./globals.css" import { Geist } from "next/font/google" const geist = Geist({ subsets: ["latin"] }) export const metadata = { title: "Linear Tasks", description: "A minimal list of my top Linear tasks", } export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/globals.css" isQuickEdit="true" isMerged="true" @tailwind base; @tailwind components; @tailwind utilities; :root { color-scheme: dark; } body { @apply bg-black text-white; } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } } .animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } [V0_FILE]typescriptreact:file="app/page.tsx" isQuickEdit="true" isMerged="true" import { TaskList } from "../components/task-list" export default function Page() { return } [V0_FILE]typescriptreact:file="components/demo-mode-toggle.tsx" isMerged="true" interface DemoModeToggleProps { isDemoMode: boolean toggleDemoMode: () => void } export function DemoModeToggle({ isDemoMode, toggleDemoMode }: DemoModeToggleProps) { return (

Demo Mode

) } [V0_FILE]typescriptreact:file="components/missing-token-message.tsx" isMerged="true" export function MissingTokenMessage() { return (

Missing Token

Please add the LINEAR_API_TOKEN environment variable to your v0 project to see your minimal Linear task list

) } [V0_FILE]typescriptreact:file="components/powered-by-linear.tsx" isMerged="true" import Image from "next/image" export function PoweredByLinear() { return (

) } [V0_FILE]typescript:file="constants/demoTasks.ts" isMerged="true" export interface Task { id: string title: string team?: { name: string } completed?: boolean url?: string } export const demoTasks: Task[] = [ { id: "1", title: "Implement new feature", url: "https://linear.app/demo/issue/DEMO-1" }, { id: "2", title: "Fix critical bug", url: "https://linear.app/demo/issue/DEMO-2" }, { id: "3", title: "Update documentation", url: "https://linear.app/demo/issue/DEMO-3" }, { id: "4", title: "Prepare for team meeting", url: "https://linear.app/demo/issue/DEMO-4" }, { id: "5", title: "Review pull requests", url: "https://linear.app/demo/issue/DEMO-5" }, ] [V0_FILE]typescript:file="lib/linear.ts" isEdit="true" isMerged="true" import { LinearClient } from "@linear/sdk" import type { Task } from "../constants/demoTasks" export async function getLinearTasks(): Promise { const client = new LinearClient({ apiKey: process.env.LINEAR_API_TOKEN, }) const me = await client.viewer const issues = await me.assignedIssues({ filter: { state: { type: { in: ["started", "unstarted"] } }, }, }) const sortedIssues = issues.nodes.sort((a, b) => { const priorityOrder = { urgent: 0, high: 1, medium: 2, low: 3, "": 4 } return (priorityOrder[a.priority ?? ""] ?? 5) - (priorityOrder[b.priority ?? ""] ?? 5) }) return sortedIssues.slice(0, 5).map((issue) => ({ id: issue.id, title: issue.title, team: { name: issue.team.name }, completed: false, url: issue.url, })) } export async function updateLinearTaskStatus(taskId: string): Promise<{ completed: boolean }> { const client = new LinearClient({ apiKey: process.env.LINEAR_API_TOKEN, }) const issue = await client.issue(taskId) const team = await issue.team const states = await team.states() const isDoneState = Boolean(issue.completedAt) const newState = states.nodes.find((state) => isDoneState ? ["backlog", "unstarted", "started"].includes(state.type) : state.type === "completed", ) if (!newState) { throw new Error(`Could not find appropriate state to move to`) } await issue.update({ stateId: newState.id }) return { completed: newState.type === "completed" } } [V0_FILE]typescriptreact:file="components/task-list.tsx" isEdit="true" isQuickEdit="true" "use client" import { useState, useEffect } from "react" import { ExternalLink } from "lucide-react" import { motion, AnimatePresence } from "framer-motion" import { DemoModeToggle } from "../components/demo-mode-toggle" import { MissingTokenMessage } from "../components/missing-token-message" import { PoweredByLinear } from "../components/powered-by-linear" import { type Task, demoTasks } from "../constants/demoTasks" import { getLinearTasks, updateLinearTaskStatus } from "../lib/linear" function SkeletonLoader() { return (

) } export function TaskList() { const [tasks, setTasks] = useState([]) const [isDemoMode, setIsDemoMode] = useState(true) const [isLoading, setIsLoading] = useState(true) const [error, setError] = useState(null) const [updatingTaskId, setUpdatingTaskId] = useState(null) useEffect(() => { const initializeApp = async () => { const hasLinearToken = !!process.env.LINEAR_API_TOKEN setIsDemoMode(!hasLinearToken) await fetchTasks(!hasLinearToken) } initializeApp() }, []) const fetchTasks = async (isDemo: boolean) => { setIsLoading(true) setError(null) if (isDemo) { // Artificial delay for demo mode await new Promise((resolve) => setTimeout(resolve, 1000)) setTasks(demoTasks) } else { if (!process.env.LINEAR_API_TOKEN) { setError("Missing Token") setTasks([]) } else { try { const linearTasks = await getLinearTasks() setTasks(linearTasks) } catch (error) { console.error("Failed to fetch Linear tasks:", error) setError("Failed to fetch tasks. Please try again.") setTasks([]) } } } setIsLoading(false) } const toggleDemoMode = () => { const newDemoMode = !isDemoMode setIsDemoMode(newDemoMode) fetchTasks(newDemoMode) } const toggleTaskCompletion = async (taskId: string) => { setUpdatingTaskId(taskId) if (isDemoMode) { setTasks((prevTasks) => prevTasks .map((task) => (task.id === taskId ? { ...task, completed: !task.completed } : task)) .sort((a, b) => (a.completed === b.completed ? 0 : a.completed ? 1 : -1)), ) setTimeout(() => setUpdatingTaskId(null), 500) } else { try { const { completed } = await updateLinearTaskStatus(taskId) setTasks((prevTasks) => prevTasks .map((task) => (task.id === taskId ? { ...task, completed } : task)) .sort((a, b) => (a.completed === b.completed ? 0 : a.completed ? 1 : -1)), ) } catch (error) { console.error("Failed to update task status:", error) setError("Failed to update task status. Please try again.") } finally { setUpdatingTaskId(null) } } } const openTaskInNewWindow = (url: string) => { window.open(url, "_blank", "noopener,noreferrer") } return (

{error === "Missing Token" ? ( ) : ( <>

Due Today

{isLoading ? ( ) : error ? (

{error}

) : ( {tasks.map((task) => ( toggleTaskCompletion(task.id)} >

{task.title} {!isDemoMode && task.team && ( {task.team.name} )}

{task.url && (

{ e.stopPropagation() openTaskInNewWindow(task.url!) }} >

)}

))} )} )}

) } 89:["$","$L93",null,{"chatId":"RaQOlWt5mbG","children":["$","$L94",null,{"data":{"@\"active-block\",\"RaQOlWt5mbG\",":{"id":"b_ZP3wgZNm9lu","messageId":"cUwNyS3WlqnANYq09FTG1952a6ekbdJ4","source":"$95","language":"typescriptreact","type":"code-project","closed":true,"meta":{"id":"linear-tasks","type":"code-project","project":"linear-tasks"},"hasSourceBeenEdited":false,"forkedFromBlockId":"$undefined"},"@\"chat:vm-mode\",\"RaQOlWt5mbG\",":false,"":null},"children":"$L96"}]}]

About

Tags

Share

About

Tags

Share

More from ctate

More Templates Like This