import React from 'react'
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'

import ArdaWrapper from "./ArdaWrapper.jsx";
import ArdaAuthWrapper from "./ArdaAuthWrapper.jsx";
import ArdaHome from './ArdaHome.jsx';

import Login from '../../src/components/Auth/Login.jsx';
import Logout from '../../src/components/Auth/Logout.jsx';

// Rooms
import ModeratorRoomPage from '../../src/components/Rooms/Room.jsx';
import CreateRoom from '../../src/components/Rooms/CreateRoom.jsx';

// Environments list
import Environments from '../../src/components/Rooms/Environments.jsx';

// Cinema
//
// TODO - fix naming conventions!
import CinemaCategories from '../../src/components/MoviesTV/Categories.jsx';
import CategoryEditor from '../../src/components/MoviesTV/CategoryEditor.jsx';
import MediaItems from '../../src/components/MoviesTV/MediaItems.jsx';
import MediaItemEditor from '../../src/components/MoviesTV/MediaItemEditor.jsx';
import MediaProducts from '../../src/components/MoviesTV/MediaProducts.jsx';
import MediaProductEditor from '../../src/components/MoviesTV/MediaProductEditor.jsx';
import InAppPurchases from '../../src/components/MoviesTV/InAppPurchases.jsx';
import Coupons from '../../src/components/MoviesTV/Coupons.jsx';
import CinemaSales from '../../src/components/MoviesTV/CinemaSales.jsx';

// TV
import TVDashboard from '../../src/components/MoviesTV/TVDashboard.jsx';

// Events
import Topics from '../../src/components/Events/Topics.jsx';
import TopicEditor from '../../src/components/Events/TopicEditor.jsx';

// Network
import Logs from '../../src/components/Network/Logs.jsx';
import MediaServers from '../../src/components/Network/MediaServers.jsx';
import Redis from '../../src/components/Network/Redis.jsx';
import RedisInfo from '../../src/components/Network/RedisInfo.jsx';

// Apps
import RDC from '../../src/components/Apps/RDC.jsx';

// Accounts
import AccountEditor from '../../src/components/Accounts/AccountEditor.jsx';
import AccountSearch from '../../src/components/Accounts/AccountSearch.jsx';
import AccountOnboarding from '../../src/components/Accounts/AccountOnboarding.jsx';
import Reports from '../../src/components/Accounts/Reports.jsx';

// Beyond + Shopify + Fabricator stuff
import ShopifyOrdersTable from '../../src/components/BigOrders/ShopifyOrdersTable.jsx';
import ShopifyOrderHome from '../../src/components/BigOrders/ShopifyOrderHome.jsx';
import BigOrdersList from '../../src/components/BigOrders/BigOrdersList.jsx';
import BigOrderHome from '../../src/components/BigOrders/BigOrderHome.jsx';
import BigOrderReport from '../../src/components/BigOrders/BigOrderReport.jsx';
import BigCreateCustomOrder from '../../src/components/BigOrders/BigCreateCustomOrder.jsx';
import BigCreateCustomOrder2 from '../../src/components/BigOrders/BigCreateCustomOrder2.jsx';
import ShopifyWebhooks from '../../src/components/BigOrders/ShopifyWebhooks.jsx';

// Fabricator
import FabricatorHome from '../../src/components/Fabricator/FabricatorHome.jsx';
import FabricatorJob from '../../src/components/Fabricator/Job.jsx';
import FabricatorBatch from '../../src/components/Fabricator/Batch.jsx';
import ScanRequestHome from '../../src/components/Fabricator/ScanRequestHome.jsx';
import Analytics from '../../src/components/Analytics/Analytics.jsx';

// BigInventory
import InventoryHome from '../../src/components/BigLogistics/InventoryHome.jsx';
import InventoryReport from '../../src/components/BigLogistics/InventoryReport.jsx';
import InventoryAdd from '../../src/components/BigLogistics/InventoryAdd.jsx';
import InventoryScanIngest from '../../src/components/BigLogistics/InventoryScanIngest.jsx';
import InventoryItem from '../../src/components/BigLogistics/InventoryItem.jsx';
import BigProductCustomsInfo from '../../src/components/BigLogistics/BigProductCustomsInfo.jsx';

