diff --git a/.babelrc b/.babelrc
deleted file mode 100644
index 3eb02ca..0000000
--- a/.babelrc
+++ /dev/null
@@ -1,20 +0,0 @@
-{
- "presets": [
- "next/babel"
- ],
- "plugins": [
- [
- "babel-plugin-transform-imports",
- {
- "@material-ui/core": {
- "transform": "@material-ui/core/${member}",
- "preventFullImport": true
- },
- "@material-ui/icons": {
- "transform": "@material-ui/icons/${member}",
- "preventFullImport": true
- }
- }
- ]
- ]
-}
\ No newline at end of file
diff --git a/package.json b/package.json
index 3654522..a09ba7f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "zip3",
- "version": "3.2.4",
+ "version": "3.2.5",
"scripts": {
"prepare": "husky install",
"dev": "NODE_ENV=development node server",
@@ -9,16 +9,15 @@
"build:schema": "prisma generate --schema=prisma/schema.prisma",
"start": "node server",
"lint": "next lint",
- "seed": "ts-node --compiler-options \"{\\\"module\\\":\\\"commonjs\\\"}\" --transpile-only prisma/seed.ts",
- "semantic-release": "semantic-release"
+ "seed": "ts-node --compiler-options \"{\\\"module\\\":\\\"commonjs\\\"}\" --transpile-only prisma/seed.ts"
},
"dependencies": {
"@emotion/react": "^11.4.0",
"@emotion/styled": "^11.3.0",
"@iarna/toml": "2.2.5",
- "@material-ui/core": "^5.0.0-alpha.37",
- "@material-ui/icons": "^5.0.0-alpha.37",
- "@material-ui/styles": "^5.0.0-alpha.35",
+ "@mui/icons-material": "^5.0.0",
+ "@mui/material": "^5.0.2",
+ "@mui/styles": "^5.0.1",
"@prisma/client": "^3.1.1",
"@reduxjs/toolkit": "^1.6.0",
"argon2": "^0.28.2",
@@ -44,7 +43,6 @@
"@types/cookie": "^0.4.0",
"@types/multer": "^1.4.6",
"@types/node": "^15.12.2",
- "babel-plugin-transform-imports": "^2.0.0",
"eslint": "^7.32.0",
"eslint-config-next": "11.0.0",
"husky": "^6.0.0",
diff --git a/prisma/migrations/20211003022626_site_name/migration.sql b/prisma/migrations/20211003022626_site_name/migration.sql
new file mode 100644
index 0000000..7192dea
--- /dev/null
+++ b/prisma/migrations/20211003022626_site_name/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN "embedSiteName" TEXT DEFAULT E'{image.file} • {user.name}';
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 56aa597..3a0cb1c 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -17,6 +17,7 @@ model User {
customTheme Theme?
embedTitle String?
embedColor String @default("#2f3136")
+ embedSiteName String? @default("{image.file} • {user.name}")
images Image[]
urls Url[]
}
diff --git a/release.config.js b/release.config.js
deleted file mode 100644
index 3c256dc..0000000
--- a/release.config.js
+++ /dev/null
@@ -1,8 +0,0 @@
-module.exports = {
- branches: ['trunk'],
- plugins: [
- '@semantic-release/commit-analyzer',
- '@semantic-release/github',
- '@semantic-release/changelog'
- ]
-};
\ No newline at end of file
diff --git a/src/components/Alert.tsx b/src/components/Alert.tsx
index d224781..4ecacfa 100644
--- a/src/components/Alert.tsx
+++ b/src/components/Alert.tsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Snackbar, Alert as MuiAlert } from '@material-ui/core';
+import { Snackbar, Alert as MuiAlert } from '@mui/material';
export default function Alert({ open, setOpen, severity, message }) {
return (
diff --git a/src/components/Backdrop.tsx b/src/components/Backdrop.tsx
index dd172f2..472622d 100644
--- a/src/components/Backdrop.tsx
+++ b/src/components/Backdrop.tsx
@@ -2,7 +2,7 @@ import React from 'react';
import {
Backdrop as MuiBackdrop,
CircularProgress,
-} from '@material-ui/core';
+} from '@mui/material';
export default function Backdrop({ open }) {
return (
diff --git a/src/components/Card.tsx b/src/components/Card.tsx
index 970b0cf..d035d8e 100644
--- a/src/components/Card.tsx
+++ b/src/components/Card.tsx
@@ -3,7 +3,7 @@ import {
Card as MuiCard,
CardContent,
Typography,
-} from '@material-ui/core';
+} from '@mui/material';
export default function Card(props) {
const { name, children, ...other } = props;
diff --git a/src/components/CenteredBox.tsx b/src/components/CenteredBox.tsx
index 98d35c2..36378da 100644
--- a/src/components/CenteredBox.tsx
+++ b/src/components/CenteredBox.tsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Box } from '@material-ui/core';
+import { Box } from '@mui/material';
export default function CenteredBox({ children, ...other }) {
return (
diff --git a/src/components/Image.tsx b/src/components/Image.tsx
index 010bdc4..0af75f9 100644
--- a/src/components/Image.tsx
+++ b/src/components/Image.tsx
@@ -9,8 +9,8 @@ import {
DialogTitle,
DialogActions,
DialogContent,
-} from '@material-ui/core';
-import AudioIcon from '@material-ui/icons/Audiotrack';
+} from '@mui/material';
+import AudioIcon from '@mui/icons-material/Audiotrack';
import copy from 'copy-to-clipboard';
import useFetch from 'hooks/useFetch';
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index f638f42..b99f2ef 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -22,8 +22,7 @@ import {
DialogContent,
DialogContentText,
DialogTitle,
- Select,
-} from '@material-ui/core';
+} from '@mui/material';
import {
Menu as MenuIcon,
Home as HomeIcon,
@@ -36,10 +35,11 @@ import {
PeopleAlt as UsersIcon,
Brush as BrushIcon,
Link as URLIcon,
-} from '@material-ui/icons';
+} from '@mui/icons-material';
import copy from 'copy-to-clipboard';
import Backdrop from './Backdrop';
-import { friendlyThemeName, themes } from './Theming';
+import { friendlyThemeName, themes } from 'components/Theming';
+import Select from 'components/input/Select';
import { useRouter } from 'next/router';
import { useStoreDispatch } from 'lib/redux/store';
import { updateUser } from 'lib/redux/reducers/user';
@@ -157,7 +157,7 @@ export default function Layout({ children, user, loading, noPaper }) {
setAnchorEl(null);
};
- const handleUpdateTheme = async (event: React.ChangeEvent<{ value: string }>) => {
+ const handleUpdateTheme = async event => {
const newUser = await useFetch('/api/user', 'PATCH', {
systemTheme: event.target.value || 'dark_blue',
});
diff --git a/src/components/Link.tsx b/src/components/Link.tsx
index b192699..8dbd8d6 100644
--- a/src/components/Link.tsx
+++ b/src/components/Link.tsx
@@ -4,7 +4,7 @@ import React, { forwardRef } from 'react';
import clsx from 'clsx';
import { useRouter } from 'next/router';
import NextLink from 'next/link';
-import MuiLink from '@material-ui/core/Link';
+import MuiLink from '@mui/material/Link';
export const NextLinkComposed = forwardRef(function NextLinkComposed(props: any, ref) {
const { to, linkAs, href, replace, scroll, passHref, shallow, prefetch, locale, ...other } =
diff --git a/src/components/Theming.tsx b/src/components/Theming.tsx
index ec7c10a..64fe1f7 100644
--- a/src/components/Theming.tsx
+++ b/src/components/Theming.tsx
@@ -1,6 +1,6 @@
import React from 'react';
import { ThemeProvider } from '@emotion/react';
-import { CssBaseline } from '@material-ui/core';
+import { CssBaseline } from '@mui/material';
// themes
import dark_blue from 'lib/themes/dark_blue';
diff --git a/src/components/input/Select.tsx b/src/components/input/Select.tsx
new file mode 100644
index 0000000..71fd764
--- /dev/null
+++ b/src/components/input/Select.tsx
@@ -0,0 +1,28 @@
+import React from 'react';
+import { styled, Select as MuiSelect, Input } from '@mui/material';
+import { makeStyles } from '@mui/styles';
+import { useTheme } from '@mui/system';
+
+const CssInput = styled(Input)(({ theme }) => ({
+ '& label.Mui-focused': {
+ color: 'white',
+ },
+ '&': {
+ color: 'white',
+ },
+ '&:before': {
+ borderBottomColor: '#fff8',
+ },
+ '&&:hover:before': {
+ borderBottomColor: theme.palette.primary.dark,
+ },
+ '&:after': {
+ borderBottomColor: theme.palette.primary.main,
+ },
+}));
+
+export default function Select({ ...other }) {
+ return (
+ } {...other}/>
+ );
+}
\ No newline at end of file
diff --git a/src/components/input/TextInput.tsx b/src/components/input/TextInput.tsx
new file mode 100644
index 0000000..fb59f31
--- /dev/null
+++ b/src/components/input/TextInput.tsx
@@ -0,0 +1,41 @@
+import React from 'react';
+import { styled, TextField, Box } from '@mui/material';
+
+const CssTextField = styled(TextField)(({ theme }) => ({
+ '& label.Mui-focused': {
+ color: 'white',
+ },
+ '& input': {
+ color: 'white',
+ },
+ '& .MuiInput-underline:before': {
+ borderBottomColor: '#fff8',
+ },
+ '&& .MuiInput-underline:hover:before': {
+ borderBottomColor: theme.palette.primary.dark,
+ },
+ '& .MuiInput-underline:after': {
+ borderBottomColor: theme.palette.primary.main,
+ },
+}));
+
+
+export default function TextInput({ id, label, formik, ...other }) {
+ return (
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/components/pages/Dashboard.tsx b/src/components/pages/Dashboard.tsx
index a8973ab..98d8179 100644
--- a/src/components/pages/Dashboard.tsx
+++ b/src/components/pages/Dashboard.tsx
@@ -15,8 +15,8 @@ import {
CardActionArea,
CardMedia,
Card as MuiCard,
-} from '@material-ui/core';
-import AudioIcon from '@material-ui/icons/Audiotrack';
+} from '@mui/material';
+import AudioIcon from '@mui/icons-material/Audiotrack';
import Link from 'components/Link';
import Card from 'components/Card';
diff --git a/src/components/pages/Files.tsx b/src/components/pages/Files.tsx
index 35e6c6e..353d8b1 100644
--- a/src/components/pages/Files.tsx
+++ b/src/components/pages/Files.tsx
@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react';
-import { Grid, Pagination, Box, Typography, Accordion, AccordionSummary, AccordionDetails } from '@material-ui/core';
-import { ExpandMore } from '@material-ui/icons';
+import { Grid, Pagination, Box, Typography, Accordion, AccordionSummary, AccordionDetails } from '@mui/material';
+import { ExpandMore } from '@mui/icons-material';
import Backdrop from 'components/Backdrop';
import ZiplineImage from 'components/Image';
diff --git a/src/components/pages/Manage.tsx b/src/components/pages/Manage.tsx
index 54d20ca..e10bd2d 100644
--- a/src/components/pages/Manage.tsx
+++ b/src/components/pages/Manage.tsx
@@ -1,12 +1,15 @@
import React, { useState } from 'react';
-import { TextField, Button, Box, Typography, Select, MenuItem } from '@material-ui/core';
-import Download from '@material-ui/icons/Download';
+import { Button, Box, Typography, MenuItem, Tooltip } from '@mui/material';
+import Download from '@mui/icons-material/Download';
import { useFormik } from 'formik';
import * as yup from 'yup';
import useFetch from 'hooks/useFetch';
import Backdrop from 'components/Backdrop';
import Alert from 'components/Alert';
+import TextInput from 'components/input/TextInput';
+import Select from 'components/input/Select';
+import Link from 'components/Link';
import { useStoreDispatch, useStoreSelector } from 'lib/redux/store';
import { updateUser } from 'lib/redux/reducers/user';
import { useRouter } from 'next/router';
@@ -56,21 +59,19 @@ const themeValidationSchema = yup.object({
});
-function TextInput({ id, label, formik, ...other }) {
+function VarsTooltip({ children }) {
return (
-
+
+ {'{image.file}'} - file name
+ {'{image.mimetype}'} - mimetype
+ {'{image.id}'} - id of the image
+ {'{user.name}'} - your username
+ visit the docs for more variables
+ >
+ }>
+ {children}
+
);
}
@@ -116,6 +117,7 @@ export default function Manage() {
password: '',
embedTitle: user.embedTitle ?? '',
embedColor: user.embedColor,
+ embedSiteName: user.embedSiteName ?? '',
},
validationSchema,
onSubmit: async values => {
@@ -123,6 +125,7 @@ export default function Manage() {
const cleanPassword = values.password.trim();
const cleanEmbedTitle = values.embedTitle.trim();
const cleanEmbedColor = values.embedColor.trim();
+ const cleanEmbedSiteName = values.embedSiteName.trim();
if (cleanUsername === '') return formik.setFieldError('username', 'Username can\'t be nothing');
@@ -133,6 +136,7 @@ export default function Manage() {
password: cleanPassword === '' ? null : cleanPassword,
embedTitle: cleanEmbedTitle === '' ? null : cleanEmbedTitle,
embedColor: cleanEmbedColor === '' ? null : cleanEmbedColor,
+ embedSiteName: cleanEmbedSiteName === '' ? null : cleanEmbedSiteName,
};
const newUser = await useFetch('/api/user', 'PATCH', data);
@@ -190,12 +194,16 @@ export default function Manage() {
- Manage User
+ Manage User
+
+ Want to use variables in embed text? Hover on this or visit the docs for more variables
+