feat(front): Service worker is coming!

6 files changed, 0 insertions, 344 deletions

diff --git a/Timeline/ClientApp/src/home/Home.tsx b/Timeline/ClientApp/src/home/Home.tsx
deleted file mode 100644
index 495781d0..00000000
--- a/Timeline/ClientApp/src/home/Home.tsx
+++ /dev/null
@@ -1,155 +0,0 @@
-import React from 'react';

-import { useHistory } from 'react-router';

-import { Row, Container, Button, Col } from 'reactstrap';

-import { useTranslation } from 'react-i18next';

-import axios from 'axios';

-

-import { apiBaseUrl } from '../config';

-import { useUser } from '../data/user';

-import { TimelineInfo } from '../data/timeline';

-

-import AppBar from '../common/AppBar';

-import SearchInput from '../common/SearchInput';

-import TimelineBoardAreaWithoutUser from './TimelineBoardAreaWithoutUser';

-import TimelineBoardAreaWithUser from './TimelineBoardAreaWithUser';

-import TimelineCreateDialog from './TimelineCreateDialog';

-

-const Home: React.FC = (_) => {

-  const history = useHistory();

-

-  const { t } = useTranslation();

-

-  const user = useUser();

-

-  const [navText, setNavText] = React.useState<string>('');

-

-  const [publicTimelines, setPublicTimelines] = React.useState<

-    TimelineInfo[] | undefined

-  >(undefined);

-  const [ownTimelines, setOwnTimelines] = React.useState<

-    TimelineInfo[] | undefined

-  >(undefined);

-  const [joinTimelines, setJoinTimelines] = React.useState<

-    TimelineInfo[] | undefined

-  >(undefined);

-

-  React.useEffect(() => {

-    let subscribe = true;

-    if (user == null) {

-      setOwnTimelines(undefined);

-      setJoinTimelines(undefined);

-      void axios

-        .get<TimelineInfo[]>(`${apiBaseUrl}/timelines?visibility=public`)

-        .then((res) => {

-          if (subscribe) {

-            setPublicTimelines(res.data);

-          }

-        });

-    } else {

-      setPublicTimelines(undefined);

-      void axios

-        .get<TimelineInfo[]>(

-          `${apiBaseUrl}/timelines?relate=${user.username}&relateType=own`

-        )

-        .then((res) => {

-          if (subscribe) {

-            setOwnTimelines(res.data);

-          }

-        });

-      void axios

-        .get<TimelineInfo[]>(

-          `${apiBaseUrl}/timelines?relate=${user.username}&relateType=join`

-        )

-        .then((res) => {

-          if (subscribe) {

-            setJoinTimelines(res.data);

-          }

-        });

-    }

-    return () => {

-      subscribe = false;

-    };

-  }, [user]);

-

-  const [dialog, setDialog] = React.useState<'create' | null>(null);

-

-  const goto = React.useCallback((): void => {

-    if (navText === '') {

-      history.push('users/crupest');

-    } else if (navText.startsWith('@')) {

-      history.push(`users/${navText.slice(1)}`);

-    } else {

-      history.push(`timelines/${navText}`);

-    }

-  }, [navText, history]);

-

-  const openCreateDialog = React.useCallback(() => {

-    setDialog('create');

-  }, []);

-

-  const closeDialog = React.useCallback(() => {

-    setDialog(null);

-  }, []);

-

-  return (

-    <>

-      <AppBar />

-      <Container fluid style={{ marginTop: '56px' }}>

-        <Row>

-          <Col>

-            <SearchInput

-              className="justify-content-center"

-              value={navText}

-              onChange={setNavText}

-              onButtonClick={goto}

-              buttonText={t('home.go')}

-              placeholder="@crupest"

-              additionalButton={

-                user != null && (

-                  <Button color="success" outline onClick={openCreateDialog}>

-                    {t('home.createButton')}

-                  </Button>

-                )

-              }

-            />

-          </Col>

-        </Row>

-        {(() => {

-          if (user == null) {

-            return (

-              <TimelineBoardAreaWithoutUser publicTimelines={publicTimelines} />

-            );

-          } else {

-            return (

-              <TimelineBoardAreaWithUser

-                ownTimelines={ownTimelines}

-                joinTimelines={joinTimelines}

-              />

-            );

-          }

-        })()}

-      </Container>

-      <footer className="text-right">

-        <a

-          className="mx-3 text-muted"

-          href="http://beian.miit.gov.cn/"

-          target="_blank"

-          rel="noopener noreferrer"

-        >

-          <small>鄂ICP备18030913号-1</small>

-        </a>

-        <a

-          className="mx-3 text-muted"

-          href="http://www.beian.gov.cn/"

-          target="_blank"

-          rel="noopener noreferrer"

-        >

-          <small className="white-space-no-wrap">公安备案 42112102000124</small>

-        </a>

-      </footer>

-      {dialog === 'create' && <TimelineCreateDialog open close={closeDialog} />}

-    </>

-  );

-};

