aboutsummaryrefslogtreecommitdiff
path: root/src/client/util
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/util')
-rw-r--r--src/client/util/CalendarManager.scss18
-rw-r--r--src/client/util/CalendarManager.tsx82
-rw-r--r--src/client/util/CurrentUserUtils.ts2
3 files changed, 75 insertions, 27 deletions
diff --git a/src/client/util/CalendarManager.scss b/src/client/util/CalendarManager.scss
index 60610f298..114e19a0e 100644
--- a/src/client/util/CalendarManager.scss
+++ b/src/client/util/CalendarManager.scss
@@ -31,19 +31,20 @@
margin-top: 10px;
align-self: center;
width: 60%;
+ }
- .MuiFilledInput-input{
- padding: 10px;
- }
+ .description-container{
+ margin-top: 10px;
+ align-self: center;
+ width: 60%;
}
.date-range-picker-container{
margin-top: 5px;
- align-self:center;
-
- .react-date-range{
-
- }
+ align-self: center;
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
}
.create-button-container{
@@ -57,6 +58,5 @@
border-radius: 5px;
background-color: #EFF2F7;
}
-
}
}
diff --git a/src/client/util/CalendarManager.tsx b/src/client/util/CalendarManager.tsx
index 3872294db..d5d4203b1 100644
--- a/src/client/util/CalendarManager.tsx
+++ b/src/client/util/CalendarManager.tsx
@@ -10,16 +10,16 @@ import { MainViewModal } from '../views/MainViewModal';
import { TextField } from '@mui/material';
import Select from 'react-select';
import { SettingsManager } from './SettingsManager';
-import { DocCast, StrCast } from '../../fields/Types';
+import { DateCast, DocCast, StrCast } from '../../fields/Types';
import { SelectionManager } from './SelectionManager';
import { DocumentManager } from './DocumentManager';
import { DocData } from '../../fields/DocSymbols';
// import { DateRange, Range, RangeKeyDict } from 'react-date-range';
import { Button } from 'browndash-components';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { Provider, useProvider, defaultTheme } from '@adobe/react-spectrum';
-
-import { DateRangePicker } from '@adobe/react-spectrum';
+import { Provider, defaultTheme } from '@adobe/react-spectrum';
+import { DateValue } from '@internationalized/date';
+import { DateRangePicker, SpectrumDateRangePickerProps } from '@adobe/react-spectrum';
import { IconLookup, faPlus } from '@fortawesome/free-solid-svg-icons';
import { Docs } from '../documents/Documents';
import { ObservableReactComponent } from '../views/ObservableReactComponent';
@@ -33,7 +33,10 @@ interface CalendarSelectOptions {
value: string;
}
-const formatDateToString = (date: Date) => {
+const formatCalendarDateToString = (calendarDate: any) => {
+ console.log("Formatting the following date: ", calendarDate);
+ const date = new Date(calendarDate.year, calendarDate.month-1, calendarDate.day)
+ console.log(typeof date);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
@@ -121,19 +124,26 @@ export class CalendarManager extends ObservableReactComponent<{}> {
};
@action
- handleTextFieldChange = (event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => {
+ handleCalendarTitleChange = (event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => {
this.calendarName = event.target.value;
};
+ @action
+ handleCalendarDescriptionChange = (event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => {
+ this.calendarDescription = event.target.value;
+ }
+
// TODO: Make undoable
private addToCalendar = () => {
let docs = SelectionManager.Views.length < 2 ? [this.targetDoc] : SelectionManager.Views.map(docView => docView.Document);
const targetDoc = this.layoutDocAcls ? docs[0] : docs[0]?.[DocData]; // doc to add to calendar
+ console.log(targetDoc);
if (targetDoc) {
let calendar: Doc;
if (this.creationType === 'new-calendar') {
if (!this.existingCalendars.find(doc => StrCast(doc.title) === this.calendarName)) {
+ console.log('creating...')
calendar = Docs.Create.CalendarDocument(
{
title: this.calendarName,
@@ -141,6 +151,7 @@ export class CalendarManager extends ObservableReactComponent<{}> {
},
[]
);
+ console.log('successful calendar creation')
} else {
this.errorMessage = 'Calendar with this name already exists';
return;
@@ -155,15 +166,20 @@ export class CalendarManager extends ObservableReactComponent<{}> {
}
}
// Get start and end date strings
- const startDateStr = formatDateToString(this.selectedDateRange.start);
- const endDateStr = formatDateToString(this.selectedDateRange.end);
+ const startDateStr = formatCalendarDateToString(this.selectedDateRange.start);
+ const endDateStr = formatCalendarDateToString(this.selectedDateRange.end);
+
+ console.log("start date: ", startDateStr);
+ console.log("end date: ", endDateStr)
const subDocEmbedding = Doc.MakeEmbedding(targetDoc); // embedding
+ console.log("subdoc embedding", subDocEmbedding);
subDocEmbedding.embedContainer = calendar; // set embed container
subDocEmbedding.date_range = `${startDateStr}-${endDateStr}`; // set subDoc date range
Doc.AddDocToList(calendar, 'data', subDocEmbedding); // add embedded subDoc to calendar
+ console.log("my calendars: ", Doc.MyCalendars);
if (this.creationType === 'new-calendar') {
Doc.AddDocToList(Doc.MyCalendars, 'data', calendar); // add to new calendar to dashboard calendars
}
@@ -211,6 +227,7 @@ export class CalendarManager extends ObservableReactComponent<{}> {
@action
setSelectedDateRange = (range: any) => {
+ console.log("Range: ", range);
this.selectedDateRange = range;
};
@@ -220,9 +237,12 @@ export class CalendarManager extends ObservableReactComponent<{}> {
let startDate: Date | undefined;
let endDate: Date | undefined;
try {
- startDate = this.selectedDateRange[0].startDate;
- endDate = this.selectedDateRange[0].endDate;
+ startDate = this.selectedDateRange.start;
+ endDate = this.selectedDateRange.end;
+ console.log(startDate);
+ console.log(endDate)
} catch (e: any) {
+ console.log(e);
return false; // disabled
}
if (!startDate || !endDate) return false; // disabled if any is undefined
@@ -258,8 +278,9 @@ export class CalendarManager extends ObservableReactComponent<{}> {
{this.creationType === 'new-calendar' ? (
<TextField
fullWidth
- onChange={this.handleTextFieldChange}
- placeholder="Enter calendar name..."
+ onChange={this.handleCalendarTitleChange}
+ label='Calendar name'
+ placeholder='Enter a name...'
variant="filled"
style={{
backgroundColor: 'white',
@@ -298,14 +319,41 @@ export class CalendarManager extends ObservableReactComponent<{}> {
}}></Select>
)}
</div>
+ <div className='description-container'>
+ <TextField
+ fullWidth
+ multiline
+ label='Calendar description'
+ placeholder='Enter a description (optional)...'
+ onChange={this.handleCalendarDescriptionChange}
+ variant="filled"
+ style={{
+ backgroundColor: 'white',
+ color: 'black',
+ borderRadius: '5px',
+ }}
+ />
+ </div>
<div className="date-range-picker-container">
+ <div>Select a date range: </div>
<Provider theme={defaultTheme}>
- <DateRangePicker value={this.selectedDateRange} onChange={v => this.setSelectedDateRange(v)} label="Date range" />
+ <DateRangePicker
+ aria-label='Select a date range'
+ value={this.selectedDateRange}
+ onChange={v => this.setSelectedDateRange(v)}/>
</Provider>
</div>
- <div className="create-button-container">
- <Button active={this.createButtonActive} onClick={() => {}} text="Add to Calendar" iconPlacement="right" icon={<FontAwesomeIcon icon={faPlus as IconLookup} />} />
- </div>
+ {this.createButtonActive &&
+ <div className='create-button-container'>
+ <Button
+ onClick={() => this.addToCalendar()}
+ text="Add to Calendar"
+ iconPlacement="right"
+ icon={<FontAwesomeIcon icon={faPlus as IconLookup} />} />
+ </div>
+
+ }
+
</div>
);
}
@@ -313,4 +361,4 @@ export class CalendarManager extends ObservableReactComponent<{}> {
render() {
return <MainViewModal contents={this.calendarInterface} isDisplayed={this.isOpen} interactive={true} dialogueBoxDisplayedOpacity={this.dialogueBoxOpacity} overlayDisplayedOpacity={this.overlayOpacity} closeOnExternalClick={this.close} />;
}
-}
+} \ No newline at end of file
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 61a9fa7c2..f7070a862 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1022,4 +1022,4 @@ ScriptingGlobals.add(function IsExploreMode() { return DocumentView.ExploreMode;
ScriptingGlobals.add(function IsNoviceMode() { return Doc.noviceMode; }, "is Dash in novice mode");
ScriptingGlobals.add(function toggleComicMode() { Doc.UserDoc().renderStyle = Doc.UserDoc().renderStyle === "comic" ? undefined : "comic"; }, "switches between comic and normal document rendering");
ScriptingGlobals.add(function importDocument() { return CurrentUserUtils.importDocument(); }, "imports files from device directly into the import sidebar");
-ScriptingGlobals.add(function setInkToolDefaults() { Doc.ActiveTool = InkTool.None; });
+ScriptingGlobals.add(function setInkToolDefaults() { Doc.ActiveTool = InkTool.None; }); \ No newline at end of file
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 21:34:19 +0000