// BigShipper
import BigShipperHome from '../../src/components/BigLogistics/BigShipperHome.jsx';
import BigShipperNextOrder from '../../src/components/BigLogistics/BigShipperNextOrder.jsx';
import BigShipperLogs from '../../src/components/BigLogistics/BigShipperLogs.jsx';
import BigShipmentList from '../../src/components/BigLogistics/BigShipmentList.jsx';
import BigShipmentPackingQueue from '../../src/components/BigLogistics/BigShipmentPackingQueue.jsx';
import BigShipmentFulfillmentQueue from '../../src/components/BigLogistics/BigShipmentFulfillmentQueue.jsx';
import BigShipmentPickupQueue from '../../src/components/BigLogistics/BigShipmentPickupQueue.jsx';
import BigShipment from '../../src/components/BigLogistics/BigShipment.jsx';
import BigBatchShipper from '../../src/components/BigLogistics/BigBatchShipper.jsx';
import BigShipmentsStats from '../../src/components/BigLogistics/BigShipmentsStats.jsx';

import { Segment } from 'semantic-ui-react'
import ProductsHome from '../../src/components/BigLogistics/ProductsHome.jsx';

// Developers (OAuth client management — Admin and SuperUser; mutations require
// ownership + step-up verification, enforced server-side).
import DevHome from '../../src/components/Developers/DevHome.jsx';
import OAuthClientEditor from '../../src/components/Developers/OAuthClientEditor.jsx';

// Experimental
import ExperimentalHome from '../../src/components/Experimental/ExperimentalHome.jsx';
import FactoryQATools from '../../src/components/Experimental/FactoryQATools.jsx';
import DHLChargesPage from '../../src/components/Experimental/DHLChargesPage.jsx';
import KnowledgeBase from '../../src/components/Experimental/KnowledgeBase.jsx';
import KBQuery from '../../src/components/Experimental/KBQuery.jsx';
import KBDocuments from '../../src/components/Experimental/KBDocuments.jsx';
import KBUpload from '../../src/components/Experimental/KBUpload.jsx';
import WorkerStatus from '../../src/components/Experimental/WorkerStatus.jsx';
import TeamGlobe from '../../src/components/Experimental/TeamGlobe.jsx';
import ShippoAnalyticsPage from '../../src/components/Experimental/ShippoAnalyticsPage.jsx';

