add missing files

Author: mdamyanova

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/components/Error.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import { RouteComponentProps } from 'react-router';
+import { Grid, Col, Row, Popover, ButtonToolbar, Button } from 'react-bootstrap';
+import { ERROR_TEXT, REPOSITORY_URL } from '../utils/constants';
+
+export class Error extends React.Component<RouteComponentProps<any>, any> {
+    public render() {
+        return (
+            <Grid>
+                <Row className="show-grid">
+                    <Col xs={6} md={4}>
+                        <div>
+                            <img src="baby-cow.jpg" alt="Baby Cow" />
+                        </div>
+                    </Col>
+                    <Col xs={12} md={8}>
+                        <div style={{ height: 120 }}>
+                            <Popover
+                                id="popover-basic"
+                                placement="right"
+                                positionTop={50}
+                                title="Oops!">
+                                {ERROR_TEXT}
+                                <ButtonToolbar>
+                                    <Button href={REPOSITORY_URL} target="_blank">help me</Button>
+                                    <Button href='/'>ignore me</Button>
+                                </ButtonToolbar>
+                            </Popover>
+                        </div>
+                    </Col>
+                </Row>
+            </Grid>
+        );
+    }
+}

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/components/Example.tsx

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { RouteComponentProps } from 'react-router';
+
+export class Example extends React.Component<RouteComponentProps<{}>, {}> {
+    public render() {
+        return (
+            <h3>This is an example page.</h3>
+        );
+    }
+}

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/components/Footer.tsx

@@ -0,0 +1,9 @@
+import * as React from 'react';
+
+export class Footer extends React.Component<{}, {}> {
+    public render() {
+        return (
+            <footer>ASP.NET Core ReactJS - Example &copy; 2018</footer>
+        );
+    }
+}

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/components/users/Logout.tsx

@@ -0,0 +1,15 @@
+import 'isomorphic-fetch';
+import { removeAccessToken } from '../../utils/helpers';
+
+export function logout() {
+    fetch('/api/users/logout')
+        .then(res => {
+            if (res.status >= 200 && res.status < 300) {
+                // Remove token of logged in user from local storage
+                removeAccessToken();
+                window.location.hash = '/';
+            } else {
+                window.location.hash = '/error';
+            }
+        });
+}

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/css/about.css

@@ -0,0 +1,7 @@
+.about {
+    display: block;
+    margin-top: 200px;
+    margin-left: auto;
+    margin-right: auto;
+    width: 50%;
+}

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/css/error.css

@@ -0,0 +1,9 @@
+.img-with-text {
+    text-align: justify;
+    width: 100%;
+}
+
+    .img-with-text img {
+        display: block;
+        margin: 0 auto;
+    }

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/css/home.css

@@ -0,0 +1,7 @@
+.home {
+    display: block;
+    margin-top: 200px;
+    margin-left: auto;
+    margin-right: auto;
+    width: 50%;
+}

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/css/loading.css

@@ -0,0 +1,4 @@
+.loading {
+    display: block;
+    margin: auto;
+}

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/css/users.css

@@ -0,0 +1,3 @@
+.users h2 {
+    text-align: center;
+}

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/utils/constants.js

@@ -0,0 +1,3 @@
+export const ERROR_TEXT = "Something is wrong. But, you see, I'm just a baby, so I can't deal with everything in this cruel world! You wanna help me ?";
+
+export const REPOSITORY_URL = "https://github.com/mdamyanova/ASP.NET-Core-ReactJS-Example";

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/utils/constants.tsx

@@ -0,0 +1,13 @@
+const storage = window.localStorage;
+
+export const getAccessToken = () => storage.getItem("access_token");
+
+export const getUser = () => storage.getItem("user");
+
+export const setUser = (user: any) => storage.setItem("user", user);
+
+export const setAccessToken = (token: any) => storage.setItem("access_token", token);
+
+export const removeAccessToken = () => storage.removeItem("access_token");
+
+export const isLoggedIn = () => Boolean(getAccessToken());

ASPNETCoreReactJS-Example/ASPNETCoreReactJS-Example/ClientApp/utils/helpers.js

@@ -0,0 +1,9 @@
+namespace ASPNETCoreReactJS_Example.Models
+{
+    public class LoginModel
+    {
+        public string UserName { get; set; }
+
+        public string Password { get; set; }
+    }
+}