-

-export default Home;

diff --git a/Timeline/ClientApp/src/home/TimelineBoard.tsx b/Timeline/ClientApp/src/home/TimelineBoard.tsx
deleted file mode 100644
index 2e017bf7..00000000
--- a/Timeline/ClientApp/src/home/TimelineBoard.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import React from 'react';

-import clsx from 'clsx';

-import { Link } from 'react-router-dom';

-import { Spinner } from 'reactstrap';

-

-import { TimelineInfo } from '../data/timeline';

-

-import TimelineLogo from '../common/TimelineLogo';

-import UserTimelineLogo from '../common/UserTimelineLogo';

-

-export interface TimelineBoardProps {

-  title?: string;

-  timelines?: TimelineInfo[];

-  className?: string;

-}

-

-const TimelineBoard: React.FC<TimelineBoardProps> = props => {

-  const { title, timelines, className } = props;

-

-  return (

-    <div className={clsx('timeline-board', className)}>

-      {title != null && <h3 className="text-center">{title}</h3>}

-      {(() => {

-        if (timelines == null) {

-          return (

-            <div className="d-flex flex-grow-1 justify-content-center align-items-center">

-              <Spinner color="primary" />

-            </div>

-          );

-        } else {

-          return timelines.map(timeline => {

-            const { name } = timeline;

-            const isPersonal = name.startsWith('@');

-            const url = isPersonal

-              ? `/users/${timeline.owner.username}`

-              : `/timelines/${name}`;

-            return (

-              <div key={name} className="timeline-board-item">

-                {isPersonal ? (

-                  <UserTimelineLogo className="icon" />

-                ) : (

-                  <TimelineLogo className="icon" />

-                )}

-                <Link to={url}>{name}</Link>

-              </div>

-            );

-          });

-        }

-      })()}

-    </div>

-  );

-};

-

-export default TimelineBoard;

diff --git a/Timeline/ClientApp/src/home/TimelineBoardAreaWithUser.tsx b/Timeline/ClientApp/src/home/TimelineBoardAreaWithUser.tsx
deleted file mode 100644
index a8603b9e..00000000
--- a/Timeline/ClientApp/src/home/TimelineBoardAreaWithUser.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import React from 'react';

-import { Row, Col } from 'reactstrap';

-import { useTranslation } from 'react-i18next';

-

-import TimelineBoard from './TimelineBoard';

-import { TimelineInfo } from '../data/timeline';

-

-interface TimelineBoardAreaWithUserProps {

-  ownTimelines?: TimelineInfo[];

-  joinTimelines?: TimelineInfo[];

-}

-

-const TimelineBoardAreaWithUser: React.FC<TimelineBoardAreaWithUserProps> = (

-  props

-) => {

-  const { t } = useTranslation();

-

-  return (

-    <Row className="my-2 justify-content-center">

-      <Col sm="6" lg="5" className="py-2">

-        <TimelineBoard

-          title={t('home.ownTimeline')}

-          timelines={props.ownTimelines}

-        />

-      </Col>

-      <Col sm="6" lg="5" className="py-2">

-        <TimelineBoard

-          title={t('home.joinTimeline')}

-          timelines={props.joinTimelines}

-        />

-      </Col>

-    </Row>

-  );

-};

