first commit

.gitignore

@@ -0,0 +1,41 @@
+# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
+
+# dependencies
+node_modules/
+
+# Expo
+.expo/
+dist/
+web-build/
+
+# Native
+*.orig.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+
+# Metro
+.metro-health-check*
+
+# debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
+
+# macOS
+.DS_Store
+*.pem
+
+# local env files
+.env*.local
+
+# typescript
+*.tsbuildinfo
+
+# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
+# The following patterns were generated by expo-cli
+
+expo-env.d.ts
+# @end expo-cli

.npmrc

@@ -0,0 +1 @@
+node-linker=hoisted

README.md

@@ -0,0 +1,20 @@
+<h1 align="center">Project - Expo Web Scraper</h1>
+
+### Requirements
+
+- Node.js 16.20.0 LTS https://nodejs.org/en
+
+- PNPM https://pnpm.io
+
+### Install and start App
+
+```
+pnpm install
+pnpm dev
+```
+
+### Build and start App with Safari Exstention
+
+```
+pnpm build
+```

app.json

@@ -0,0 +1,45 @@
+{
+  "expo": {
+    "name": "expo-web-scraper",
+    "slug": "expo-web-scraper",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "",
+    "scheme": "myapp",
+    "userInterfaceStyle": "automatic",
+    "splash": {
+      "image": "",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "assetBundlePatterns": ["**/*"],
+    "ios": {
+      "supportsTablet": true,
+      "bundleIdentifier": "sdk49"
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "",
+        "backgroundColor": "#ffffff"
+      }
+    },
+    "web": {
+      "bundler": "metro",
+      "output": "static",
+      "favicon": ""
+    },
+    "plugins": [
+      "expo-router",
+      [
+        "react-native-safari-extension",
+        {
+          "folderName": "extension"
+        }
+      ]
+    ],
+    "experiments": {
+      "tsconfigPaths": true,
+      "typedRoutes": true
+    }
+  }
+}

app/_layout.tsx

@@ -0,0 +1,10 @@
+import { Tabs } from 'expo-router/tabs';
+
+export default function AppLayout() {
+  return (
+    <Tabs>
+      <Tabs.Screen name="index" options={{ title: 'Home', href: '/' }} />
+      <Tabs.Screen name="page2" options={{ title: 'Page 2', href: '/page2' }} />
+    </Tabs>
+  );
+}

app/index.tsx

@@ -0,0 +1,43 @@
+import { parse } from 'node-html-parser';
+import React, { useEffect, useState } from 'react';
+import { Text, View, useWindowDimensions } from 'react-native';
+import RenderHtml from 'react-native-render-html';
+import WebView from 'react-native-webview';
+
+export default function Root() {
+  const [htmlString, setHtmlString] = useState<string>('');
+  const { width } = useWindowDimensions();
+
+  useEffect(() => {
+    let timer: NodeJS.Timeout | null = null;
+    try {
+      timer = setInterval(async () => {
+        const res = await fetch('https://www.worldtimeserver.com/current_time_in_US-NY.aspx');
+        const html = await res.text();
+        const root = parse(html);
+        const getText = root.querySelector('#theTime')?.outerHTML;
+        if (!getText) throw new Error('No text found');
+        setHtmlString(getText);
+      }, 1000);
+    } catch (error) {
+      console.log('🚀 ~ error:', error);
+    }
+    return () => {
+      timer && clearInterval(timer);
+    };
+  }, []);
+
+  return (
+    <>
+      <View style={{ height: 50 }}>
+        <Text>WebView</Text>
+        <WebView source={{ html: htmlString }} />
+      </View>
+
+      <View>
+        <Text>React-Native-Render-Html</Text>
+        <RenderHtml contentWidth={width} source={{ html: htmlString }} />
+      </View>
+    </>
+  );
+}

app/page2.tsx

@@ -0,0 +1,6 @@
+import React from 'react';
+import WebView from 'react-native-webview';
+
+export default function Page2() {
+  return <WebView source={{ uri: 'https://www.worldtimeserver.com/current_time_in_US-NY.aspx' }} />;
+}

babel.config.js

@@ -0,0 +1,7 @@
+module.exports = function (api) {
+  api.cache(true);
+  return {
+    presets: ['babel-preset-expo'],
+    plugins: ['react-native-reanimated/plugin', 'expo-router/babel'],
+  };
+};

extension/Info.plist

@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+  <dict>
+    <key>NSExtension</key>
+    <dict>
+      <key>NSExtensionPointIdentifier</key>
+      <string>com.apple.Safari.web-extension</string>
+      <key>NSExtensionPrincipalClass</key>
+      <string>SafariWebExtensionHandler</string>
+    </dict>
+    <key>CFBundleName</key>
+    <string>$(PRODUCT_NAME)</string>
+    <key>CFBundleDisplayName</key>
+    <string>Extension</string>
+    <key>CFBundleIdentifier</key>
+    <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+    <key>CFBundleVersion</key>
+    <string>$(CURRENT_PROJECT_VERSION)</string>
+    <key>CFBundleExecutable</key>
+    <string>$(EXECUTABLE_NAME)</string>
+    <key>CFBundlePackageType</key>
+    <string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>
+    <key>CFBundleShortVersionString</key>
+    <string>$(MARKETING_VERSION)</string>
+  </dict>
+</plist>

