PCFControls
PCFControls copied to clipboard
rwilson504
[FEATURE] [Calendar] Parameterise the Time Range in the TimeGris in Day ViewType
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 ?
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
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.
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: @.***>
@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
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.
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.
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) /> ); } ` The IRL of the codesandbox is as below https://codesandbox.io/s/keen-mopsa-wb63ky?file=/src/App.js:0-1504
I'm going to try to amend the PCF code as parametrised start time and end time, if it works, I will raise the PR for your review.
@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
@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.