FlowWeb / src /features /dashboard /hooks /useDashboardLogic.js
danylokhodus's picture
fix: block canvas creation UI when Free tier limit reached, show upgrade card
e1326fc
Raw
History Blame Contribute Delete
3.47 kB
import { useState, useEffect } from 'react';
import axios from 'axios';
import { useNavigate } from 'react-router-dom';
export const useDashboardLogic = (user) => {
const navigate = useNavigate();
const [projects, setProjects] = useState([]);
const [allProjects, setAllProjects] = useState([]);
const [loading, setLoading] = useState(true);
const [aiGenerating, setAiGenerating] = useState(false);
const [searchTerm, setSearchTerm] = useState('');
const API_URL = import.meta.env.VITE_API_URL;
useEffect(() => {
if (user) {
fetchProjects();
} else {
setLoading(false);
}
}, [user]);
const fetchProjects = async () => {
try {
console.log('[Dashboard] Fetching projects for user:', user.id, 'at URL:', `${API_URL}/graphs/user/${user.id}`);
const res = await axios.get(`${API_URL}/graphs/user/${user.id}`);
console.log('[Dashboard] Projects loaded successfully:', res.data);
setAllProjects(res.data);
setProjects(res.data);
} catch (err) {
console.error('[Dashboard] Error fetching projects:', err);
} finally {
setLoading(false);
}
};
const handleCreateProject = async (title, templateKey = null) => {
if (!title || !user) return;
try {
const res = await axios.post(`${API_URL}/graphs`, {
userId: user.id,
title,
description: 'New strategy path...',
templateKey
});
navigate(`/canvas/${res.data.id}`);
} catch (err) {
const msg = err.response?.data?.message;
if (err.response?.status === 400 && msg) {
alert(msg);
if (msg.toLowerCase().includes('canvas') || msg.toLowerCase().includes('limit')) {
navigate('/subscription');
}
} else {
console.error('Error creating project', err);
}
}
};
const handleCreateProjectWithAI = async (goal) => {
if (!goal || !user) return;
setAiGenerating(true);
try {
const res = await axios.post(`${API_URL}/AI/generate-goal`, {
userId: user.id,
goal
});
navigate(`/canvas/${res.data.id}`);
return res.data;
} catch (err) {
const msg = err.response?.data?.message;
if (msg) {
alert(msg);
if (err.response?.status === 403 && msg.toLowerCase().includes('daily')) {
navigate('/subscription');
} else if ((err.response?.status === 400) && (msg.toLowerCase().includes('canvas') || msg.toLowerCase().includes('limit'))) {
navigate('/subscription');
}
} else {
console.error('Error creating project with AI', err);
}
throw err;
} finally {
setAiGenerating(false);
}
};
const handleDeleteProject = async (id) => {
try {
await axios.delete(`${API_URL}/graphs/${id}`);
setProjects(projects.filter(p => p.id !== id));
setAllProjects(allProjects.filter(p => p.id !== id));
} catch (err) {
console.error('Error deleting project', err);
}
};
const filteredProjects = projects.filter(p =>
p.title.toLowerCase().includes(searchTerm.toLowerCase())
);
// Count only owned projects (not shared ones) for limit checking
const ownedCount = allProjects.filter(p => !p.isShared).length;
return {
projects: filteredProjects,
loading,
aiGenerating,
searchTerm,
setSearchTerm,
handleCreateProject,
handleCreateProjectWithAI,
handleDeleteProject,
ownedCount
};
};