{"size": 3178, "ext": "js", "max_stars_repo_path": "src/frontend/app/src/App.js", "max_stars_repo_name": "kirillzhosul/video-hosting", "max_stars_repo_stars_event_min_datetime": "2022-03-31T19:59:14.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-31T19:59:14.000Z", "max_issues_repo_path": "src/frontend/app/src/App.js", "max_issues_repo_name": "kirillzhosul/video-hosting", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/frontend/app/src/App.js", "max_forks_repo_name": "kirillzhosul/video-hosting", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 37.8333333333, "max_line_length": 169, "alphanum_fraction": 0.4663310258}
import React from 'react';
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'

import Navbar from './components/Navbar'
import PopularVideosList from './components/PopularVideosList'

const API_URL = "http://localhost:8000/";

class Home extends React.Component {
    render () {
        return (
            <div className="home-page">
                <div className="container-fluid text-center py-5 ">
                <div className="row position-relative py-4">
                    <div className="col-lg-5 mx-auto">
                        <h6 className="text-uppercase text-primary">Welcome there!</h6>
                        <h1 className="display-1"><i>Simple</i> Video Hosting</h1>
                    </div>
                </div>
                <div className="row mt-5">
                    <div className="col-lg-8 mx-auto mt-5">
                        <h1 className="mb-5 display-4 text-danger">Project currently at WIP stage! There is a lot of work required. This is just temporary showcase.</h1>
                        <h2 className="mb-5 ">Useful links
                            <br/><a href="https://github.com/kirillzhosul/web-video-hosting" target="_blank" rel="noopener noreferrer">GitHub</a>,
                            <a href="https://kirillzhosul.site" target="_blank" rel="noopener noreferrer">Author</a>,
                            <a href="http://127.0.0.1:8000/docs" target="_blank" rel="noopener noreferrer">API</a>
                        </h2>
                        <hr/>
                        
                    </div>
                </div>
            </div>
            <div className="container-fluid text-center mb-5">
                <div className="row">
                    <div className="col-md-auto mx-auto">
                    <PopularVideosList/>
                    </div>
                </div>
            </div>
            </div>
        )
    }
}

class Watch extends React.Component {
    render () {
        return (
            <div className="watch-page">
                <div className="container-fluid text-center py-5 ">
                    <div className="row position-relative py-4">
                        <div className="col-lg-5 mx-auto">
                            <h6 className="text-uppercase text-primary">Some text</h6>
                            <h1 className="display-1">Video title</h1>
                        </div>
                    </div>
                    <div className="row mt-5">
                        <div className="col-lg-8 mx-auto mt-5">
                            <h1 className="mb-5 display-4 text-danger">Watching videos is not supported yet.</h1>
                            <hr/>
                        </div>
                    </div>
                </div>
            </div>
        )
    }
}

function App() {
  return (
      <Router>
        <div className="App">
            <Navbar />
            <Routes>
                <Route exact path='/' element={<Home/>} /> 
                <Route exact path='/watch' element={<Watch/>} /> 
            </Routes>
        </div>
      </Router>

  );
}

export {API_URL};
export default App;