extension/Resources/_locales/en/messages.json

@@ -0,0 +1,10 @@
+{
+  "extension_name": {
+    "message": "NewTestExtension",
+    "description": "The display name for the extension."
+  },
+  "extension_description": {
+    "message": "This is NewTestExtension. You should tell us what your extension does here.",
+    "description": "Description of what the extension does."
+  }
+}

extension/Resources/background.js

@@ -0,0 +1,5 @@
+browser.runtime.onMessage.addListener((request, sender, sendResponse) => {
+  console.log('Received request: ', request);
+
+  if (request.greeting === 'hello') sendResponse({ farewell: 'goodbye' });
+});

extension/Resources/content.js

@@ -0,0 +1,7 @@
+browser.runtime.sendMessage({ greeting: 'hello' }).then((response) => {
+  console.log('Received response: ', response);
+});
+
+browser.runtime.onMessage.addListener((request, sender, sendResponse) => {
+  console.log('Received request: ', request);
+});

extension/Resources/manifest.json

@@ -0,0 +1,42 @@
+{
+  "manifest_version": 2,
+  "default_locale": "en",
+
+  "name": "__MSG_extension_name__",
+  "description": "__MSG_extension_description__",
+  "version": "1.0",
+
+  "icons": {
+    "48": "images/icon-48.png",
+    "96": "images/icon-96.png",
+    "128": "images/icon-128.png",
+    "256": "images/icon-256.png",
+    "512": "images/icon-512.png"
+  },
+
+  "background": {
+    "scripts": ["background.js"],
+    "persistent": false
+  },
+
+  "content_scripts": [
+    {
+      "js": ["content.js"],
+      "matches": ["*://example.com/*"]
+    }
+  ],
+
+  "browser_action": {
+    "default_popup": "popup.html",
+    "default_icon": {
+      "16": "images/toolbar-icon-16.png",
+      "19": "images/toolbar-icon-19.png",
+      "32": "images/toolbar-icon-32.png",
+      "38": "images/toolbar-icon-38.png",
+      "48": "images/toolbar-icon-48.png",
+      "72": "images/toolbar-icon-72.png"
+    }
+  },
+
+  "permissions": []
+}

extension/Resources/popup.css

@@ -0,0 +1,15 @@
+:root {
+  color-scheme: light dark;
+}
+
+body {
+  width: 100px;
+  padding: 10px;
+
+  font-family: system-ui;
+  text-align: center;
+}
+
+@media (prefers-color-scheme: dark) {
+  /* Dark Mode styles go here. */
+}

extension/Resources/popup.html

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="stylesheet" href="popup.css" />
+    <script type="module" src="popup.js"></script>
+  </head>
+  <body>
+    <strong>Hello World! 5</strong>
+  </body>
+</html>

extension/Resources/popup.js

@@ -0,0 +1 @@
+console.log('Hello World!', browser);

extension/SafariWebExtensionHandler.swift

@@ -0,0 +1,15 @@
+import os.log
+import SafariServices
+
+class SafariWebExtensionHandler: NSObject, NSExtensionRequestHandling {
+  func beginRequest(with context: NSExtensionContext) {
+    let item = context.inputItems[0] as! NSExtensionItem
+    let message = item.userInfo?[SFExtensionMessageKey]
+    os_log(.default, "Received message from browser.runtime.sendNativeMessage: %@", message as! CVarArg)
+
+    let response = NSExtensionItem()
+    response.userInfo = [SFExtensionMessageKey: ["Response to": message]]
+
+    context.completeRequest(returningItems: [response], completionHandler: nil)
+  }
+}

ios/.gitignore

@@ -0,0 +1,30 @@
+# OSX
+#
+.DS_Store
+
+# Xcode
+#
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+project.xcworkspace
+.xcode.env.local
+
+# Bundle artifacts
+*.jsbundle
+
+# CocoaPods
+/Pods/

ios/.xcode.env

@@ -0,0 +1,11 @@
+# This `.xcode.env` file is versioned and is used to source the environment
+# used when running script phases inside Xcode.
+# To customize your local environment, you can create an `.xcode.env.local`
+# file that is not versioned.
+
+# NODE_BINARY variable contains the PATH to the node executable.
+#
+# Customize the NODE_BINARY variable here.
+# For example, to use nvm with brew, add the following line
+# . "$(brew --prefix nvm)/nvm.sh" --no-use
+export NODE_BINARY=$(command -v node)