commit 5f9d5ec6aae5646a42308ef0290bc57107bbb41a
parent 9899cc6535b01a1d03473e551eb3b9be10556d01
Author: Agastya Chandrakant <acagastya@outlook.com>
Date: Tue, 26 May 2020 00:09:49 +0530
disabled button + basePath
Diffstat:
6 files changed, 26 insertions(+), 14 deletions(-)
diff --git a/src/App/comps/Header.tsx b/src/App/comps/Header.tsx
@@ -1,10 +1,12 @@
import React from 'react';
import { Link } from 'react-router-dom';
+import { basePath } from '../../utils';
+
function Header<never>(): JSX.Element {
return (
<nav className="bg-danger mb-5 navbar navbar-dark navbar-expand-lg">
- <Link className="navbar-brand" to="/">
+ <Link className="navbar-brand" to={`${basePath}/`}>
<span aria-label="time convertor" role="img">
{new Date().getMinutes() % 2 ? '⏳' : '⌛️'}
</span>{' '}
@@ -22,17 +24,17 @@ function Header<never>(): JSX.Element {
<div className="collapse navbar-collapse" id="collapsibleNavbar">
<ul className="navbar-nav">
<li className="nav-item">
- <Link className="nav-link" to="/help">
+ <Link className="nav-link" to={`${basePath}/help`}>
Help
</Link>
</li>
<li className="nav-item">
- <Link className="nav-link" to="/future">
+ <Link className="nav-link" to={`${basePath}/future`}>
Future
</Link>
</li>
<li className="nav-item">
- <Link className="nav-link" to="/from-to">
+ <Link className="nav-link" to={`${basePath}/from-to`}>
From-to
</Link>
</li>
diff --git a/src/App/index.tsx b/src/App/index.tsx
@@ -9,7 +9,7 @@ import SimpleConvertor from './pages/SimpleConvertor';
import Footer from './comps/Footer';
import Header from './comps/Header';
-import { DEFAULT_TZ, localTimezone } from '../utils';
+import { basePath, DEFAULT_TZ, localTimezone } from '../utils';
import useTime from '../utils/useTime';
function App<never>(): JSX.Element {
@@ -26,7 +26,7 @@ function App<never>(): JSX.Element {
<Header />
<Switch>
<Route
- path="/future"
+ path={`${basePath}/future`}
render={() => (
<FutureConversion
time={now}
@@ -37,9 +37,9 @@ function App<never>(): JSX.Element {
/>
)}
/>
- <Route path="/help" render={() => <Help time={now} />} />
+ <Route path={`${basePath}/help`} render={() => <Help time={now} />} />
<Route
- path="/from-to"
+ path={`${basePath}/from-to`}
render={() => (
<DualConvertor
setTZ1={setTimezone2}
@@ -51,7 +51,7 @@ function App<never>(): JSX.Element {
)}
/>
<Route
- path="/"
+ path={`${basePath}/`}
render={() => (
<SimpleConvertor
setTZ1={setTimezone1}
diff --git a/src/App/pages/DualConvertor.tsx b/src/App/pages/DualConvertor.tsx
@@ -3,7 +3,12 @@ import React from 'react';
import TimezoneInput from '../comps/TimezoneInput';
import SavedTimezones from '../comps/SavedTimezones';
-import { clearTimezones, displayTime, saveTimezones } from '../../utils';
+import {
+ clearTimezones,
+ displayTime,
+ saveTimezones,
+ getSavedZones,
+} from '../../utils';
import { HMSDMY } from '../../utils';
import { IDualConvertor } from '../../utils/interfaces';
@@ -61,6 +66,7 @@ function DualConvertor({
</button>
<button
className="btn btn-danger"
+ disabled={getSavedZones().length === 0}
type="button"
onClick={clearTimezones}
>
diff --git a/src/App/pages/Help.tsx b/src/App/pages/Help.tsx
@@ -4,24 +4,24 @@ import { Link } from 'react-router-dom';
import { IMoment } from '../../utils/interfaces';
import { getAbbr } from '../../utils';
-import { localTimezone } from '../../utils';
+import { basePath, localTimezone } from '../../utils';
function Help({ time }: IMoment): JSX.Element {
return (
<div className="container">
<ol>
<li>
- Use the <Link to="/">homepage</Link> to convert your{' '}
+ Use the <Link to={`${basePath}/`}>homepage</Link> to convert your{' '}
<span className="font-weight-bold">current time</span> (
{getAbbr({ time, timezone: localTimezone })}) to other timezone.
</li>
<li>
- Use the <Link to="/future">/future</Link> to convert a{' '}
+ Use the <Link to={`${basePath}/future`}>/future</Link> to convert a{' '}
<span className="font-weight-bold">future date</span> between
different timezones.
</li>
<li>
- Use the <Link to="/from-to">/from-to</Link> to convert{' '}
+ Use the <Link to={`${basePath}/from-to`}>/from-to</Link> to convert{' '}
<span className="font-weight-bold">current time</span> between
different timezones.
</li>
diff --git a/src/App/pages/SimpleConvertor.tsx b/src/App/pages/SimpleConvertor.tsx
@@ -9,6 +9,7 @@ import {
saveTimezones,
friendlyStr,
localTimezone,
+ getSavedZones,
} from '../../utils';
import { HMSDMY } from '../../utils';
import { ISimpleConvertor } from '../../utils/interfaces';
@@ -59,6 +60,7 @@ function SimpleConvertor({ time, TZ1, setTZ1 }: ISimpleConvertor): JSX.Element {
</button>
<button
className="btn btn-danger"
+ disabled={getSavedZones().length === 0}
type="button"
onClick={clearTimezones}
>
diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -102,6 +102,7 @@ export {
unfriendlyStr
};
+const basePath = process.env.PUBLIC_URL;
const DEFAULT_TZ = 'UTC';
const HM = 'HH:mm';
const HMMDY = 'HH:mm MMMM DD, YYYY';
@@ -113,6 +114,7 @@ const YEAR = new Date().getFullYear();
const YMD = 'YYYY-MM-DD'
export {
+ basePath,
DEFAULT_TZ,
HM,
HMMDY,
