metal-price-live 0.2.0

package/LICENSE

@@ -0,0 +1,20 @@
+MIT License
+
+Copyright (c) 2023 S.M.Abdullah Al Mamun
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,42 @@
+# metal-price-live
+
+Live metal prices for react and react native using websocket
+
+## Installation
+
+Using npm:
+
+```
+npm install metal-price-live
+```
+
+Using yarn:
+
+```
+yarn add metal-price-live
+```
+
+## Usage
+
+```tsx
+import useMetalPriceLive from 'metal-price-live';
+
+// ...
+
+const { status, data, error } = useMetalPriceLive(
+  'wss://your-websocket-endpoint',
+  'your-api-key'
+);
+```
+
+## Contributing
+
+See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
+
+## License
+
+MIT
+
+---
+
+Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)

package/lib/commonjs/index.js

@@ -0,0 +1,80 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("react");
+const minReconnectDelay = 1000;
+const maxReconnectDelay = 300000;
+const authRetry = 5;
+const errorReason = 'Unauthorized';
+const useMetalPriceLive = (socketUrl, apiKey) => {
+  const [connectionState, setConnectionState] = (0, _react.useState)({
+    status: 'connecting'
+  });
+  const [retry, setRetry] = (0, _react.useState)(0);
+  const maxAuthRetryRef = (0, _react.useRef)(0);
+  const currentReconnectDelayRef = (0, _react.useRef)(minReconnectDelay);
+  const ws = (0, _react.useRef)(null);
+  const handleWsOpen = () => {
+    setConnectionState({
+      status: 'connecting'
+    });
+    currentReconnectDelayRef.current = minReconnectDelay;
+  };
+  const handleWsMessage = e => {
+    setConnectionState({
+      status: 'connected',
+      data: JSON.parse(e.data)
+    });
+  };
+  const handleWsError = e => {
+    setConnectionState({
+      status: 'error',
+      error: e.message || `WebSocket closed unexpectedly`
+    });
+  };
+  const handleWsClose = e => {
+    setConnectionState({
+      status: 'error',
+      error: (e === null || e === void 0 ? void 0 : e.reason) || `WebSocket closed unexpectedly`
+    });
+
+    //retry logic on auth fail
+    if ((e === null || e === void 0 ? void 0 : e.reason) === errorReason) {
+      maxAuthRetryRef.current++;
+    }
+    if (authRetry < maxAuthRetryRef.current) {
+      return;
+    }
+
+    // Retry logic
+    if (ws.current && ws.current.readyState !== WebSocket.OPEN) {
+      setTimeout(() => {
+        //This state is triggering the useEffect for retry logic
+        setRetry(prev => prev + 1);
+        currentReconnectDelayRef.current = Math.min(currentReconnectDelayRef.current * 2, maxReconnectDelay);
+      }, currentReconnectDelayRef.current);
+    }
+  };
+  (0, _react.useEffect)(() => {
+    ws.current = new WebSocket(`${socketUrl}/${apiKey}`);
+    ws.current.addEventListener('open', handleWsOpen);
+    ws.current.addEventListener('message', handleWsMessage);
+    ws.current.addEventListener('error', handleWsError);
+    ws.current.addEventListener('close', handleWsClose);
+    return () => {
+      if (ws.current) {
+        ws.current.close();
+        ws.current.removeEventListener('open', handleWsOpen);
+        ws.current.removeEventListener('message', handleWsMessage);
+        ws.current.removeEventListener('error', handleWsError);
+        ws.current.removeEventListener('close', handleWsClose);
+      }
+    };
+  }, [socketUrl, retry, apiKey]);
+  return connectionState;
+};
+var _default = exports.default = useMetalPriceLive;
+//# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","minReconnectDelay","maxReconnectDelay","authRetry","errorReason","useMetalPriceLive","socketUrl","apiKey","connectionState","setConnectionState","useState","status","retry","setRetry","maxAuthRetryRef","useRef","currentReconnectDelayRef","ws","handleWsOpen","current","handleWsMessage","e","data","JSON","parse","handleWsError","error","message","handleWsClose","reason","readyState","WebSocket","OPEN","setTimeout","prev","Math","min","useEffect","addEventListener","close","removeEventListener","_default","exports","default"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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"}

