Fix issues with basePath.

This commit is contained in:
Mike Cao 2020-11-09 21:01:53 -08:00
parent 1e8c1d0d18
commit 339cd21596
15 changed files with 66 additions and 51 deletions

View file

@ -8,10 +8,12 @@ import { THEME_COLORS } from 'lib/constants';
import styles from './WorldMap.module.css';
import useCountryNames from 'hooks/useCountryNames';
import useLocale from 'hooks/useLocale';
import { useRouter } from 'next/router';
const geoUrl = '/world-110m.json';
export default function WorldMap({ data, className }) {
const { basePath } = useRouter();
const [tooltip, setTooltip] = useState();
const [theme] = useTheme();
const colors = useMemo(
@ -57,7 +59,7 @@ export default function WorldMap({ data, className }) {
>
<ComposableMap projection="geoMercator">
<ZoomableGroup zoom={0.8} minZoom={0.7} center={[0, 40]}>
<Geographies geography={geoUrl}>
<Geographies geography={`${basePath}${geoUrl}`}>
{({ geographies }) => {
return geographies.map(geo => {
const code = geo.properties.ISO_A2;

View file

@ -1,8 +1,6 @@
import React, { useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { Formik, Form, Field } from 'formik';
import { useRouter } from 'next/router';
import { post } from 'lib/web';
import Button from 'components/common/Button';
import FormLayout, {
FormButtons,
@ -10,6 +8,7 @@ import FormLayout, {
FormMessage,
FormRow,
} from 'components/layout/FormLayout';
import usePost from 'hooks/usePost';
const initialValues = {
username: '',
@ -30,11 +29,11 @@ const validate = ({ user_id, username, password }) => {
};
export default function AccountEditForm({ values, onSave, onClose }) {
const { basePath } = useRouter();
const post = usePost();
const [message, setMessage] = useState();
const handleSubmit = async values => {
const { ok, data } = await post(`${basePath}/api/account`, values);
const { ok, data } = await post('/api/account', values);
if (ok) {
onSave();

View file

@ -1,8 +1,6 @@
import React, { useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { useRouter } from 'next/router';
import { Formik, Form, Field } from 'formik';
import { post } from 'lib/web';
import Button from 'components/common/Button';
import FormLayout, {
FormButtons,
@ -10,6 +8,7 @@ import FormLayout, {
FormMessage,
FormRow,
} from 'components/layout/FormLayout';
import usePost from 'hooks/usePost';
const initialValues = {
current_password: '',
@ -38,11 +37,11 @@ const validate = ({ current_password, new_password, confirm_password }) => {
};
export default function ChangePasswordForm({ values, onSave, onClose }) {
const { basePath } = useRouter();
const post = usePost();
const [message, setMessage] = useState();
const handleSubmit = async values => {
const { ok, data } = await post(`${basePath}/api/account/password`, values);
const { ok, data } = await post('/api/account/password', values);
if (ok) {
onSave();

View file

@ -1,8 +1,6 @@
import React, { useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { useRouter } from 'next/router';
import { Formik, Form, Field } from 'formik';
import { del } from 'lib/web';
import Button from 'components/common/Button';
import FormLayout, {
FormButtons,
@ -10,6 +8,7 @@ import FormLayout, {
FormMessage,
FormRow,
} from 'components/layout/FormLayout';
import useDelete from 'hooks/useDelete';
const CONFIRMATION_WORD = 'DELETE';
@ -28,11 +27,11 @@ const validate = ({ confirmation }) => {
};
export default function DeleteForm({ values, onSave, onClose }) {
const { basePath } = useRouter();
const del = useDelete();
const [message, setMessage] = useState();
const handleSubmit = async ({ type, id }) => {
const { ok, data } = await del(`${basePath}/api/${type}/${id}`);
const { ok, data } = await del(`/api/${type}/${id}`);
if (ok) {
onSave();

View file

@ -2,7 +2,6 @@ import React, { useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { Formik, Form, Field } from 'formik';
import { useRouter } from 'next/router';
import { post } from 'lib/web';
import Button from 'components/common/Button';
import FormLayout, {
FormButtons,
@ -13,6 +12,7 @@ import FormLayout, {
import Icon from 'components/common/Icon';
import Logo from 'assets/logo.svg';
import styles from './LoginForm.module.css';
import usePost from 'hooks/usePost';
const validate = ({ username, password }) => {
const errors = {};
@ -28,11 +28,12 @@ const validate = ({ username, password }) => {
};
export default function LoginForm() {
const post = usePost();
const router = useRouter();
const [message, setMessage] = useState();
const handleSubmit = async ({ username, password }) => {
const { ok, status, data } = await post(`${router.basePath}/api/auth/login`, {
const { ok, status, data } = await post('/api/auth/login', {
username,
password,
});
@ -65,8 +66,10 @@ export default function LoginForm() {
>
{() => (
<Form>
<Icon icon={<Logo />} size="xlarge" className={styles.icon} />
<h1 className="center">umami</h1>
<div className={styles.header}>
<Icon icon={<Logo />} size="xlarge" className={styles.icon} />
<h1 className="center">umami</h1>
</div>
<FormRow>
<label htmlFor="username">
<FormattedMessage id="label.username" defaultMessage="Username" />

View file

@ -13,3 +13,11 @@
justify-content: center;
margin: 0 auto;
}
.header {
margin-bottom: 30px;
}
.header h1 {
margin: 12px 0;
}

View file

@ -1,7 +1,6 @@
import React, { useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { Formik, Form, Field } from 'formik';
import { post } from 'lib/web';
import Button from 'components/common/Button';
import FormLayout, {
FormButtons,
@ -11,7 +10,7 @@ import FormLayout, {
} from 'components/layout/FormLayout';
import Checkbox from 'components/common/Checkbox';
import { DOMAIN_REGEX } from 'lib/constants';
import { useRouter } from 'next/router';
import usePost from 'hooks/usePost';
const initialValues = {
name: '',
@ -35,11 +34,11 @@ const validate = ({ name, domain }) => {
};
export default function WebsiteEditForm({ values, onSave, onClose }) {
const { basePath } = useRouter();
const post = usePost();
const [message, setMessage] = useState();
const handleSubmit = async values => {
const { ok, data } = await post(`${basePath}/api/website`, values);
const { ok, data } = await post('/api/website', values);
if (ok) {
onSave();

View file

@ -43,19 +43,12 @@ export default function WebsiteDetails({ websiteId }) {
const [eventsData, setEventsData] = useState();
const {
resolve,
router,
query: { view },
} = usePageQuery();
const BackButton = () => (
<div key="back-button" className={styles.backButton}>
<Link
key="back-button"
href={router.pathname}
as={resolve({ view: undefined })}
icon={<Arrow />}
size="small"
>
<Link key="back-button" href={resolve({ view: undefined })} icon={<Arrow />} size="small">
<FormattedMessage id="label.back" defaultMessage="Back" />
</Link>
</div>