Upgrading to Capacitor 3

.eslintrc

@@ -0,0 +1,3 @@
+{
+  "extends": "next"
+}

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

README.md

@@ -24,14 +24,14 @@ npm run export
 All the client side files will be sent to the `./out/` directory. These files need to be copied to the native iOS and Android projects, and this is where Capacitor comes in:
 
 ```bash
-npx cap copy
+npx cap sync
 ```
 
-Finally, to run the app, open the Native IDE for the platform and follow the IDE's run process (note: a CLI run [will be available in Capacitor 3](https://capacitorjs.com/blog/announcing-capacitor-3-0-beta):
+Finally, to run the app, use Capacitor 3 new awesome run command:
 
 ```
-npx cap open ios
+npx cap run ios
-npx cap open android
+npx cap run android
 ```
 
 ## Livereload/Instant Refresh

android/.gitignore

@@ -1,11 +1,8 @@
-# NPM renames .gitignore to .npmignore
+# Using Android gitignore template: https://github.com/github/gitignore/blob/HEAD/Android.gitignore
-# In order to prevent that, we remove the initial "."
-# And the CLI then renames it
-
-# Using Android gitignore template: https://github.com/github/gitignore/blob/master/Android.gitignore
 
 # Built application files
 *.apk
+*.aar
 *.ap_
 *.aab
 
@@ -19,7 +16,8 @@
 bin/
 gen/
 out/
-release/
+#  Uncomment the following line in case you need and you don't have the release build type files in your app
+# release/
 
 # Gradle files
 .gradle/
@@ -61,6 +59,10 @@ captures/
 
 # External native build folder generated in Android Studio 2.2 and later
 .externalNativeBuild
+.cxx/
+
+# Google Services (e.g. APIs or Firebase)
+# google-services.json
 
 # Freeline
 freeline.py
@@ -84,6 +86,9 @@ lint/outputs/
 lint/tmp/
 # lint/reports/
 
+# Android Profiling
+*.hprof
+
 # Cordova plugins for Capacitor
 capacitor-cordova-android-plugins
 

android/.idea/.gitignore

@@ -1,3 +0,0 @@
-
-# Default ignored files
-/workspace.xml

android/app/capacitor.build.gradle

@@ -9,7 +9,7 @@ android {
 
 apply from: "../capacitor-cordova-android-plugins/cordova.variables.gradle"
 dependencies {
-    implementation project(':capacitor-dark-mode')
+    implementation project(':capacitor-status-bar')
 
 }
 

android/app/src/androidTest/java/com/getcapacitor/myapp/ExampleInstrumentedTest.java

@@ -1,15 +1,13 @@
 package com.getcapacitor.myapp;
 
+import static org.junit.Assert.*;
+
 import android.content.Context;
-
-import androidx.test.platform.app.InstrumentationRegistry;
 import androidx.test.ext.junit.runners.AndroidJUnit4;
-
+import androidx.test.platform.app.InstrumentationRegistry;
 import org.junit.Test;
 import org.junit.runner.RunWith;
 
-import static org.junit.Assert.*;
-
 /**
  * Instrumented test, which will execute on an Android device.
  *
@@ -17,6 +15,7 @@ import static org.junit.Assert.*;
  */
 @RunWith(AndroidJUnit4.class)
 public class ExampleInstrumentedTest {
+
     @Test
     public void useAppContext() throws Exception {
         // Context of the app under test.

android/app/src/main/AndroidManifest.xml

@@ -22,13 +22,6 @@
                 <category android:name="android.intent.category.LAUNCHER" />
             </intent-filter>
 
-            <intent-filter>
-                <action android:name="android.intent.action.VIEW" />
-                <category android:name="android.intent.category.DEFAULT" />
-                <category android:name="android.intent.category.BROWSABLE" />
-                <data android:scheme="@string/custom_url_scheme" />
-            </intent-filter>
-
         </activity>
 
         <provider
@@ -45,19 +38,4 @@
     <!-- Permissions -->
 
     <uses-permission android:name="android.permission.INTERNET" />
-    <!-- Camera, Photos, input file -->
-    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
-    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
-    <!-- Geolocation API -->
-    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
-    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
-    <uses-feature android:name="android.hardware.location.gps" />
-    <!-- Network API -->
-    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
-    <!-- Navigator.getUserMedia -->
-    <!-- Video -->
-    <uses-permission android:name="android.permission.CAMERA" />
-    <!-- Audio -->
-    <uses-permission android:name="android.permission.RECORD_AUDIO" />
-    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS"/>
 </manifest>

android/app/src/main/assets/capacitor.config.json

@@ -9,5 +9,8 @@
 			"launchShowDuration": 0
 		}
 	},
-  "cordova": {}
+	"cordova": {},
+	"server": {
+		"url": "http://192.168.1.123:3000"
+	}
 }

android/app/src/main/assets/capacitor.plugins.json

@@ -0,0 +1,6 @@
+[
+	{
+		"pkg": "@capacitor/status-bar",
+		"classpath": "com.capacitorjs.plugins.statusbar.StatusBarPlugin"
+	}
+]

android/app/src/main/java/com/example/app/MainActivity.java

@@ -1,21 +1,5 @@
 package com.example.app;
 
-import android.os.Bundle;
-
 import com.getcapacitor.BridgeActivity;
-import com.getcapacitor.Plugin;
 
-import java.util.ArrayList;
+public class MainActivity extends BridgeActivity {}
-
-public class MainActivity extends BridgeActivity {
-  @Override
-  public void onCreate(Bundle savedInstanceState) {
-    super.onCreate(savedInstanceState);
-
-    // Initializes the Bridge
-    this.init(savedInstanceState, new ArrayList<Class<? extends Plugin>>() {{
-      // Additional plugins you've installed go here
-      // Ex: add(TotallyAwesomePlugin.class);
-    }});
-  }
-}

android/app/src/test/java/com/getcapacitor/myapp/ExampleUnitTest.java

@@ -1,15 +1,16 @@
 package com.getcapacitor.myapp;
 
-import org.junit.Test;
-
 import static org.junit.Assert.*;
 