package/lib/module/index.js

@@ -0,0 +1,74 @@
+import { useState, useEffect, useRef } from 'react';
+const minReconnectDelay = 1000;
+const maxReconnectDelay = 300000;
+const authRetry = 5;
+const errorReason = 'Unauthorized';
+const useMetalPriceLive = (socketUrl, apiKey) => {
+  const [connectionState, setConnectionState] = useState({
+    status: 'connecting'
+  });
+  const [retry, setRetry] = useState(0);
+  const maxAuthRetryRef = useRef(0);
+  const currentReconnectDelayRef = useRef(minReconnectDelay);
+  const ws = useRef(null);
+  const handleWsOpen = () => {
+    setConnectionState({
+      status: 'connecting'
+    });
+    currentReconnectDelayRef.current = minReconnectDelay;
+  };
+  const handleWsMessage = e => {
+    setConnectionState({
+      status: 'connected',
+      data: JSON.parse(e.data)
+    });
+  };
+  const handleWsError = e => {
+    setConnectionState({
+      status: 'error',
+      error: e.message || `WebSocket closed unexpectedly`
+    });
+  };
+  const handleWsClose = e => {
+    setConnectionState({
+      status: 'error',
+      error: (e === null || e === void 0 ? void 0 : e.reason) || `WebSocket closed unexpectedly`
+    });
+
+    //retry logic on auth fail
+    if ((e === null || e === void 0 ? void 0 : e.reason) === errorReason) {
+      maxAuthRetryRef.current++;
+    }
+    if (authRetry < maxAuthRetryRef.current) {
+      return;
+    }
+
+    // Retry logic
+    if (ws.current && ws.current.readyState !== WebSocket.OPEN) {
+      setTimeout(() => {
+        //This state is triggering the useEffect for retry logic
+        setRetry(prev => prev + 1);
+        currentReconnectDelayRef.current = Math.min(currentReconnectDelayRef.current * 2, maxReconnectDelay);
+      }, currentReconnectDelayRef.current);
+    }
+  };
+  useEffect(() => {
+    ws.current = new WebSocket(`${socketUrl}/${apiKey}`);
+    ws.current.addEventListener('open', handleWsOpen);
+    ws.current.addEventListener('message', handleWsMessage);
+    ws.current.addEventListener('error', handleWsError);
+    ws.current.addEventListener('close', handleWsClose);
+    return () => {
+      if (ws.current) {
+        ws.current.close();
+        ws.current.removeEventListener('open', handleWsOpen);
+        ws.current.removeEventListener('message', handleWsMessage);
+        ws.current.removeEventListener('error', handleWsError);
+        ws.current.removeEventListener('close', handleWsClose);
+      }
+    };
+  }, [socketUrl, retry, apiKey]);
+  return connectionState;
+};
+export default useMetalPriceLive;
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","useEffect","useRef","minReconnectDelay","maxReconnectDelay","authRetry","errorReason","useMetalPriceLive","socketUrl","apiKey","connectionState","setConnectionState","status","retry","setRetry","maxAuthRetryRef","currentReconnectDelayRef","ws","handleWsOpen","current","handleWsMessage","e","data","JSON","parse","handleWsError","error","message","handleWsClose","reason","readyState","WebSocket","OPEN","setTimeout","prev","Math","min","addEventListener","close","removeEventListener"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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"}

package/lib/typescript/src/index.d.ts