export default function App() {
    let verificationTab = null;
    
    if (window) {
        if (window.location.hostname === "localhost" || window.location.hostname.startsWith("dev-")) {
            verificationTab = (
                <Segment basic clearing padded={false} inverted color="purple" secondary textAlign="center" style={{'marginBottom': 0}}>
                    <strong>DEV NETWORK</strong>
                </Segment>
            );
        }
        else if (window.location.hostname.startsWith("test-")) {
            verificationTab = (
                <Segment basic clearing padded={false} inverted color="orange" secondary textAlign="center" style={{'marginBottom': 0}}>
                    <strong>TEST NETWORK</strong>
                </Segment>
            )
        } else {
            verificationTab = (
                <Segment basic clearing padded={false} inverted color="black" secondary textAlign="center" style={{'marginBottom': 0}}>
                    <strong>MAIN NETWORK - PRODUCTION DATA!</strong>
                </Segment>
            )
        }
    }

    return (
        <div>
            <ArdaWrapper>
                <Router>
                    <div>
                        <Route exact path="/" component={ArdaHome} />
                        <Route exact path="/login" render={(props) => ( <ArdaAuthWrapper><Login title="Arda Login" {...props} /></ArdaAuthWrapper> )} />
                        <Route exact path="/logout" render={(props) => ( <Logout {...props} />)} />

                        <Route exact path="/room/:roomId" render={(props) => ( <ModeratorRoomPage {...props} /> )} />
                        <Route exact path="/rooms/create" component={CreateRoom} />
                        <Route exact path="/rooms/environments" component={Environments} />

                        <Route exact path="/cinema"             component={CinemaCategories} />
                        <Route exact path="/cinema/categories"  component={CinemaCategories} />
                        <Route exact path="/cinema/category/:categoryId?"  component={CategoryEditor} />
                        <Route exact path="/cinema/media_items" component={MediaItems} />
                        <Route exact path="/cinema/media_item/:mediaItemId?" component={MediaItemEditor} />
                        <Route exact path="/cinema/products"    component={MediaProducts} />
                        <Route exact path="/cinema/product/:productId?"    component={MediaProductEditor} />
                        <Route exact path="/cinema/iap"    component={InAppPurchases} />
                        <Route exact path="/cinema/coupons"    component={Coupons} />
                        <Route exact path="/cinema/sales"    component={CinemaSales} />

                        <Route exact path="/events" component={Topics} />
                        <Route exact path="/events/topics" component={Topics} />
                        <Route exact path="/events/topic/:topicId?" component={TopicEditor} />

                        <Route exact path="/tv" render={(props) => ( <TVDashboard {...props} view="Channels" /> )} />
                        <Route exact path="/tv/channels" render={(props) => ( <TVDashboard {...props} view="Channels" /> )} />
                        <Route exact path="/tv/channel_groups" render={(props) => ( <TVDashboard {...props} view="ChannelGroups" /> )} />
                        <Route exact path="/tv/channel/:channelId" render={(props) => ( <TVDashboard {...props} /> )} />
                        <Route exact path="/tv/channel_group/:channelGroupId" render={(props) => ( <TVDashboard {...props} /> )} />

                        <Route exact path="/network" component={MediaServers} />
                        <Route exact path="/network/logs" component={Logs} />
                        <Route exact path="/network/media-servers" component={MediaServers} />
                        <Route exact path="/network/redis" component={Redis} />
                        <Route exact path="/network/redis-info" component={RedisInfo} />

                        <Route exact path="/apps" render={(props) => ( <RDC {...props} /> )} />

                        <Route exact path="/accounts" component={AccountSearch} />
                        <Route exact path="/accounts/search" component={AccountSearch} />
                        <Route exact path="/accounts/onboarding" component={AccountOnboarding} />
                        <Route exact path="/accounts/reports" render={(props) => ( <Reports {...props} view="AccountReports" /> )} />
                        <Route exact path="/accounts/room_reports" render={(props) => ( <Reports {...props} view="RoomReports" /> )} />
                        <Route exact path="/accounts/report/:accountReportId" render={(props) => ( <Reports {...props} /> )} />
                        <Route exact path="/accounts/room_report/:roomReportId" render={(props) => ( <Reports {...props} /> )} />
                        <Route exact path="/account/:accountId" component={AccountEditor} />

                        <Route exact path="/search" component={AccountSearch} />

                        <Route exact path="/shop/orders" render={(props) => ( <BigOrdersList {...props} /> )} />
                        <Route exact path="/shop/shopify" render={(props) => ( <ShopifyOrdersTable {...props} /> )} />
                        <Route exact path="/shop/shopify/:shopifyOrderId" render={(props) => ( <ShopifyOrderHome {...props} /> )} />
                        <Route exact path="/shop/report" render={(props) => ( <BigOrderReport {...props} /> )} />
                        <Route exact path="/shop/order/:bigOrderId" render={(props) => ( <BigOrderHome {...props} /> )} />
                        <Route exact path="/shop/order/" render={(props) => ( <BigOrderHome {...props} /> )} />
                        <Route exact path="/shop/create" render={(props) => ( <BigCreateCustomOrder {...props} /> )} />
                        <Route exact path="/shop/create2" render={(props) => ( <BigCreateCustomOrder2 {...props} /> )} />
                        <Route exact path="/shop/webhooks" render={(props) => ( <ShopifyWebhooks {...props} /> )} />

                        <Route exact path="/fabricator" render={(props) => ( <FabricatorHome {...props} /> )} />
                        <Route exact path="/fabricator/job/:jobId" render={(props) => ( <FabricatorJob {...props} /> )} />
                        <Route exact path="/fabricator/batch/:batchId" render={(props) => ( <FabricatorBatch {...props} /> )} />
                        <Route exact path="/fabricator/scan_request/:scanRequestId" render={(props) => ( <ScanRequestHome {...props} /> )} />

                        <Route exact path="/inventory" render={(props) => ( <InventoryHome {...props} /> )} />
                        <Route exact path="/inventory/report" render={(props) => ( <InventoryReport {...props} /> )} />
                        <Route exact path="/inventory/shopify" render={(props) => ( <ProductsHome {...props} /> )} />
                        <Route exact path="/inventory/customs" render={(props) => ( <BigProductCustomsInfo {...props} /> )} />
                        <Route exact path="/inventory/add" render={(props) => ( <InventoryAdd {...props} /> )} />
                        <Route exact path="/inventory/scan" render={(props) => ( <InventoryScanIngest {...props} /> )} />
                        <Route exact path="/inventory/item/:id" render={(props) => ( <InventoryItem {...props} /> )} />
                        
                        <Route exact path="/shipper" render={(props) => ( <BigShipperHome {...props} /> )} />
                        <Route exact path="/shipper/next" render={(props) => ( <BigShipperNextOrder {...props} /> )} />
                        <Route exact path="/shipper/list" render={(props) => ( <BigShipmentList {...props} /> )} />
                        <Route exact path="/shipper/batch" render={(props) => ( <BigBatchShipper {...props} /> )} />
                        <Route exact path="/shipper/packing" render={(props) => ( <BigShipmentPackingQueue {...props} /> )} />
                        <Route exact path="/shipper/queue" render={(props) => ( <BigShipmentFulfillmentQueue {...props} /> )} />
                        <Route exact path="/shipper/shipment/:id" render={(props) => ( <BigShipment {...props} /> )} />
                        <Route exact path="/shipper/pickup" render={(props) => ( <BigShipmentPickupQueue {...props} /> )} />
                        <Route exact path="/shipper/logs" render={(props) => ( <BigShipperLogs {...props} /> )} />
                        <Route exact path="/shipper/stats" render={(props) => ( <BigShipmentsStats {...props} /> )} />

                        <Route exact path="/analytics" render={(props) => ( <Analytics {...props} /> )} />

                        <Route exact path="/developers" render={(props) => ( <DevHome {...props} /> )} />
                        <Route exact path="/developers/new" render={(props) => ( <OAuthClientEditor {...props} mode="create" /> )} />
                        <Route exact path="/developers/apps/:uniqueId" render={(props) => ( <OAuthClientEditor {...props} mode="edit" /> )} />

                        <Route exact path="/experimental" render={(props) => ( <ExperimentalHome {...props} /> )} />
                        <Route exact path="/experimental/qa-tools" render={(props) => ( <FactoryQATools {...props} /> )} />
                        <Route exact path="/experimental/dhl-charges" render={(props) => ( <DHLChargesPage {...props} /> )} />
                        <Route exact path="/experimental/kb" render={(props) => ( <KnowledgeBase {...props} /> )} />
                        <Route exact path="/experimental/kb/query" render={(props) => ( <KBQuery {...props} /> )} />
                        <Route exact path="/experimental/kb/documents" render={(props) => ( <KBDocuments {...props} /> )} />
                        <Route exact path="/experimental/kb/upload" render={(props) => ( <KBUpload {...props} /> )} />
                        <Route exact path="/experimental/workers" render={(props) => ( <WorkerStatus {...props} /> )} />
                        <Route exact path="/experimental/shippo-analytics" render={(props) => ( <ShippoAnalyticsPage {...props} /> )} />
                        <Route exact path="/experimental/team-globe" render={(props) => ( <TeamGlobe {...props} /> )} />
                    </div>
                </Router>
            </ArdaWrapper>
        </div>
    );
}