refactor: Rename SDK name to @sirenapp/react-native-inbox and updated example app

Author: abhay-keyvalue

README.md

@@ -2,27 +2,27 @@
 
 ## Overview
 
-The `@siren/react-native-inbox` sdk is a comprehensive and customizable React Native UI kit for displaying and managing notifications. This documentation provides comprehensive information on how to install, configure, and use the sdk effectively.
+The `@sirenapp/react-native-inbox` sdk is a comprehensive and customizable React Native UI kit for displaying and managing notifications. This documentation provides comprehensive information on how to install, configure, and use the sdk effectively.
 
 ## 1. Installation
 
 You can install the react sdk from npm 
 
 ```bash
-npm @siren/react-native-inbox
+npm @sirenapp/react-native-inbox
 ```
 or from yarn
 
 ```bash
-yarn @siren/react-native-inbox
+yarn @sirenapp/react-native-inbox
 ```
 
 ## 2. Configuration
 ### 2.1 Initialization
 Initialize the sdk with user token and recipient id. Wrap the provider around your App's root.
 
 ```js
-import { SirenProvider } from '@siren/react-native-inbox';
+import { SirenProvider } from '@sirenapp/react-native-inbox';
 
 const config = {
   userToken: 'your_user_token',
@@ -39,7 +39,7 @@ Once the provider is configured, next step is to configure the notification icon
 
 This component consists of a notification icon along with a badge to display the number of unviewed notifications
 ```js
-import { SirenInboxIcon } from '@siren/react-native-inbox';
+import { SirenInboxIcon } from '@sirenapp/react-native-inbox';
 
  <SirenInboxIcon />
 
@@ -98,7 +98,7 @@ Here are the custom style options for the notification icon:
 Inbox is a paginated list view for displaying notifications.
 
 ```js
-import { SirenInbox } from '@siren/react-native-inbox';
+import { SirenInbox } from '@sirenapp/react-native-inbox';
 
 <SirenInbox />
 
@@ -222,7 +222,7 @@ Here are the custom style options for the notification inbox:
 `useSiren` is a hook that provides utility functions for modifying notifications.
 
 ```js
-import { useSiren } from '@siren/react-native-inbox';
+import { useSiren } from '@sirenapp/react-native-inbox';
 
 function MyComponent() {
   const { markAsRead, deleteNotification } = useSiren();
@@ -268,7 +268,7 @@ Here's a basic example to help you get started
 
 import React from 'react';
 import {SafeAreaView} from 'react-native';
-import {SirenInbox,SirenInboxIcon,SirenProvider} from '@siren/react-native-inbox';
+import {SirenInbox,SirenInboxIcon,SirenProvider} from '@sirenapp/react-native-inbox';
 
 function App(): React.JSX.Element {
 

example/App.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SirenProvider } from '@siren/react-native-inbox';
+import { SirenProvider } from '@sirenapp/react-native-inbox';
 import { NavigationContainer } from '@react-navigation/native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 
@@ -24,10 +24,10 @@ function MyStack() {
 }
 
 function App(): React.JSX.Element {
-  const [config, setConfig] = React.useState({
-    userToken: '227047349b3044fbac7c24fdf5537c44',
-    recipientId: '551cd601-65b3-41b2-bbce-bbd15908992f'
-  });
+  const config = {
+    userToken: 'YOUR_USER_TOKEN',
+    recipientId: 'YOUR_RECIPIENT_ID',
+  };
 
   return (
     <NavigationContainer>

example/package-lock.json

@@ -13,7 +13,7 @@
     "@react-navigation/bottom-tabs": "^6.5.14",
     "@react-navigation/native": "^6.1.12",
     "@react-navigation/native-stack": "^6.9.20",
-    "@siren/react-native-inbox": "siren-sdk01.tgz",
+    "@sirenapp/react-native-inbox": "^1.0.0",
     "react": "18.2.0",
     "react-native": "0.73.4",
     "react-native-modal": "^13.0.1",

example/package.json

@@ -9,7 +9,7 @@ import {
   StyleSheet,
   Image
 } from 'react-native';
-import { SirenInboxIcon } from '@siren/react-native-inbox';
+import { SirenInboxIcon } from '@sirenapp/react-native-inbox';
 import { useNavigation } from '@react-navigation/native';
 
 import NetworkLogDebugModal from './networkLogDebugModal';

example/screens/home.tsx

@@ -9,8 +9,8 @@ import {
   StyleSheet
 } from 'react-native';
 
-import { SirenInbox, useSiren } from '@siren/react-native-inbox';
-import type { NotificationDataType, SirenErrorType } from 'test_notification/dist/esm/types';
+import { SirenInbox, useSiren } from '@sirenapp/react-native-inbox';
+import type { NotificationDataType, SirenErrorType } from '@sirenapp/js-sdk/dist/esm/types';
 import { useNavigation } from '@react-navigation/native';
 import NetworkLogDebugModal from './networkLogDebugModal';
 

example/screens/notifications.tsx

@@ -1,6 +1,6 @@
 {
-  "name": "@siren/react-native-inbox",
-  "version": "1.0.0",
+  "name": "@sirenapp/react-native-inbox",
+  "version": "0.0.1",
   "description": "React Native SDK tailored for creating and managing in-app notification inboxes.",
   "main": "dist/module/index",
   "types": "dist/typescript/index.d.ts",