+import org.junit.Test;
+
 /**
  * Example local unit test, which will execute on the development machine (host).
  *
  * @see <a href="http://d.android.com/tools/testing">Testing documentation</a>
  */
 public class ExampleUnitTest {
+
     @Test
     public void addition_isCorrect() throws Exception {
         assertEquals(4, 2 + 2);

android/build.gradle

@@ -7,8 +7,8 @@ buildscript {
         jcenter()
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:3.6.1'
+        classpath 'com.android.tools.build:gradle:4.2.1'
-        classpath 'com.google.gms:google-services:4.3.3'
+        classpath 'com.google.gms:google-services:4.3.5'
 
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files

android/capacitor.settings.gradle

@@ -2,5 +2,5 @@
 include ':capacitor-android'
 project(':capacitor-android').projectDir = new File('../node_modules/@capacitor/android/capacitor')
 
-include ':capacitor-dark-mode'
+include ':capacitor-status-bar'
-project(':capacitor-dark-mode').projectDir = new File('../node_modules/capacitor-dark-mode/android')
+project(':capacitor-status-bar').projectDir = new File('../node_modules/@capacitor/status-bar/android')

android/gradle/wrapper/gradle-wrapper.properties

@@ -1,5 +1,5 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-5.6.4-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-7.0-all.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

android/gradlew

@@ -82,6 +82,7 @@ esac
 
 CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
 
+
 # Determine the Java command to use to start the JVM.
 if [ -n "$JAVA_HOME" ] ; then
     if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
@@ -129,6 +130,7 @@ fi
 if [ "$cygwin" = "true" -o "$msys" = "true" ] ; then
     APP_HOME=`cygpath --path --mixed "$APP_HOME"`
     CLASSPATH=`cygpath --path --mixed "$CLASSPATH"`
+
     JAVACMD=`cygpath --unix "$JAVACMD"`
 
     # We build the pattern for arguments to be converted via cygpath
@@ -154,19 +156,19 @@ if [ "$cygwin" = "true" -o "$msys" = "true" ] ; then
         else
             eval `echo args$i`="\"$arg\""
         fi
-        i=$((i+1))
+        i=`expr $i + 1`
     done
     case $i in
-        (0) set -- ;;
+        0) set -- ;;
-        (1) set -- "$args0" ;;
+        1) set -- "$args0" ;;
-        (2) set -- "$args0" "$args1" ;;
+        2) set -- "$args0" "$args1" ;;
-        (3) set -- "$args0" "$args1" "$args2" ;;
+        3) set -- "$args0" "$args1" "$args2" ;;
-        (4) set -- "$args0" "$args1" "$args2" "$args3" ;;
+        4) set -- "$args0" "$args1" "$args2" "$args3" ;;
-        (5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
+        5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
-        (6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
+        6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
-        (7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
+        7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
-        (8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
+        8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
-        (9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
+        9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
     esac
 fi
 
@@ -175,14 +177,9 @@ save () {
     for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done
     echo " "
 }
-APP_ARGS=$(save "$@")
+APP_ARGS=`save "$@"`
 
 # Collect all arguments for the java command, following the shell quoting and substitution rules
 eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS"
 
-# by default we should be in the correct project dir, but when run from Finder on Mac, the cwd is wrong
-if [ "$(uname)" = "Darwin" ] && [ "$HOME" = "$PWD" ]; then
-  cd "$(dirname "$0")"
-fi
-
 exec "$JAVACMD" "$@"

android/gradlew.bat

@@ -29,6 +29,9 @@ if "%DIRNAME%" == "" set DIRNAME=.
 set APP_BASE_NAME=%~n0
 set APP_HOME=%DIRNAME%
 
+@rem Resolve any "." and ".." in APP_HOME to make it shorter.
+for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
+
 @rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
 set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
 
@@ -37,7 +40,7 @@ if defined JAVA_HOME goto findJavaFromJavaHome
 
 set JAVA_EXE=java.exe
 %JAVA_EXE% -version >NUL 2>&1
-if "%ERRORLEVEL%" == "0" goto init
+if "%ERRORLEVEL%" == "0" goto execute
 
 echo.
 echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
@@ -51,7 +54,7 @@ goto fail
 set JAVA_HOME=%JAVA_HOME:"=%
 set JAVA_EXE=%JAVA_HOME%/bin/java.exe
 
-if exist "%JAVA_EXE%" goto init
+if exist "%JAVA_EXE%" goto execute
 
 echo.
 echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
@@ -61,28 +64,14 @@ echo location of your Java installation.
 
 goto fail
 
-:init
-@rem Get command-line arguments, handling Windows variants
-
-if not "%OS%" == "Windows_NT" goto win9xME_args
-
-:win9xME_args
-@rem Slurp the command line arguments.
-set CMD_LINE_ARGS=
-set _SKIP=2
-
-:win9xME_args_slurp
-if "x%~1" == "x" goto execute
-
-set CMD_LINE_ARGS=%*
-
 :execute
 @rem Setup the command line
 
 set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
 
+
 @rem Execute Gradle
-"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS%
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
 
 :end
 @rem End local scope for the variables with windows NT shell

android/variables.gradle

@@ -1,17 +1,14 @@
 ext {
     minSdkVersion = 21
-    compileSdkVersion = 29
+    compileSdkVersion = 30
-    targetSdkVersion = 29
+    targetSdkVersion = 30
-    androidxAppCompatVersion = '1.1.0'
+    androidxActivityVersion = '1.2.0'
-    androidxCoreVersion =  '1.2.0'
+    androidxAppCompatVersion = '1.2.0'
-    androidxMaterialVersion =  '1.1.0-rc02'
+    androidxCoordinatorLayoutVersion = '1.1.0'
-    androidxBrowserVersion =  '1.2.0'
+    androidxCoreVersion = '1.3.2'
-    androidxLocalbroadcastmanagerVersion =  '1.0.0'
+    androidxFragmentVersion = '1.3.0'
-    androidxExifInterfaceVersion = '1.2.0'
+    junitVersion = '4.13.1'
-    firebaseMessagingVersion =  '20.1.2'
+    androidxJunitVersion = '1.1.2'
-    playServicesLocationVersion =  '17.0.0'
+    androidxEspressoCoreVersion = '3.3.0'
-    junitVersion =  '4.12'
-    androidxJunitVersion =  '1.1.1'
-    androidxEspressoCoreVersion =  '3.2.0'
     cordovaAndroidVersion = '7.0.0'
 }

components/AppShell.jsx

@@ -1,4 +1,5 @@
 import { IonApp, IonRouterOutlet, IonSplitPane } from '@ionic/react';
+import { StatusBar, Style } from '@capacitor/status-bar';
 
 import { IonReactRouter } from '@ionic/react-router';
 import { Redirect, Route } from 'react-router-dom';
@@ -6,6 +7,14 @@ import Menu from './Menu';
 
 import Tabs from './pages/Tabs';
 
+window.matchMedia("(prefers-color-scheme: dark)").addListener(async (status) => {
+  try {
+    await StatusBar.setStyle({
+      style: status.matches ? Style.Dark : Style.Light,
+    });
+  } catch {}
+});
+
 const AppShell = () => {
   return (
     <IonApp>

components/Menu.jsx

@@ -1,4 +1,4 @@
-import { Plugins, StatusBarStyle } from '@capacitor/core';
+import { StatusBar, Style } from '@capacitor/status-bar';
 import {
   IonContent,
   IonHeader,
@@ -8,13 +8,11 @@ import {
   IonList,
   IonMenu,
   IonMenuToggle,
-  IonRouterContext,
   IonTitle,
   IonToolbar,
 } from '@ionic/react';
-import { useContext, useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import { cog, flash, list } from 'ionicons/icons';
-import { useHistory, useLocation } from 'react-router-dom';
 
 const pages = [
   {
@@ -35,24 +33,19 @@ const pages = [
 ];
 
 const Menu = () => {
-  const { StatusBar } = Plugins;
-
-  const ionRouterContext = useContext(IonRouterContext);
-  const location = useLocation();
-
   const [isDark, setIsDark] = useState(false);
 
   const handleOpen = async () => {
     try {
       await StatusBar.setStyle({
-        style: isDark ? StatusBarStyle.Light : StatusBarStyle.Dark,
+        style: isDark ? Style.Dark : Style.Light,
       });
     } catch {}
   };
   const handleClose = async () => {
     try {
       await StatusBar.setStyle({
-        style: isDark ? StatusBarStyle.Dark : StatusBarStyle.Light,
+        style: isDark ? Style.Dark : Style.Light,
       });
     } catch {}
   };
@@ -70,7 +63,7 @@ const Menu = () => {
       </IonHeader>
       <IonContent>
         <IonList>
-          {pages.map(p => (
+          {pages.map((p, k) => (
             <IonMenuToggle autoHide={false}>
               <IonItem routerLink={p.url} routerDirection="none" detail={false} lines="none">
                 <IonIcon icon={p.icon} slot="start" />

components/pages/Feed.jsx

@@ -1,3 +1,4 @@
+import Image from 'next/image';
 import Card from '../ui/Card';
 
 import {
@@ -19,15 +20,17 @@ import Store from '../../store';
 
 const FeedCard = ({ title, type, text, author, authorAvatar, image }) => (
   <Card className="my-4 mx-auto">
-    <div>
+    <div className="h-32 w-full relative">
-      <img className="rounded-t-xl h-32 w-full object-cover" src={image} />
+      <Image className="rounded-t-xl" objectFit="cover" src={image} alt="" layout='fill' />
     </div>
     <div className="px-4 py-4 bg-white rounded-b-xl dark:bg-gray-900">
       <h4 className="font-bold py-0 text-s text-gray-400 dark:text-gray-500 uppercase">{type}</h4>
       <h2 className="font-bold text-2xl text-gray-800 dark:text-gray-100">{title}</h2>
       <p className="sm:text-sm text-s text-gray-500 mr-1 my-3 dark:text-gray-400">{text}</p>
       <div className="flex items-center space-x-4">
-        <img src={authorAvatar} className="rounded-full w-10 h-10" />
+        <div className="w-10 h-10 relative">
+          <Image layout='fill' src={authorAvatar} className="rounded-full" alt="" />
+        </div>
         <h3 className="text-gray-500 dark:text-gray-200 m-l-8 text-sm font-medium">{author}</h3>
       </div>
     </div>

components/pages/ListDetail.jsx

@@ -19,7 +19,7 @@ import * as selectors from '../../store/selectors';
 const ListItems = ({ list }) => {
   return (
     <IonList>
-      {(list?.items || []).map(item => (
+      {(list?.items || []).map((item, key) => (
         <ListItemEntry list={list} item={item} />
       ))}
     </IonList>

ios/.gitignore

@@ -1,13 +1,9 @@
-# NPM renames .gitignore to .npmignore
-# In order to prevent that, we remove the initial "."
-# And the CLI then renames it
-
 App/build
 App/Pods
-App/public
 App/Podfile.lock
+App/App/public
+DerivedData
 xcuserdata
 
 # Cordova plugins for Capacitor
 capacitor-cordova-ios-plugins
-

ios/App/App.xcodeproj/project.pbxproj

@@ -26,7 +26,7 @@
 		504EC30E1FED79650016851F /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
 		504EC3111FED79650016851F /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
 		504EC3131FED79650016851F /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
-		50B271D01FEDC1A000F3C39B /* public */ = {isa = PBXFileReference; lastKnownFileType = folder; path = public; sourceTree = SOURCE_ROOT; };
+		50B271D01FEDC1A000F3C39B /* public */ = {isa = PBXFileReference; lastKnownFileType = folder; path = public; sourceTree = "<group>"; };
 		AF277DCFFFF123FFC6DF26C7 /* Pods_App.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; includeInIndex = 0; path = Pods_App.framework; sourceTree = BUILT_PRODUCTS_DIR; };
 		AF51FD2D460BCFE21FA515B2 /* Pods-App.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-App.release.xcconfig"; path = "Pods/Target Support Files/Pods-App/Pods-App.release.xcconfig"; sourceTree = "<group>"; };
 		FC68EB0AF532CFC21C3344DD /* Pods-App.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-App.debug.xcconfig"; path = "Pods/Target Support Files/Pods-App/Pods-App.debug.xcconfig"; sourceTree = "<group>"; };
@@ -281,7 +281,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 12.0;
 				MTL_ENABLE_DEBUG_INFO = YES;
 				ONLY_ACTIVE_ARCH = YES;
 				SDKROOT = iphoneos;
@@ -332,7 +332,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 12.0;
 				MTL_ENABLE_DEBUG_INFO = NO;
 				SDKROOT = iphoneos;
 				SWIFT_OPTIMIZATION_LEVEL = "-Owholemodule";
@@ -346,14 +346,13 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_STYLE = Automatic;
-				DEVELOPMENT_TEAM = CTXHACVRPM;
 				INFOPLIST_FILE = App/Info.plist;
-				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 12.0;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
-				PRODUCT_BUNDLE_IDENTIFIER = com.partidodigital.app;
+				PRODUCT_BUNDLE_IDENTIFIER = com.example.app;
 				PRODUCT_NAME = "$(TARGET_NAME)";
-				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "DEBUG USE_PUSH";
+				SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
 				SWIFT_VERSION = 5.0;
 				TARGETED_DEVICE_FAMILY = "1,2";
 			};
@@ -365,13 +364,12 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_STYLE = Automatic;
-				DEVELOPMENT_TEAM = CTXHACVRPM;
 				INFOPLIST_FILE = App/Info.plist;
-				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 12.0;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				PRODUCT_BUNDLE_IDENTIFIER = com.partidodigital.app;
+				PRODUCT_BUNDLE_IDENTIFIER = com.example.app;
 				PRODUCT_NAME = "$(TARGET_NAME)";
-				SWIFT_ACTIVE_COMPILATION_CONDITIONS = USE_PUSH;
+				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "";
 				SWIFT_VERSION = 5.0;
 				TARGETED_DEVICE_FAMILY = "1,2";
 			};

ios/App/App/AppDelegate.swift

@@ -6,7 +6,6 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
 
     var window: UIWindow?
 
-
     func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
         // Override point for customization after application launch.
         return true
@@ -37,14 +36,14 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
     func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
         // Called when the app was launched with a url. Feel free to add additional processing here,
         // but if you want the App API to support tracking app url opens, make sure to keep this call
-    return CAPBridge.handleOpenUrl(url, options)
+        return ApplicationDelegateProxy.shared.application(app, open: url, options: options)
     }
 
     func application(_ application: UIApplication, continue userActivity: NSUserActivity, restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void) -> Bool {
         // Called when the app was launched with an activity, including Universal Links.
         // Feel free to add additional processing here, but if you want the App API to support
         // tracking app url opens, make sure to keep this call
-    return CAPBridge.handleContinueActivity(userActivity, restorationHandler)
+        return ApplicationDelegateProxy.shared.application(application, continue: userActivity, restorationHandler: restorationHandler)
     }
 
     override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
@@ -54,21 +53,8 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
         guard let touchPoint = event?.allTouches?.first?.location(in: self.window) else { return }
 
         if statusBarRect.contains(touchPoint) {
-      NotificationCenter.default.post(CAPBridge.statusBarTappedNotification)
+            NotificationCenter.default.post(name: .capacitorStatusBarTapped, object: nil)
         }
     }
 
-  #if USE_PUSH
-
-  func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) {
-    NotificationCenter.default.post(name: Notification.Name(CAPNotifications.DidRegisterForRemoteNotificationsWithDeviceToken.name()), object: deviceToken)
 }
-
-  func application(_ application: UIApplication, didFailToRegisterForRemoteNotificationsWithError error: Error) {
-    NotificationCenter.default.post(name: Notification.Name(CAPNotifications.DidFailToRegisterForRemoteNotificationsWithError.name()), object: error)
-  }
-
-#endif
-
-}
-

ios/App/App/Info.plist

@@ -18,17 +18,6 @@
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
 	<string>1.0</string>
-	<key>CFBundleURLTypes</key>
-	<array>
-		<dict>
-			<key>CFBundleURLName</key>
-			<string>com.getcapacitor.capacitor</string>
-			<key>CFBundleURLSchemes</key>
-			<array>
-				<string>capacitor</string>
-			</array>
-		</dict>
-	</array>
 	<key>CFBundleVersion</key>
 	<string>1</string>
 	<key>LSRequiresIPhoneOS</key>
@@ -38,18 +27,6 @@
 		<key>NSAllowsArbitraryLoads</key>
 		<true/>
 	</dict>
-	<key>NSCameraUsageDescription</key>
-	<string>To Take Photos and Video</string>
-	<key>NSLocationAlwaysUsageDescription</key>
-	<string>Always allow Geolocation?</string>
-	<key>NSLocationWhenInUseUsageDescription</key>
-	<string>Allow Geolocation?</string>
-	<key>NSMicrophoneUsageDescription</key>
-	<string>To Record Audio With Video</string>
-	<key>NSPhotoLibraryAddUsageDescription</key>
-	<string>Store camera photos to camera</string>
-	<key>NSPhotoLibraryUsageDescription</key>
-	<string>To Pick Photos from Library</string>
 	<key>UILaunchStoryboardName</key>
 	<string>LaunchScreen</string>
 	<key>UIMainStoryboardFile</key>

ios/App/App/capacitor.config.json

@@ -9,5 +9,8 @@
 			"launchShowDuration": 0
 		}
 	},
-  "cordova": {}
+	"cordova": {},
+	"server": {
+		"url": "http://192.168.1.123:3000"
+	}
 }

ios/App/Podfile

@@ -1,4 +1,4 @@
-platform :ios, '11.0'
+platform :ios, '12.0'
 use_frameworks!
 
 # workaround to avoid Xcode caching of Pods that requires
@@ -7,11 +7,9 @@ use_frameworks!
 install! 'cocoapods', :disable_input_output_paths => true
 
 def capacitor_pods
-  # Automatic Capacitor Pod dependencies, do not delete
   pod 'Capacitor', :path => '../../node_modules/@capacitor/ios'
   pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios'
-  pod 'CapacitorDarkMode', :path => '../../node_modules/capacitor-dark-mode'
+  pod 'CapacitorStatusBar', :path => '../../node_modules/@capacitor/status-bar'
-  # Do not delete
 end
 
 target 'App' do

next.config.js

@@ -1,3 +1,6 @@
 module.exports = {
-  basePath: ''
+  basePath: '',
+  images: {
+    domains: ['images.unsplash.com'],
+  },
 };

package.json

@@ -2,6 +2,9 @@
   "name": "nextjs-tailwind-capacitor",
   "version": "0.1.0",
   "private": true,
+  "engines": {
+    "node": ">=12"
+  },
   "scripts": {
     "dev": "next dev",
     "build": "next build",
@@ -9,28 +12,30 @@
     "export": "next export"
   },
   "dependencies": {
-    "@capacitor/android": "^2.4.6",
+    "@capacitor/android": "^3.0.1",
-    "@capacitor/cli": "^2.4.5",
+    "@capacitor/cli": "^3.0.1",
-    "@capacitor/core": "^2.4.5",
+    "@capacitor/core": "^3.0.1",
-    "@capacitor/ios": "^2.4.5",
+    "@capacitor/ios": "^3.0.1",
+    "@capacitor/status-bar": "^1.0.1",
     "@ionic/react": "^5.5.2",
     "@ionic/react-router": "^5.5.2",
-    "autoprefixer": "^10.1.0",
+    "autoprefixer": "^10.2.6",
-    "capacitor-dark-mode": "^1.0.5",
     "classnames": "^2.2.6",
-    "next": "10.0.3",
+    "next": "^11.0.0",
-    "postcss": "^8.2.1",
+    "postcss": "^8.3.5",
     "react": "17.0.1",
     "react-dom": "17.0.1",
     "react-router-dom": "^5.2.0",
     "react-virtuoso": "^1.1.1",
-    "tailwindcss": "^2.0.2"
+    "tailwindcss": "^2.1.4"
   },
   "devDependencies": {
+    "eslint": "^7.28.0",
+    "eslint-config-next": "^11.0.0",
     "ionicons": "^5.2.3",
     "prettier": "^2.2.1",
     "pullstate": "^1.20.5",
-    "react-use-gesture": "^9.0.0-beta.11",
+    "react-use-gesture": "^9.1.3",
     "reselect": "^4.0.0"
   }
 }

pages/_app.js

@@ -1,4 +1,5 @@
 import Head from 'next/head';
+import Script from 'next/script';
 
 import 'tailwindcss/tailwind.css';
 import '@ionic/react/css/core.css';
@@ -20,9 +21,9 @@ function MyApp({ Component, pageProps }) {
           name="viewport"
           content="width=device-width, initial-scale=1.0, viewport-fit=cover"
         ></meta>
-        <script src="https://unpkg.com/ionicons@5.2.3/dist/ionicons.js"></script>
       </Head>
       <Component {...pageProps} />
+      <Script src="https://unpkg.com/ionicons@5.2.3/dist/ionicons.js"></Script>
     </>
   );
 }