Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Changing of date doesn't work on prevClick, nextClick or onSelectDate #191

Open
1 task done
mm105 opened this issue Jan 9, 2025 · 0 comments
Open
1 task done
Labels
bug Something isn't working

Comments

@mm105
Copy link

mm105 commented Jan 9, 2025

Before Submitting

  • I have searched existing issues for similar bugs

Bug Description

When I click on prev/next buttons or select date from datepicker popup, dates in table are not changing accordingly. Thus I'm not able to iterate through weeks. Date between prev and next button is changing and is correct. Sample data used is from file

Not sure if I'm doing something wrong in callback functions or this is library internal bug?

image

Reproduction

import { Scheduler, SchedulerData, View, ViewType } from 'react-big-schedule';
import {
  eventsDemoData,
  resourcesDemoData,
} from './mockData/data';
import { useCallback, useState } from 'react';
import 'react-big-schedule/dist/css/style.css';

const INITIAL_DATE_DISPLAY = '2022-12-18';

export const MyScheduler = () => {
  const [schedulerData, setSchedulerData] = useState<SchedulerData>(() => {
    const newSchedulerData = new SchedulerData(
      INITIAL_DATE_DISPLAY,
      ViewType.Week,
      false,
      false,
      {
        besidesWidth: 300,
        eventItemPopoverTrigger: 'click',
        schedulerContentHeight: '100%',
        dragAndDropEnabled: false,
      },
    );

    newSchedulerData.setResources(resourcesDemoData);
    newSchedulerData.setEvents(eventsDemoData);

    return newSchedulerData;
  });

  const prevClick = useCallback((newData: SchedulerData) => {
    newData.prev();
    newData.setEvents(eventsDemoData);
    setSchedulerData(newData);
  }, []);

  const nextClick = useCallback((newData: SchedulerData) => {
    newData.next();
    newData.setEvents(eventsDemoData);
    setSchedulerData(newData);
  }, []);

  const onViewChange = useCallback((newData: SchedulerData, view: View) => {
    newData.setViewType(
      view.viewType,
      view.showAgenda,
      view.isEventPerspective,
    );
    newData.setEvents(eventsDemoData);
    setSchedulerData(newData);
  }, []);

  const onSelectDate = useCallback((newData: SchedulerData, date: string) => {
    newData.setDate(date);
    newData.setEvents(eventsDemoData);
    setSchedulerData(newData);
  }, []);

  return (
    <>
      <Scheduler
        schedulerData={schedulerData}
        nextClick={nextClick}
        prevClick={prevClick}
        onSelectDate={onSelectDate}
        onViewChange={onViewChange}
      />
    </>
  );
};

Steps to Reproduce

  1. Open the app
  2. Click on next or prev button
  3. Date between prev and next buttons is changed but dates in week/table are not, thus it's not possible to change the week

Browser

Chrome

Operating System

Windows 11

React Version

18.3.1

react-big-schedule Version

4.4.5

Additional Context

Only console errors/warnings are ones related to defaultProps, but I think this is not the issue.

image
image

@mm105 mm105 added the bug Something isn't working label Jan 9, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant