Skip to content

Commit

Permalink
Merge pull request #343 from aldabil21/disable-editor-issue
Browse files Browse the repository at this point in the history
Remove disable editor
  • Loading branch information
aldabil21 committed Apr 9, 2024
2 parents 69050cc + 7502d0c commit ba945c3
Show file tree
Hide file tree
Showing 6 changed files with 22 additions and 15 deletions.
7 changes: 3 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,6 @@ All props are _optional_
| viewerExtraComponent | Function(fields, event) OR Component. Additional component in event viewer popper |
| viewerTitleComponent | Function(event). Helper function to render custom title in event popper |
| disableViewer | boolean. If true, the viewer popover will be disabled globally |
| disableEditor | boolean. If true, the editor modal will be disabled globally |
| resources | Array. Resources array to split event views with resources <br>_Example_ <pre>{<br>assignee: 1,<br>text: "User One", <br>subtext: "Sales Manager", <br>avatar: "https://picsum.photos/200/300", <br>color: "#ab2d2d",<br> }</pre> |
| resourceFields | Object. Map the resources correct fields. <br>_Example_:<pre>{<br>idField: "admin_id", <br>textField: "title", <br>subTextField: "mobile",<br>avatarField: "title", <br>colorField: "background",<br>}</pre> |
| resourceHeaderComponent | Function(resource). Override header component of resource |
Expand All @@ -84,12 +83,12 @@ All props are _optional_
| translations | Object. Translations view props. <br> _default_: <pre>{<br> navigation: {<br> month: "Month",<br> week: "Week",<br> day: "Day",<br> today: "Today"<br> agenda: "Agenda"<br> },<br> form: {<br> addTitle: "Add Event",<br> editTitle: "Edit Event",<br> confirm: "Confirm",<br> delete: "Delete",<br> cancel: "Cancel"<br> },<br> event: {<br> title: "Title",<br> start: "Start",<br> end: "End",<br> allDay: "All Day"<br>},<br> validation: {<br> required: "Required",<br> invalidEmail: "Invalid Email",<br> onlyNumbers: "Only Numbers Allowed",<br> min: "Minimum {{min}} letters",<br> max: "Maximum {{max}} letters"<br> },<br> moreEvents: "More...",<br> noDataToDisplay: "No data to display",<br> loading: "Loading..."<br>}</pre> |
| onEventDrop | Function(event: DragEvent<HTMLButtonElement>, droppedOn: Date, updatedEvent: ProcessedEvent, originalEvent: ProcessedEvent). Return a promise, used to update remote data of the dropped event. Return an event to update state internally, or void if event state is managed within component |
| onEventClick | Function(event: ProcessedEvent): void. Triggered when an event item is clicked |
| onEventEdit | Function(event: ProcessedEvent): void. Triggered when an event item is being edited from the popover |
| onEventEdit | Function(event: ProcessedEvent): void. Triggered when an event item is being edited from the popover |
| onCellClick | Function(start: Date, end: Date, resourceKey?: string, resourceVal?: string | number): void. Triggered when a cell in the grid is clicked |
| onSelectedDateChange | Function(date: Date): void. Triggered when the `selectedDate` prop changes by navigation date picker or `today` button |
| onViewChange | Function(view: View, agenda?: boolean): void. Triggered when navigation view changes |
| stickyNavigation | If true, the navigation controller bar will be sticky |
| onClickMore | Function(date: Date, goToDay: Function(date: Date): void): void. Triggered when the "More..." button is clicked, it receives the date and a `goToDay` function that shows a day view for a specfic date. |
| onCellClick | Function(start: Date, end: Date, resourceKey?: string, resourceVal?: string | number): void. Triggered when a cell in the grid is clicked |
| onClickMore | Function(date: Date, goToDay: Function(date: Date): void): void. Triggered when the "More..." button is clicked, it receives the date and a `goToDay` function that shows a day view for a specfic date. |

<br>

Expand Down
2 changes: 2 additions & 0 deletions src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ function App() {
ref={calendarRef}
events={EVENTS}
// events={generateRandomEvents(200)}
editable={false}
// disableViewer
/>
);
}
Expand Down
3 changes: 2 additions & 1 deletion src/lib/components/events/EventItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,8 @@ const EventItem = ({ event, multiday, hasPrev, hasNext, showdate = true }: Event
onEventClick(event);
}
}}
disabled={event.disabled}
focusRipple
disabled={disableViewer || event.disabled}
>
<div {...dragProps} draggable={isDraggable}>
{item}
Expand Down
8 changes: 5 additions & 3 deletions src/lib/components/events/EventItemPopover.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ const EventItemPopover = ({ anchorEl, event, onTriggerViewer }: Props) => {
viewerTitleComponent,
hourFormat,
translations,
disableEditor,
onEventEdit,
} = useStore();
const theme = useTheme();
Expand Down Expand Up @@ -113,8 +112,11 @@ const EventItemPopover = ({ anchorEl, event, onTriggerViewer }: Props) => {
onDelete={handleDelete}
onEdit={() => {
onTriggerViewer();
!disableEditor && triggerDialog(true, event);
onEventEdit && onEventEdit(event);
triggerDialog(true, event);

if (onEventEdit && typeof onEventEdit === "function") {
onEventEdit(event);
}
}}
/>
</div>
Expand Down
11 changes: 8 additions & 3 deletions src/lib/hooks/useCellAttributes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,19 +9,24 @@ interface Props {
resourceVal: string | number;
}
export const useCellAttributes = ({ start, end, resourceKey, resourceVal }: Props) => {
const { triggerDialog, onCellClick, onDrop, currentDragged, setCurrentDragged, disableEditor } =
const { triggerDialog, onCellClick, onDrop, currentDragged, setCurrentDragged, editable } =
useStore();
const theme = useTheme();

return {
disabled: !editable,
onClick: () => {
!disableEditor &&
if (editable) {
triggerDialog(true, {
start,
end,
[resourceKey]: resourceVal,
});
onCellClick && onCellClick(start, end, resourceKey, resourceVal);
}

if (onCellClick && typeof onCellClick === "function") {
onCellClick(start, end, resourceKey, resourceVal);
}
},
onDragOver: (e: DragEvent<HTMLButtonElement>) => {
e.preventDefault();
Expand Down
6 changes: 2 additions & 4 deletions src/lib/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -244,8 +244,6 @@ export interface SchedulerProps {
viewerTitleComponent?(event: ProcessedEvent): JSX.Element;
/** if true, the viewer popover will be disabled globally */
disableViewer?: boolean;
/** if true, the editor modal will be disabled globally */
disableEditor?: boolean;
/**Resources array to split event views with resources */
resources: DefaultRecourse[];
/**Map resources fields */
Expand Down Expand Up @@ -292,7 +290,7 @@ export interface SchedulerProps {
*/
onEventClick?(event: ProcessedEvent): void;
/**
*
* Triggered when an event item is being edited from the popover
*/
onEventEdit?(event: ProcessedEvent): void;
/**
Expand All @@ -301,7 +299,7 @@ export interface SchedulerProps {
*/
deletable?: boolean;
/**
* If event is editable, applied to all events globally, overridden by event specific editable prop
* If calendar is editable, applied to all events/cells globally, overridden by event specific editable prop
* @default true
*/
editable?: boolean;
Expand Down

0 comments on commit ba945c3

Please sign in to comment.