How to Show Local Notification Daily with Different Contents

I have a requirement to show a daily notification every day on a user specified time with different content for the notification title and body. Also, note that this notification should happen even if the app is not running. Following I’ve added the code which I’ve used to generate the scheduled notifications. The important thing is that I want to use this in an expo managed workflow.

import React, { useEffect } from 'react';
import { useTheme } from '@react-navigation/native';
import {
  View, Text, Keyboard, TextInput, StyleSheet,
} from 'react-native';
import * as Permissions from 'expo-permissions';
import * as Notifications from 'expo-notifications';

import Constants from 'expo-constants';

const NotificationScreen = () => {
  const onSubmit = async (e) => {
    Keyboard.dismiss();
    const value = e.nativeEvent.text;
    const id = await Notifications.scheduleNotificationAsync({
      content: {
        title: "Time's up!",
        body: 'Change sides!',
      },
      trigger: {
        seconds: Number(value),
      },
    });

    console.log('ID : ', id);
  };

  const { colors } = useTheme();

  useEffect(() => {
    async function getPermission() {
      const result = await Permissions.askAsync(Permissions.NOTIFICATIONS);
      if (Constants.isDevice && result.status === 'granted') {
        console.log('Notification permissions granted.');
      }
    }
    getPermission();
  }, []);

  return (
    <View style={styles.container}>
      <Text style={{ color: colors.text }}>Notification Screen</Text>
      <TextInput
        style={styles.input}
        onSubmitEditing={onSubmit}
        placeholder="time in ms"
      />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    paddingTop: 23,
  },
  // eslint-disable-next-line react-native/no-color-literals
  input: {
    margin: 15,
    height: 40,
    borderColor: '#7a42f4',
    borderWidth: 1,
  },
});

export default NotificationScreen;

@chamikabm Any updates ?