[INJI-691] replace restore icon with svg image

Signed-off-by: KiruthikaJeyashankar <81218987+KiruthikaJeyashankar@users.noreply.github.com>

assets/Permission_Denied.svg

@@ -0,0 +1,23 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="153" height="153" viewBox="0 0 153 153">
+  <defs>
+    <filter id="Rectangle_6853" x="0" y="0" width="153" height="153" filterUnits="userSpaceOnUse">
+      <feOffset dy="3" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="7.5" result="blur"/>
+      <feFlood flood-opacity="0.059"/>
+      <feComposite operator="in" in2="blur"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+  </defs>
+  <g id="success_message_icon" transform="translate(22 19.5)">
+    <g transform="matrix(1, 0, 0, 1, -22, -19.5)" filter="url(#Rectangle_6853)">
+      <rect id="Rectangle_6853-2" data-name="Rectangle 6853" width="108" height="108" rx="54" transform="translate(22.5 19.5)" fill="#fff"/>
+    </g>
+    <rect id="Rectangle_6846" data-name="Rectangle 6846" width="96" height="96" rx="48" transform="translate(6.5 6)" fill="rgba(157,32,32,0.08)"/>
+    <g id="pending_activation_icon" transform="translate(-1328.424 -1133.959)">
+      <g id="Group_57154" data-name="Group 57154" transform="translate(1366.33 1167.162)">
+        <path id="gpp_maybe_FILL0_wght400_GRAD0_opsz48" d="M24.594,45.435a20.364,20.364,0,0,1-11.927-8.427A24.6,24.6,0,0,1,8,22.514V10.173L24.594,3.95l16.594,6.223V22.514a24.6,24.6,0,0,1-4.667,14.494A20.364,20.364,0,0,1,24.594,45.435Z" transform="translate(-8 -3.95)" fill="#db2e2e"/>
+        <path id="gpp_maybe_FILL0_wght400_GRAD0_opsz48-2" data-name="gpp_maybe_FILL0_wght400_GRAD0_opsz48" d="M16.9,26.751a1.768,1.768,0,1,0-1.243-.518A1.695,1.695,0,0,0,16.9,26.751Zm-1.553-6.939h3.107V9.093H15.347ZM16.9,19.19Z" transform="translate(-0.306 1.601)" fill="#fff"/>
+      </g>
+    </g>
+  </g>
+</svg>

assets/Restore.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24.994" height="24.994" viewBox="0 0 24.994 24.994">
+  <path id="history_FILL0_wght400_GRAD0_opsz48" d="M132.393-815.006a11.869,11.869,0,0,1-8.783-3.662,12.168,12.168,0,0,1-3.61-8.869h2.083a10.191,10.191,0,0,0,2.985,7.394,9.844,9.844,0,0,0,7.325,3.055,10.1,10.1,0,0,0,7.464-3.09,10.268,10.268,0,0,0,3.055-7.5,9.7,9.7,0,0,0-3.09-7.273,10.34,10.34,0,0,0-7.429-2.968,9.44,9.44,0,0,0-4.426,1.076,12.073,12.073,0,0,0-3.593,2.847h3.645v2.083h-7.255v-7.221h2.083v3.68a13.211,13.211,0,0,1,4.287-3.333A11.809,11.809,0,0,1,132.393-840a12.4,12.4,0,0,1,4.895.972,12.825,12.825,0,0,1,4.009,2.656,12.467,12.467,0,0,1,2.708,3.94,11.968,11.968,0,0,1,.989,4.86,12.214,12.214,0,0,1-.989,4.895,12.565,12.565,0,0,1-2.708,3.992,12.92,12.92,0,0,1-4.009,2.69A12.213,12.213,0,0,1,132.393-815.006Zm4.443-6.839-5.346-5.277v-7.429h2.083v6.561l4.756,4.652Z" transform="translate(-120 840)" fill="#f2801d"/>
+</svg>

components/SectionLayout.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import {View} from 'react-native';
-import {ListItem} from 'react-native-elements';
 import {Column, Row, Text} from './ui';
 import {Theme} from './ui/styleUtils';
 
@@ -36,7 +35,6 @@ export const SectionLayout: React.FC<SectionLayoutProps> = ({
           }}>
           {headerText}
         </Text>
-        <ListItem.Subtitle></ListItem.Subtitle>
       </Row>
       <Row
         style={{
@@ -52,7 +50,7 @@ export const SectionLayout: React.FC<SectionLayoutProps> = ({
 };
 
 export type SectionLayoutProps = {
-  headerIcon?: React.ReactNode;
+  headerIcon: React.ReactNode;
   headerText: string;
   children: React.ReactNode;
 };

components/ui/svg.tsx

@@ -27,6 +27,8 @@ import GoogleDriveIcon from '../../assets/google-drive-28.svg';
 import {displayType} from '../../machines/issuersMachine';
 import {IssuerProps} from '../openId4VCI/Issuer';
 import Backup from '../../assets/Backup.svg';
+import Restore from '../../assets/Restore.svg';
+import PermissionDenied from '../../assets/Permission_Denied.svg';
 import {
   EsignetMosipVCItemContentProps,
   ExistingMosipVCItemContentProps,
@@ -34,7 +36,7 @@ import {
 import {VCMetadata} from '../../shared/VCMetadata';
 import {VerifiableCredential} from '../../types/VC/ExistingMosipVC/vc';
 import {ProfileIcon} from '../ProfileIcon';
-import CloudUploadDoneIcon from "../../assets/Cloud_Upload_Done_Icon.svg";
+import CloudUploadDoneIcon from '../../assets/Cloud_Upload_Done_Icon.svg';
 
 export class SvgImage {
   static MosipLogo(props: LogoProps) {
@@ -237,6 +239,7 @@ export class SvgImage {
   static DataBackupIcon(width, height) {
     return (
       <Backup
+        {...testIDProps('dataBackupIcon')}
         color1={Theme.Colors.linearGradientStart}
         color2={Theme.Colors.linearGradientEnd}
         width={width}
@@ -245,12 +248,20 @@ export class SvgImage {
     );
   }
 
+  static RestoreIcon() {
+    return <Restore {...testIDProps('restoreIcon')} />;
+  }
+
   static SuccessLogo() {
     return <SuccessLogo {...testIDProps('SuccessLogo')} />;
   }
 
-  static CloudUploadDoneIcon(){
-    return <CloudUploadDoneIcon {...testIDProps('cloudUploadDoneIcon')}/>
+  static PermissionDenied() {
+    return <PermissionDenied {...testIDProps('permissionDeniedImage')} />;
+  }
+
+  static CloudUploadDoneIcon() {
+    return <CloudUploadDoneIcon {...testIDProps('cloudUploadDoneIcon')} />;
   }
 
   static NoInternetConnection() {

screens/Settings/BackupAndRestoreScreen.tsx

@@ -114,16 +114,7 @@ const BackupAndRestoreScreen: React.FC<BackupAndRestoreProps> = props => {
   );
 
   const RestoreSection = (
-    <SectionLayout
-      headerText="Restore"
-      headerIcon={
-        <Icon
-          name="restore"
-          type="MaterialIcons"
-          size={30}
-          color={Theme.Colors.Icon}
-        />
-      }>
+    <SectionLayout headerText="Restore" headerIcon={SvgImage.RestoreIcon()}>
       <Row>
         <View style={{marginBottom: 19}}>
           <Text

shared/fileStorage.ts

@@ -6,6 +6,7 @@ import {
   ReadDirItem,
   readFile,
   stat,
+  StatResult,
   unlink,
   writeFile,
 } from 'react-native-fs';