@@ -0,0 +1,29 @@
+interface ApiData {
+    timestamp: number;
+    price: number;
+    ask: number;
+    bid: number;
+    price_gram_24k: number;
+    price_gram_22k: number;
+    price_gram_21k: number;
+    key: string;
+}
+interface Connected {
+    status: 'connected';
+    data: ApiData;
+    error?: undefined;
+}
+interface Connecting {
+    status: 'connecting';
+    data?: ApiData;
+    error?: string;
+}
+interface Error {
+    status: 'error';
+    data?: ApiData;
+    error: string;
+}
+type ConnectionState = Connected | Error | Connecting;
+declare const useMetalPriceLive: (socketUrl: string, apiKey: string) => ConnectionState;
+export default useMetalPriceLive;
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAOA,UAAU,OAAO;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,GAAG,EAAE,MAAM,CAAC;CACb;AAED,UAAU,SAAS;IACjB,MAAM,EAAE,WAAW,CAAC;IACpB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,UAAU,UAAU;IAClB,MAAM,EAAE,YAAY,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AACD,UAAU,KAAK;IACb,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED,KAAK,eAAe,GAAG,SAAS,GAAG,KAAK,GAAG,UAAU,CAAC;AACtD,QAAA,MAAM,iBAAiB,cAAe,MAAM,UAAU,MAAM,oBA0E3D,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/package.json

@@ -0,0 +1,165 @@
+{
+  "name": "metal-price-live",
+  "version": "0.2.0",
+  "description": "Live metal price hook for react and react native using websocket",
+  "main": "lib/commonjs/index",
+  "module": "lib/module/index",
+  "types": "lib/typescript/src/index.d.ts",
+  "react-native": "src/index",
+  "source": "src/index",
+  "files": [
+    "src",
+    "lib",
+    "android",
+    "ios",
+    "cpp",
+    "*.podspec",
+    "!ios/build",
+    "!android/build",
+    "!android/gradle",
+    "!android/gradlew",
+    "!android/gradlew.bat",
+    "!android/local.properties",
+    "!**/__tests__",
+    "!**/__fixtures__",
+    "!**/__mocks__",
+    "!**/.*"
+  ],
+  "scripts": {
+    "example": "yarn workspace metal-price-live-example",
+    "test": "jest",
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint \"**/*.{js,ts,tsx}\"",
+    "clean": "del-cli lib",
+    "prepare": "bob build",
+    "release": "release-it",
+    "gittu": "git add . && git commit && git push"
+  },
+  "keywords": [
+    "react-native",
+    "ios",
+    "android"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/smamun19/metal-price-live.git"
+  },
+  "author": "S.M.Abdullah Al Mamun <smamun19@gmail.com> (https://github.com/smamun19)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/smamun19/metal-price-live/issues"
+  },
+  "homepage": "https://github.com/smamun19/metal-price-live#readme",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "devDependencies": {
+    "@commitlint/config-conventional": "^17.0.2",
+    "@evilmartians/lefthook": "^1.5.0",
+    "@react-native/babel-preset": "^0.74.0",
+    "@react-native/eslint-config": "^0.72.2",
+    "@release-it/conventional-changelog": "^5.0.0",
+    "@types/jest": "^28.1.2",
+    "@types/react": "~17.0.21",
+    "@types/react-native": "0.70.0",
+    "commitlint": "^17.0.2",
+    "del-cli": "^5.0.0",
+    "eslint": "^8.4.1",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-prettier": "^4.0.0",
+    "jest": "^28.1.1",
+    "prettier": "^2.0.5",
+    "react": "18.2.0",
+    "react-native": "0.72.6",
+    "react-native-builder-bob": "^0.20.0",
+    "release-it": "^15.0.0",
+    "typescript": "^5.0.2"
+  },
+  "resolutions": {
+    "@types/react": "17.0.21"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*"
+  },
+  "workspaces": [
+    "example"
+  ],
+  "packageManager": "yarn@3.6.1",
+  "engines": {
+    "node": ">= 18.0.0"
+  },
+  "jest": {
+    "preset": "react-native",
+    "modulePathIgnorePatterns": [
+      "<rootDir>/example/node_modules",
+      "<rootDir>/lib/"
+    ]
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
+  },
+  "release-it": {
+    "git": {
+      "commitMessage": "chore: release ${version}",
+      "tagName": "v${version}"
+    },
+    "npm": {
+      "publish": true
+    },
+    "github": {
+      "release": true
+    },
+    "plugins": {
+      "@release-it/conventional-changelog": {
+        "preset": "angular"
+      }
+    }
+  },
+  "eslintConfig": {
+    "root": true,
+    "extends": [
+      "@react-native",
+      "prettier"
+    ],
+    "rules": {
+      "prettier/prettier": [
+        "error",
+        {
+          "quoteProps": "consistent",
+          "singleQuote": true,
+          "tabWidth": 2,
+          "trailingComma": "es5",
+          "useTabs": false
+        }
+      ]
+    }
+  },
+  "eslintIgnore": [
+    "node_modules/",
+    "lib/"
+  ],
+  "prettier": {
+    "quoteProps": "consistent",
+    "singleQuote": true,
+    "tabWidth": 2,
+    "trailingComma": "es5",
+    "useTabs": false
+  },
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      "commonjs",
+      "module",
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
+    ]
+  }
+}

