ag/gymflow
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases 1 Wiki Activity

New exercise creation added to Quick Log. History fixed.

Browse Source
This commit is contained in:
AG
2025-11-29 19:29:35 +02:00
parent b5c8e8ac43
commit 4f363730d5
5 changed files with 116 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
components/Tracker/SporadicView.tsx
View File

@@ -3,6 +3,7 @@ import { Dumbbell, Scale, Activity, Timer as TimerIcon, ArrowRight, ArrowUp, Plu
import { ExerciseType, Language } from '../../types';
import { t } from '../../services/i18n';
import FilledInput from '../FilledInput';
import ExerciseModal from '../ExerciseModal';
import { useTracker } from './useTracker';
interface SporadicViewProps {
@@ -31,23 +32,41 @@ const SporadicView: React.FC<SporadicViewProps> = ({ tracker, lang }) => {
setHeight,
handleLogSporadicSet,
sporadicSuccess,
setIsSporadicMode
setIsSporadicMode,
isCreating,
setIsCreating,
handleCreateExercise,
exercises,
resetForm
} = tracker;
return (
<div className="flex flex-col h-full max-h-full overflow-hidden relative bg-surface">
<div className="px-4 py-3 bg-surface-container shadow-elevation-1 z-20 flex justify-between items-center">
<div className="flex flex-col">
<button
onClick={() => {
resetForm();
setIsSporadicMode(false);
}}
className="text-error font-medium text-sm hover:opacity-80 transition-opacity"
>
{t('cancel', lang)}
</button>
<div className="flex flex-col items-center">
<h2 className="text-title-medium text-on-surface flex items-center gap-2 font-medium">
<span className="w-2 h-2 rounded-full bg-primary animate-pulse" />
{t('quick_log', lang)}
</h2>
</div>
<button
onClick={() => setIsSporadicMode(false)}
className="px-5 py-2 rounded-full bg-primary-container text-on-primary-container text-sm font-medium hover:opacity-90 transition-opacity"
onClick={handleLogSporadicSet}
className={`px-5 py-2 rounded-full text-sm font-medium transition-all ${selectedExercise
? 'bg-primary-container text-on-primary-container hover:opacity-90 shadow-elevation-1'
: 'bg-surface-container-high text-on-surface-variant opacity-50 cursor-not-allowed'
}`}
disabled={!selectedExercise}
>
{t('done', lang)}
{t('log_set', lang)}
</button>
</div>
@@ -67,13 +86,20 @@ const SporadicView: React.FC<SporadicViewProps> = ({ tracker, lang }) => {
autoComplete="off"
type="text"
/>
<button
onClick={() => setIsCreating(true)}
className="absolute right-2 top-1/2 -translate-y-1/2 p-2 text-primary hover:bg-primary-container/20 rounded-full z-10"
>
<Plus size={24} />
</button>
{showSuggestions && (
<div className="absolute top-full left-0 w-full bg-surface-container rounded-xl shadow-elevation-3 overflow-hidden z-20 mt-1 max-h-60 overflow-y-auto animate-in fade-in slide-in-from-top-2">
{filteredExercises.length > 0 ? (
filteredExercises.map(ex => (
<button
key={ex.id}
onClick={() => {
onMouseDown={(e) => {
e.preventDefault(); // Prevent input blur
setSelectedExercise(ex);
setSearchQuery(ex.name);
setShowSuggestions(false);
@@ -140,8 +166,8 @@ const SporadicView: React.FC<SporadicViewProps> = ({ tracker, lang }) => {
<button
onClick={handleLogSporadicSet}
className={`w-full h-14 font-medium text-lg rounded-full shadow-elevation-2 hover:shadow-elevation-3 active:scale-[0.98] transition-all flex items-center justify-center gap-2 ${sporadicSuccess
? 'bg-green-500 text-white'
: 'bg-primary-container text-on-primary-container'
? 'bg-green-500 text-white'
: 'bg-primary-container text-on-primary-container'
}`}
>
{sporadicSuccess ? <CheckCircle size={24} /> : <Plus size={24} />}
@@ -150,6 +176,16 @@ const SporadicView: React.FC<SporadicViewProps> = ({ tracker, lang }) => {
</div>
)}
</div>
{isCreating && (
<ExerciseModal
isOpen={isCreating}
onClose={() => setIsCreating(false)}
onSave={handleCreateExercise}
lang={lang}
existingExercises={exercises}
/>
)}
</div>
);
};