How to add time zone in react-cron-generator - react-cron-generator

I'm using react-cron-generator in my react app, and i don't have any information about timezone ,How can i know which time zone in react-cron-generator.
Versions :
"react": "^17.0.2",
"react-cron-generator": "^1.3.5",

Related

How to use i18next with remix-typescript and have autocomplete?

I have remix app (Bluestack). I am using i18next for internationalisation. I want to have autocomplete feature while using keys from index.json similar to how typescript shows suggestion when type is defined.
I have tried https://www.i18next.com/overview/typescript whats given over here but the it's not working. In docs it's mentioned to create that file in src folder but in remix app there is no such directory. Where exactly do i have to keep that file? What am i missing?
Package versions:
"#remix-run/express": "^1.6.0",
"react-i18next": "^11.18.6"
"#remix-run/node": "^1.6.0",
"#remix-run/react": "^1.6.0",
"#remix-run/server-runtime": "^1.6.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-i18next": "^11.18.6"
This my directory structure. translation file is inside the public/locales/english/en/index.json

How do I fix "Can't find variable: _updatePropsPaper" from react native Drawer?

I am not sure if there is specific code I can share. I started working on an app project I hadn't touched since last summer a couple weeks ago, and after many many errors and fixes related to getting the right/most up to date versions of everything running again it seems to MOSTLY work except that every time I use the drawer function to switch screens it gives and error that says "Can't find variable: _updatePropsPaper". The weird part is that even though it gives the error, it still goes to the proper screen, and if I dismiss the error every time I use the drawer it functions normally as far as I can tell. Is this something a newer version of react native drawer introduced that I missed while updating? Or is the problem something else? Either way, I have to figure this out as I believe this is the last existing issue before I can start actual work on the app again. If I am missing any critical information, sorry! This is my first question and also the source of this issue is (as far as I can tell) fairly ambiguous.
These are all my dependencies, in case that helps. Again, the issue seems to only occur when I switch screens with the drawer function, and it still actually changes screens, it just shows and error.
"dependencies": {
"#react-native-masked-view/masked-view": "0.2.6",
"#react-native-picker/picker": "2.4.0",
"#react-navigation/drawer": "^6.4.1",
"#react-navigation/native": "^6.0.10",
"#react-navigation/stack": "^6.2.1",
"expo": "^45.0.4",
"expo-status-bar": "~1.3.0",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-native": "0.68.2",
"react-native-country-picker-modal": "^2.0.0",
"react-native-gesture-handler": "^2.4.2",
"react-native-reanimated": "^3.0.0-rc.0",
"react-native-safe-area-context": "4.2.4",
"react-native-screens": "~3.11.1",
"react-native-tab-view": "^3.1.1",
"react-native-web": "0.17.7",
"world-countries": "^4.0.0"
},
"devDependencies": {
"#babel/core": "^7.12.9"
I had this exact issue. For me it was a matter of various package versions being incompatible. Here are the versions that managed to fix the issue for me:
"#react-navigation/drawer": "6.4.1",
"#react-navigation/native": "^6.0.10",
"#react-navigation/native-stack": "^6.6.2",
"#react-navigation/stack": "^6.2.1",
"react-native": "0.68.2",
"react-native-gesture-handler": "~2.2.1",
"react-native-reanimated": "~2.8.0",
"react-native-safe-area-context": "4.2.4",
"react-native-screens": "~3.11.1",

does expo have problem with using react native webview?

Im trying to use react-native-webview but it wont load up, it just show white blank screen. I have found multiple sources that it could happen if I use older version of expo, so I updated it to the newest one but problem still occurs.
theese are the versions that Im using from package.json:
"dependencies": {
"expo": "~40.0.0",
"expo-status-bar": "~1.0.3",
"express": "^4.15.2",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-gesture-handler": "~1.6.0",
"react-native-orientation": "^3.1.3",
"react-native-reanimated": "~1.7.0",
"react-native-safe-area-context": "0.7.3",
"react-native-screens": "~2.2.0",
"react-native-web": "~0.13.12",
"react-native-webview": "^11.2.4",
"react-navigation": "^4.3.6",
"react-navigation-stack": "^2.3.10",
"socket.io": "^2.3.0",
"socket.io-client": "^2.3.0"
}
if I try to load my app it loads but it wont show webview it shows just blank white screen and I get this warning.
I have tried to downgrade webview to version 11.0.0. rewriting package.json and npm install to create new node_modules but when I did that I got bunch of errors
any recommendations please how can I fix this ? Im trying just simple webview from working example.
I have downloaded react-native-webview and linked it
FINALLY I have solved my problem with webview, it took me around 7 days, I have tried everything possible and the reason was?...Styling, I was trying multiple styling parameters but never combination of height, width + overflow. The overflow is the reason it didnt work. So if you have problem with webview being only white blank screen try this: style={{ height: 150, width: 680,overflow:'hidden' }} ofcourse height/width you can change how you want but it should 100% work.

URL path changing after page load with Gatsby

I have a problem where when a site gets loaded, the URL is then changed causing the URL to be incorrect if you then try to share it. The site loads fine otherwise, but then changes to the incorrect URL
For example, the site is located in some sub folders ("en-us/site") on the domain which looks like this if you are on the blog page: www.example.com/en-us/site/blog/. So if you go to that URL the page will load fine but after loading the URL in the address bar will change to just be www.example.com/blog/
This only became an issue when a dev accidentally updating the dependencies in NPM. I have narrowed it down to being an update to Gatsby. Unfortunately there is way too many possibilities for which version is the culprit, nor how to solve it. We went from Gatsby version 2.4.6 to version 2.30.1 so the issue kicks in somewhere between those.
Does anyone have any hints to what could be causing this URL change?
Our dependency list while it was working looked like the following. The only difference that will cause the issue is an update to the gatsby package. I am unsure which specific version starts the issue as it would take too long to try each and every one, but going to 2.30.1 definitely causes issues.
"dependencies": {
"classnames": "^2.2.6",
"esm": "^3.2.25",
"gatsby": "^2.20.2",
"gatsby-plugin-react-helmet": "^3.1.15",
"gatsby-plugin-sass": "^2.3.12",
"gatsby-plugin-sitemap": "^2.3.5",
"gatsby-source-filesystem": "^2.1.10",
"gatsby-transformer-json": "^2.2.26",
"jquery": "^3.4.1",
"node-sass": "^4.14.1",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-helmet": "^5.2.1",
"react-transition-group": "^4.4.1",
"webpack": "^4.31.0"
},
"devDependencies": {
"#hot-loader/react-dom": "^16.10.2",
"#typescript-eslint/eslint-plugin": "^2.31.0",
"#typescript-eslint/parser": "^2.31.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.8.0",
"eslint-config-react-app": "^5.2.1",
"eslint-loader": "^4.0.2",
"eslint-plugin-flowtype": "^4.7.0",
"eslint-plugin-import": "^2.20.2",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.19.0",
"eslint-plugin-react-hooks": "^2.5.1",
"gatsby-disable-404": "^0.2.1",
"gatsby-plugin-eslint": "^2.0.8",
"prettier": "^1.17.1"
},
The siteUrl in gatsby-config.js is set correctly with https://www.example.com/en-us/site as the URL and assetPrefix is set to /en-us/site.
I have narrowed it down to just an update to the gatsby package will cause the issue. Also the issue seems to only be reproduceable on our staging and production servers. I have been unable to repro locally with a local server setup.
We could keep with the old versions but I don't want to risk this issue in case it accidentally happens again (via rogue package-lock file) and would rather just get to the latest version anyway.

Mapbox render large dataset

I am building a website using mapbox to render about 24mb of geojson data. I stored these data in backend server, the API request takes about 2300ms, and front-end map displaying those data would take over 10 seconds.
The GeoJson are river stream data which contains many MultiLineString. Data is cleaned up.
Here are the steps:
User opens website
Site fetches data at server end-point
Site receives fetched data(geojson - 9 of them)
React creates one layer for each geojson set, and pass these info as states down to Mapbox component
Mapbox takes these data and renders it, I believe this is where is taking the most of the time.
Here is the data format:
https://eflow.nyc3.digitaloceanspaces.com/class_geo_data/classGeo.json
My questions:
What is the cause for this to take such long time to render data? Is it because there are too many line segments? I have seen over 100mb data rendered in shorter amount of time.
What is the best practice for rendering this dataset in Mapbox?
I am using react-map-gl, not sure which version of mapbox gl is actually using.
Thanks
Leo
Dependencies:
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"copy-webpack-plugin": "4.3.1",
"webpack-dotenv-plugin": "^2.0.2",
"animate.css": "3.6.1",
"axios": "0.18.0",
"d3": "4.13.0",
"flexboxgrid": "6.3.1",
"get-json": "1.0.0",
"immutable": "3.8.2",
"material-ui": "0.19.4",
"object-assign": "4.1.0",
"react": "16.2.0",
"react-dom": "16.2.0",
"react-map-gl": "3.2.0",
"react-redux": "5.0.5",
"react-router-dom": "4.2.2",
"react-router-redux": "5.0.0-alpha.6",
"redux": "3.6.0",
"redux-thunk": "2.1.0",
"superagent": "3.8.1",
"topojson": "3.0.2"
I am not sure why this is so much faster, but the correct way to do this is:
divide my dataset into smaller chucks
load each as a layer into mapbox studio, and into the map style you created
download this entire json file
render the map using Mapbox
This is a complete different approach than my original one, which was to get data from my own API then have Mapbox render it. But it reduces the load speed down to 1-2 seconds from 10+ seconds

Resources