package/src/index.tsx

@@ -0,0 +1,113 @@
+import { useState, useEffect, useRef } from 'react';
+
+const minReconnectDelay = 1000;
+const maxReconnectDelay = 300000;
+const authRetry = 5;
+const errorReason = 'Unauthorized';
+
+interface ApiData {
+  timestamp: number;
+  price: number;
+  ask: number;
+  bid: number;
+  price_gram_24k: number;
+  price_gram_22k: number;
+  price_gram_21k: number;
+  key: string;
+}
+
+interface Connected {
+  status: 'connected';
+  data: ApiData;
+  error?: undefined;
+}
+
+interface Connecting {
+  status: 'connecting';
+  data?: ApiData;
+  error?: string;
+}
+interface Error {
+  status: 'error';
+  data?: ApiData;
+  error: string;
+}
+
+type ConnectionState = Connected | Error | Connecting;
+const useMetalPriceLive = (socketUrl: string, apiKey: string) => {
+  const [connectionState, setConnectionState] = useState<ConnectionState>({
+    status: 'connecting',
+  });
+  const [retry, setRetry] = useState(0);
+  const maxAuthRetryRef = useRef(0);
+  const currentReconnectDelayRef = useRef(minReconnectDelay);
+
+  const ws = useRef<WebSocket | null>(null);
+
+  const handleWsOpen = () => {
+    setConnectionState({
+      status: 'connecting',
+    });
+    currentReconnectDelayRef.current = minReconnectDelay;
+  };
+
+  const handleWsMessage = (e: WebSocketMessageEvent) => {
+    setConnectionState({ status: 'connected', data: JSON.parse(e.data) });
+  };
+  const handleWsError = (e: WebSocketErrorEvent) => {
+    setConnectionState({
+      status: 'error',
+      error: e.message || `WebSocket closed unexpectedly`,
+    });
+  };
+
+  const handleWsClose = (e: WebSocketCloseEvent) => {
+    setConnectionState({
+      status: 'error',
+      error: e?.reason || `WebSocket closed unexpectedly`,
+    });
+
+    //retry logic on auth fail
+    if (e?.reason === errorReason) {
+      maxAuthRetryRef.current++;
+    }
+    if (authRetry < maxAuthRetryRef.current) {
+      return;
+    }
+
+    // Retry logic
+    if (ws.current && ws.current.readyState !== WebSocket.OPEN) {
+      setTimeout(() => {
+        //This state is triggering the useEffect for retry logic
+        setRetry((prev) => prev + 1);
+
+        currentReconnectDelayRef.current = Math.min(
+          currentReconnectDelayRef.current * 2,
+          maxReconnectDelay
+        );
+      }, currentReconnectDelayRef.current);
+    }
+  };
+
+  useEffect(() => {
+    ws.current = new WebSocket(`${socketUrl}/${apiKey}`);
+    ws.current.addEventListener('open', handleWsOpen);
+    ws.current.addEventListener('message', handleWsMessage);
+    ws.current.addEventListener('error', handleWsError);
+    ws.current.addEventListener('close', handleWsClose);
+
+    return () => {
+      if (ws.current) {
+        ws.current.close();
+        ws.current.removeEventListener('open', handleWsOpen);
+        ws.current.removeEventListener('message', handleWsMessage);
+        ws.current.removeEventListener('error', handleWsError);
+        ws.current.removeEventListener('close', handleWsClose);
+      }
+    };
+  }, [socketUrl, retry, apiKey]);
+
+  return connectionState;
+};
+
+export default useMetalPriceLive;