[FEATURE] [Calendar] Parameterise the Time Range in the TimeGris in Day ViewType

[SatkunamSuganthar]

Which PCF Component Calendar

Is your feature request related to a problem? Please describe. Currently a Day View range from 12 AM to 11 PM. Is it possible to set the custom range based on the Business Hours. (8 AM to 6 PM)

Describe the solution you'd like Would like to be parameterised and used should able to select the start and end time in TimeGrid Library from React Big Calendar.

@rwilson504 / @powerappsdev / @seniormeow Is it possible to achieve ?

[ArtKarp]

Yes. There is a property to set the grid default start time. I am not at my computer right now so I don’t have the exact name.

-Art

On Wed, Jul 19, 2023 at 4:51 AM SatkunamSuganthar @.***> wrote:

Which PCF Component Calendar

Is your feature request related to a problem? Please describe. Currently a Day View range from 12 AM to 11 PM. Is it possible to set the custom range based on the Business Hours. (8 AM to 6 PM)

[image: image] https://user-images.githubusercontent.com/97066265/254564062-2156c792-a59a-43d4-a920-2beff1ea26b8.png

Describe the solution you'd like Would like to be parameterised and used should able to select the start and end time in TimeGrid Library from React Big Calendar.

@rwilson504 https://github.com/rwilson504 / @powerappsdev https://github.com/powerappsdev / @seniormeow https://github.com/seniormeow Is it possible to achieve ?

— Reply to this email directly, view it on GitHub https://github.com/rwilson504/PCFControls/issues/317, or unsubscribe https://github.com/notifications/unsubscribe-auth/AGEB6IW7ZZXGXZB5U6E5P3DXQ7C4LANCNFSM6AAAAAA2PZSTPU . You are receiving this because you are subscribed to this thread.Message ID: @.***>

-- Sent from my mobile phone

[SatkunamSuganthar]

Thanks @ArtKarp for the reply. Is it the Min and Max ?

[rwilson504]

Currently there is no way set the start/end time for the agenda view, but you can have the view automatically scroll to a certain time of day.

Use the 'Calendar Scroll To Time' property. Enter the hour of the day (0 - 23) you would like the calendar to automatically scroll to for the day view."

For instance, if the typical workday starts at 8AM then enter 8 into that property.

[seniormeow]

Why am I in this discussion? I do not develop this app. Please remove my git from this repo.

On Fri, Jul 21, 2023 at 6:27 PM Rick Wilson @.***> wrote:

Currently there is no way set the start/end time for the agenda view, but you can have the view automatically scroll to a certain time of day.

Use the 'Calendar Scroll To Time' property. Enter the hour of the day (0 - 23) you would like the calendar to automatically scroll to for the day view."

For instance, if the typical workday starts at 8AM then enter 8 into that property.

— Reply to this email directly, view it on GitHub https://github.com/rwilson504/PCFControls/issues/317#issuecomment-1646298665, or unsubscribe https://github.com/notifications/unsubscribe-auth/AIQZLMZIXYZ5TDHDIOEF7V3XRL657ANCNFSM6AAAAAA2PZSTPU . You are receiving this because you were mentioned.Message ID: @.***>

[rwilson504]

@seniormeow you are not marked as a Collaborator on the project. Are you sure you don't just have a Watch turned on for the repo.

https://docs.github.com/en/account-and-profile/managing-subscriptions-and-notifications-on-github/managing-subscriptions-for-activity-on-github/managing-your-subscriptions#unwatching-repositories

[SatkunamSuganthar]

Currently there is no way set the start/end time for the agenda view, but you can have the view automatically scroll to a certain time of day.

Use the 'Calendar Scroll To Time' property. Enter the hour of the day (0 - 23) you would like the calendar to automatically scroll to for the day view."

For instance, if the typical workday starts at 8AM then enter 8 into that property.

Thanks @rwilson504.

I have explored that options Scroll to Time as you mentioned. But my client does not want that. We are using work_week view, I believe it is not possible to achieve in this too.

[rwilson504]

Based on the docs from React-Big-Calendar I also don't believe this is possible. I'm going to close this for now, if that library ever gets updated with that capability feel free to re-open.

[SatkunamSuganthar]

Hi @rwilson504, We are using the work_week view and looks like it is possible to achieve.

See the below Code in the Sanbox

`import { Calendar, momentLocalizer } from "react-big-calendar"; import "react-big-calendar/lib/css/react-big-calendar.css"; import moment from "moment"; import "moment-timezone";

// Calendar should show dates in the GMT+9 (Asian/Tokyo) time zone // instead of in the client time zone. moment.tz.setDefault("Australia/Sydney");

const localizer = momentLocalizer(moment);

export default function App() {

const minTime = new Date(); minTime.setHours(9, 0, 0); const maxTime = new Date(); maxTime.setHours(18, 0, 0);

const events = [ // Single day event (start of day) ✅ { title: "Event 1", start: moment("2022-01-03T09:00:00").toDate(), end: moment("2022-01-03T18:00:00").toDate() }, // Single day event (end of day) ✅ { title: "Event 2", start: moment("2022-01-03T09:00:00").toDate(), end: moment("2022-01-03T18:00:00").toDate() }, // Should span from 2022-01-10 00:00:00 to 2022-01-14 23:59:59 ❌ // Does not work correctly when the client time zone is set to // America/Los_Angeles, Europe/Brussels. { title: "Event 3 (10/01 - 14/01)",
start: moment("2023-07-22T09:00:00").toDate(), end: moment("2022-07-22T18:00:00").toDate() } ];

return ( <div style={{ height: 700 }}> <Calendar localizer={localizer} events={events} min={minTime} // Set the minimum time (start of the day) max={maxTime} // Set the maximum time (end of the day) />

[rwilson504]

@SatkunamSuganthar, I tried out that code above in that sandbox and when I click on the week/work week/day views, I get that the index is out of range. The agenda and month views seem to work.

https://codesandbox.io/s/quiet-violet-89nklg

[SatkunamSuganthar]

@rwilson504 Interesting, it perfectly works for me. I do not think it is related to the Library. could be specific to the Sanbox.

I think it will work with PCF control if I add correct code in your PCF control.