Skip to content

AtilaDev-team/useCalendar

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

26 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

useCalendar Hook 🚀 useCalendar version

made with expo

Updated to Expo SDK46

Blog post & example

To learn more about using this hook and see it in action, read the post!

To see a working example, check out my-expo-agenda which is a small example app developed to showcase how to use useCalendar hook.

What is it for

This is an easy hook to use expo-calendar. It allows you:

  • Get access permission to calendar
  • Open settings to give access permission to calendar
  • Create a new calendar and store it on your device
  • Add events to the calendar
  • Get all events
  • Get calendarId
  • Check if an event exists inside of the calendar created
  • Delete the calendar and all events inside of it

Install

npm install @atiladev/usecalendar

or

yarn add @atiladev/usecalendar

After installing the hook, you'll have to install the following libraries

$ npx expo install expo-calendar expo-localization @react-native-async-storage/async-storage

How to use it

Start by importing the useCalendar hook and then import the packages that you need to interact with the Calendar:

import useCalendar from '@atiladev/usecalendar';

const {
  addEventsToCalendar,
  createCalendar,
  deleteCalendar,
  getCalendarId,
  getEvents,
  getPermission,
  isThereEvents,
  openSettings,
} = useCalendar('App_Name', '#BADA55', 'Calendar_Name');

const createCalAndEvent = async () => {
  const granted = await getPermission();

  if (granted) {
    await createCalendar();
    let eventExists = await isThereEvents();

    if (!eventExists) {
      try {
        addEventsToCalendar('Event title', new Date(), new Date());
      } catch (e) {
        // Something went wrong
      }
    }
  } else {
    openSettings();
  }
};

const removeCalendar = () => deleteCalendar();

useCalendar

useCalendar(title: string, color: string, storeName: string);

useCalendar returns:

getPermission: () => Promise<Calendar[] | undefined>

createCalendar: () => Promise<void>

addEventsToCalendar: (eventTitle: string, eventStartDate: Date, eventEndDate: Date) => Promise<void>

deleteCalendar: () => Promise<void>

openSettings: () => Promise<void>

isThereEvents: () => Promise<boolean>

getEvents: () => Promise<Calendar.Event[]>

getCalendarId: () => Promise<any>

⭐️ If this hook is useful for you, please consider giving it a star. This motivates us to continue working on this and adding new features. Thanks!

Developed with ❤️ by Leandro Favre (AtilaDev)