phoenix/schedtxt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Got the flow almost working. Can schedule, but nothing sent

Browse Source
This commit is contained in:
phoenix
2026-06-30 10:40:46 -04:00
parent 46f96fc423
commit c93a581924
5 changed files with 176 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/SendMessageWizard/ConfirmationStep.jsx
+6
View File
@@ -5,6 +5,7 @@ function ConfirmationStep({
selectedContacts,
createdMessage,
message,
scheduledTime,
isSubmitting,
}) {
// In a real app, you might fetch full contact details here
@@ -88,6 +89,11 @@ function ConfirmationStep({
</div>
</div>
{ /* Scheduled time Section */}
<div>
Scheduled time: {scheduledTime ? scheduledTime.toISOString() : 'No schedule date'}
</div>
{/* Summary Section */}
<div className={styles.confirmationSection}>
<div className={styles.sectionHeader}>
src/components/SendMessageWizard/FutureTimeForm.jsx
+89
View File
@@ -0,0 +1,89 @@
import React, { useState } from 'react';
function FutureTimeForm({scheduledTime, setScheduledTime}) {
const [selectedTime, setSelectedTime] = useState(new Date());
const [error, setError] = useState('');
const [success, setSuccess] = useState('');
const handleTimeChange = (e) => {
setSelectedTime(e.target.value);
setScheduledTime(new Date(e.target.value));
// Clear errors when user starts typing again
console.log(`Scheduled Time: ${scheduledTime}`)
console.log(`Selected Time: ${selectedTime}`)
setError('');
setSuccess('');
};
const validateAndSubmit = (e) => {
e.preventDefault();
if (!selectedTime) {
setError('Please select a date and time.');
return;
}
console.log(`Time: ${selectedTime}`)
const now = new Date();
const inputDate = new Date(selectedTime);
// Calculate the minimum allowed time (Now + 10 minutes)
const minAllowedTime = new Date(now.getTime() + 10 * 60000);
if (inputDate < minAllowedTime) {
setError('The time must be at least 10 minutes in the future.');
setSuccess('');
setScheduledTime(null);
} else {
setError('');
setSuccess('Time validated successfully!');
setScheduledTime(inputDate);
console.log('Form submitted with time (selected):', selectedTime);
console.log('Form submitted with time (scheduled):', scheduledTime);
}
};
return (
<div style={{ maxWidth: '400px', margin: '2rem auto', fontFamily: 'Arial' }}>
<h2>Schedule Event</h2>
<form onSubmit={validateAndSubmit}>
<div style={{ marginBottom: '1rem' }}>
<label htmlFor="future-time" style={{ display: 'block', marginBottom: '0.5rem' }}>
Select Date and Time:
</label>
<input
type="datetime-local"
id="future-time"
value={selectedTime}
onChange={handleTimeChange}
style={{
padding: '8px',
width: '100%',
borderColor: error ? 'red' : '#ccc'
}}
/>
</div>
{error && <p style={{ color: 'red', fontSize: '0.9rem' }}>{error}</p>}
{success && <p style={{ color: 'green', fontSize: '0.9rem' }}>{success}</p>}
<button
type="submit"
style={{
padding: '10px 20px',
backgroundColor: '#007BFF',
color: 'white',
border: 'none',
borderRadius: '4px',
cursor: 'pointer'
}}
>
Submit
</button>
</form>
</div>
);
};
export default FutureTimeForm;
src/components/SendMessageWizard/SendMessageWizardModal.jsx
+8
View File
@@ -1,5 +1,6 @@
import React from 'react';
import ContactSelection from './ContactSelection';
import FutureTimeForm from './FutureTimeForm';
import MessageForm from './MessageForm';
import ConfirmationStep from './ConfirmationStep';
import StepNavigation from './StepNavigation';
@@ -31,12 +32,19 @@ function SendMessageWizardModal({ isOpen, onClose, onComplete }) {
);
case 'schedule':
// TODO: Add form for schedule step
return (
<FutureTimeForm
scheduledTime={wizard.scheduledTime}
setScheduledTime={wizard.setScheduledTime}
/>
);
case 'confirm':
return (
<ConfirmationStep
selectedContacts={wizard.selectedContacts}
createdMessage={wizard.createdMessage}
message={wizard.message}
scheduledTime={wizard.scheduledTime}
isSubmitting={wizard.isSubmitting}
/>
);
src/components/SendMessageWizard/StepNavigation.jsx
+1 -1
View File
@@ -49,7 +49,7 @@ function StepNavigation({
disabled={!canProceed}
className={`${styles.navButton} ${styles.nextButton}`}
>
{currentStep === 'select' ? 'Next' : 'Review'}
{currentStep === 'schedule' ? 'Next' : 'Review'}
</button>
</>
);
src/components/SendMessageWizard/useSendMessageWizard.js
+72 -12
View File
@@ -10,6 +10,7 @@ const useSendMessageWizard = () => {
const [state, setState] = useState({
step: 'select',
selectedContacts: [],
scheduledTime: null,
message: '',
createdMessage: null,
isSubmitting: false,
@@ -28,13 +29,26 @@ const useSendMessageWizard = () => {
return state.message.trim().length > 0;
case 'schedule':
// TODO: Handle this
return false;
// return state.scheduledTime != null;
console.log('Checking to see if schedule can go to the next step');
console.log(state.scheduledTime);
console.log(state.message);
// const result = state.scheduledTime instanceof Date && isNaN(state.scheduledTime.getTime());
if (state.scheduledTime == null) {
return false;
}
console.log('Scheduled time is not null');
// const result = isNaN(state.scheduledTime.getTime());
const result = state.scheduledTime instanceof Date && isNaN(state.scheduledTime.getTime());
console.log(result);
console.log(state.scheduledTime);
return !result;
case 'confirm':
return true;
default:
return false;
}
}, [state.step, state.selectedContacts.length, state.message]);
}, [state.step, state.selectedContacts.length, state.message, state.scheduledTime]);
const canGoBack = state.step !== 'select';
@@ -65,6 +79,11 @@ const useSendMessageWizard = () => {
setState((prev) => ({ ...prev, createdMessage: message }));
};
const setScheduledTime = (selectedTime) => {
console.log('Setting scheduled time');
setState((prev) => ({ ...prev, scheduledTime: selectedTime }));
};
const nextStep = () => {
if (!canProceedToNextStep()) return;
@@ -75,16 +94,34 @@ const useSendMessageWizard = () => {
console.log('Scheduled Checked');
}
console.log(`Step: ${state.step}`);
// TODO: Handle navigation for schedule form
const stepOrder = ['select', 'message', 'schedule', 'confirm', 'result'];
const currentIndex = stepOrder.indexOf(state.step);
if (currentIndex < stepOrder.length - 1) {
setState((prev) => ({
...prev,
step: stepOrder[currentIndex + 1],
submissionError: null,
}));
if (state.step === 'message') {
if (state.isScheduled) {
setState((prev) => ({
...prev,
step: stepOrder[currentIndex + 1],
submissionError: null,
}));
} else {
setState((prev) => ({
...prev,
step: stepOrder[currentIndex + 2],
submissionError: null,
}));
}
} else {
setState((prev) => ({
...prev,
step: stepOrder[currentIndex + 1],
submissionError: null,
}));
}
}
};
@@ -92,12 +129,30 @@ const useSendMessageWizard = () => {
// TODO: Handle navigation for schedule form
const stepOrder = ['select', 'message', 'schedule', 'confirm', 'result'];
const currentIndex = stepOrder.indexOf(state.step);
console.log(`Stepping back: ${state.step} isSheduled: ${state.isScheduled}`);
if (currentIndex > 0) {
setState((prev) => ({
...prev,
step: stepOrder[currentIndex - 1],
submissionError: null,
}));
if (state.step === 'confirm') {
if (state.isScheduled) {
setState((prev) => ({
...prev,
step: stepOrder[currentIndex - 1],
submissionError: null,
}));
} else {
setState((prev) => ({
...prev,
step: stepOrder[currentIndex - 2],
submissionError: null,
}));
}
} else {
setState((prev) => ({
...prev,
step: stepOrder[currentIndex - 1],
submissionError: null,
}));
}
}
};
@@ -132,6 +187,7 @@ const useSendMessageWizard = () => {
step: 'result',
isSubmitting: false,
isScheduled: false,
scheduledTime: null,
}));
}
} catch (error) {
@@ -145,6 +201,7 @@ const useSendMessageWizard = () => {
submissionError: error.message || 'Failed to send messages',
isSubmitting: false,
isScheduled: false,
scheduledTime: null,
}));
}
};
@@ -154,6 +211,7 @@ const useSendMessageWizard = () => {
setState({
step: 'select',
selectedContacts: [],
scheduledTime: null,
message: '',
createdMessage: null,
isSubmitting: false,
@@ -171,6 +229,7 @@ const useSendMessageWizard = () => {
// Getters
currentStep: state.step,
selectedContacts: state.selectedContacts,
scheduledTime: state.scheduledTime,
message: state.message,
createdMessage: state.createdMessage,
isSubmitting: state.isSubmitting,
@@ -184,6 +243,7 @@ const useSendMessageWizard = () => {
toggleScheduled,
setMessage,
setCreatedMessage,
setScheduledTime,
nextStep,
prevStep,
submit,