-

-export default TimelineBoardAreaWithUser;

diff --git a/Timeline/ClientApp/src/home/TimelineBoardAreaWithoutUser.tsx b/Timeline/ClientApp/src/home/TimelineBoardAreaWithoutUser.tsx
deleted file mode 100644
index dc05ff09..00000000
--- a/Timeline/ClientApp/src/home/TimelineBoardAreaWithoutUser.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from 'react';

-import { Row, Col } from 'reactstrap';

-

-import { TimelineInfo } from '../data/timeline';

-

-import TimelineBoard from './TimelineBoard';

-

-interface TimelineBoardAreaWithoutUserProps {

-  publicTimelines?: TimelineInfo[];

-}

-

-const TimelineBoardAreaWithoutUser: React.FC<TimelineBoardAreaWithoutUserProps> = (

-  props

-) => {

-  const { publicTimelines } = props;

-

-  return (

-    <Row className="my-2 justify-content-center">

-      <Col sm="8" lg="6">

-        <TimelineBoard timelines={publicTimelines} />

-      </Col>

-    </Row>

-  );

-};

-

-export default TimelineBoardAreaWithoutUser;

diff --git a/Timeline/ClientApp/src/home/TimelineCreateDialog.tsx b/Timeline/ClientApp/src/home/TimelineCreateDialog.tsx
deleted file mode 100644
index 27c9d0d6..00000000
--- a/Timeline/ClientApp/src/home/TimelineCreateDialog.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import React from 'react';

-import { useHistory } from 'react-router';

-import axios from 'axios';

-

-import { apiBaseUrl } from '../config';

-import { useUserLoggedIn } from '../data/user';

-import { validateTimelineName } from '../data/timeline';

-

-import OperationDialog from '../common/OperationDialog';

-

-interface TimelineCreateDialogProps {

-  open: boolean;

-  close: () => void;

-}

-

-const TimelineCreateDialog: React.FC<TimelineCreateDialogProps> = (props) => {

-  const history = useHistory();

-  const user = useUserLoggedIn();

-

-  let nameSaved: string;

-

-  return (

-    <OperationDialog

-      open={props.open}

-      close={props.close}

-      titleColor="success"

-      title="home.createDialog.title"

-      inputScheme={[

-        {

-          type: 'text',

-          label: 'home.createDialog.name',

-          helperText: 'home.createDialog.nameFormat',

-          validator: (name) => {

-            if (name.length === 0) {

-              return 'home.createDialog.noEmpty';

-            } else if (name.length > 26) {

-              return 'home.createDialog.tooLong';

-            } else if (!validateTimelineName(name)) {

-              return 'home.createDialog.badFormat';

-            } else {

-              return null;

-            }

-          },

-        },

-      ]}

-      onProcess={([name]) => {

-        nameSaved = name as string;

-        return axios.post(`${apiBaseUrl}/timelines?token=${user.token}`, {

-          name,

-        });

-      }}

-      onSuccessAndClose={() => {

-        history.push(`timelines/${nameSaved}`);

-      }}

-      failurePrompt={(e) => `${e as string}`}

-    />

-  );

-};

-

-export default TimelineCreateDialog;

diff --git a/Timeline/ClientApp/src/home/home.sass b/Timeline/ClientApp/src/home/home.sass
deleted file mode 100644
index 28a2e5f3..00000000
--- a/Timeline/ClientApp/src/home/home.sass
+++ /dev/null
@@ -1,13 +0,0 @@
-.timeline-board-item

-  font-size: 1.1em

-  @extend .my-2

-  .icon

-    height: 1.3em

-    @extend .mr-2

-

-.timeline-board

-  @extend .cru-card

-  @extend .d-flex

-  @extend .flex-column

-  @extend .p-3

-  min-height: 200px