Skip to content

Commit

Permalink
Polish and fix React and Vue on Capacitor
Browse files Browse the repository at this point in the history
  • Loading branch information
Matt Raible committed Aug 25, 2022
1 parent dba79a7 commit 69d0af1
Show file tree
Hide file tree
Showing 25 changed files with 636 additions and 322 deletions.
2 changes: 1 addition & 1 deletion demos/angular-capacitor/capacitor.config.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"appId": "com.appauth.demo",
"appName": "com.appauth.demo",
"appName": "Angular Demo",
"bundledWebRuntime": false,
"npmClient": "npm",
"webDir": "www",
Expand Down
2 changes: 1 addition & 1 deletion demos/react/capacitor.config.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"appId": "com.appauth.demo",
"appName": "CapReactDemo",
"appName": "React Demo",
"bundledWebRuntime": false,
"npmClient": "npm",
"webDir": "build",
Expand Down
112 changes: 105 additions & 7 deletions demos/react/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 3 additions & 1 deletion demos/react/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,12 @@
"version": "0.0.1",
"private": true,
"dependencies": {
"@capacitor-community/http": "^1.4.1",
"@capacitor/android": "^4.1.0",
"@capacitor/app": "^4.0.1",
"@capacitor/browser": "^4.0.1",
"@capacitor/core": "4.1.0",
"@capacitor/ios": "^4.1.0",
"@capacitor/preferences": "^4.0.1",
"@ionic/react": "5.6.12",
"@ionic/react-router": "5.6.12",
Expand All @@ -31,7 +33,7 @@
"react-router-dom": "^5.1.2",
"react-scripts": "4.0.3",
"rxjs": "^6.6.7",
"typescript": "4.7.4"
"typescript": "4.3.5"
},
"scripts": {
"start": "react-scripts start",
Expand Down
20 changes: 10 additions & 10 deletions demos/react/src/components/action-card/action-card.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import React from 'react';
import { IonCard, IonCardHeader, IonCardContent } from '@ionic/react';

export const ActionCard = (props : any) => {
export const ActionCard = (props: any) => {

return (
<IonCard>
<IonCardHeader>Action Data</IonCardHeader>
<IonCardContent>
{JSON.stringify(props.action) }
</IonCardContent>
</IonCard>
);
}
return (
<IonCard>
<IonCardHeader>Action Data</IonCardHeader>
<IonCardContent>
{JSON.stringify(props.action)}
</IonCardContent>
</IonCard>
);
}
16 changes: 8 additions & 8 deletions demos/react/src/components/user-info-card/user-info-card.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@ import React from 'react';
import { IonCard, IonCardHeader, IonCardContent } from '@ionic/react';

export const UserInfoCard = (props: any) => {
return (
<IonCard>
<IonCardHeader>User Info</IonCardHeader>
<IonCardContent>
{JSON.stringify(props.user) }
</IonCardContent>
</IonCard>
);
return (
<IonCard>
<IonCardHeader>User Info</IonCardHeader>
<IonCardContent>
{JSON.stringify(props.user)}
</IonCardContent>
</IonCard>
);
}
23 changes: 12 additions & 11 deletions demos/react/src/pages/EndRedirect.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,20 +4,21 @@ import { Auth } from '../services/AuthService';
import { RouteComponentProps } from 'react-router';
import { useIonViewWillEnter, IonPage } from '@ionic/react';

interface EndRedirectPageProps extends RouteComponentProps {}
interface EndRedirectPageProps extends RouteComponentProps {
}

const EndRedirect : React.FC<EndRedirectPageProps> = (props: EndRedirectPageProps) => {
const EndRedirect: React.FC<EndRedirectPageProps> = (props: EndRedirectPageProps) => {

useIonViewWillEnter(() => {
Auth.Instance.endSessionCallback();
setInterval(() => props.history.replace('landing'), 2500)
});
useIonViewWillEnter(() => {
Auth.Instance.endSessionCallback();
setInterval(() => props.history.replace('landing'), 2500)
});

return (
<IonPage>
<p>Signing out...</p>
</IonPage>
);
return (
<IonPage>
<p>Signing out...</p>
</IonPage>
);
};

export default EndRedirect;
Loading

4 comments on commit 69d0af1

@Saveriu
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi! Why using CapacitorService on IOS plateform?

@mraible
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why shouldn't we? It works on both iOS and Android and is recommended by the Ionic folks.

@Saveriu
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I meant why using CapacitorService only for IOS (and not Android):
const requestor = isPlatform('ios') ? new CapacitorRequestor() : new AxiosRequestor();

@mraible
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't recall since I committed this almost six months ago. It's done the way it is most likely because it was the only way I was able to get things to work.

Please sign in to comment.