OpenGraph tags added

Viktor · Viktor · commit 213406544665 · 2021-10-31T22:16:00.000+04:00
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -46,5 +46,8 @@ module.exports = {
       'error',
       { 'ignoreRestSiblings': true }
     ]
+  },
+  'globals': {
+    'process': true
   }
 }
diff --git a/README.md b/README.md
@@ -61,9 +61,9 @@
 $ npm run build
 ```
 \
-Если необходимо сделать билд с префиксом в url, установите его в переменной PUBLIC_URL и REACT_APP_PREFIX с косой чертой в начале, но без неё в конце.
+Если необходимо сделать билд с префиксом в url, установите его в переменной PUBLIC_URL с косой чертой в начале, но без неё в конце.
 ```
-$ REACT_APP_PREFIX=/SIPacker npm run build
+$ PUBLIC_URL=/SIPacker npm run build
 ```
 
 ## Запуск с фейковым доменом
diff --git a/package.json b/package.json
@@ -67,7 +67,7 @@
     "sw-start": "http-server build",
     "build": "react-app-rewired build",
     "netlify-build": "react-app-rewired build && echo \"/* /index.html 200\" > build/_redirects",
-    "ghp-build": "PUBLIC_URL=/SIPacker REACT_APP_PREFIX=/SIPacker react-app-rewired build",
+    "ghp-build": "PUBLIC_URL=/SIPacker react-app-rewired build",
     "test": "react-app-rewired test",
     "eject": "react-scripts eject"
   },
diff --git a/public/index.html b/public/index.html
@@ -1,15 +1,5 @@
 <!DOCTYPE html>
 <html lang="ru">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#03053e" />
-    <meta name="description" content="Простой и мощный онлайн-редактор паков к SIGame для всех платформ и любых вопросов" />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <title>SIPacker</title>
-  </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
     <div id="root"></div>
diff --git a/src/App.js b/src/App.js
@@ -15,6 +15,7 @@ import 'dayjs/locale/ru'
 import { history } from './utils'
 import NotFound404 from 'components/NotFound404'
 import ContextMenuProvider from 'components/ContextMenu'
+import { Helmet } from 'react-helmet'
 
 export const darkTheme = createTheme({
   palette: {
@@ -25,11 +26,29 @@ export const darkTheme = createTheme({
   },
 })
 
+function Head() {
+  return (
+    <Helmet>
+      <meta charSet='utf-8' />
+      <link rel='icon' href={`${process.env.PUBLIC_URL}/favicon.ico`} />
+      <meta name='viewport' content='width=device-width, initial-scale=1' />
+      <meta name='theme-color' content='#03053e' />
+      <meta name='description' content='Простой и мощный онлайн-редактор паков к SIGame для всех платформ, работающий без сети и поддерживающий все типы вопросов, события сценария и паков' />
+      <link rel='apple-touch-icon' href={`${process.env.PUBLIC_URL}/logo192.png`} />
+      <link rel='manifest' href={`${process.env.PUBLIC_URL}/manifest.json`} />
+      <meta property='og:type' content='website' />
+      <meta property='og:image' content={`${process.env.PUBLIC_URL}/logo512.png`} />
+      <title>SIPacker</title>
+    </Helmet>
+  )
+}
+
 export default function App() {
   return (
     <Provider store={sipackerStore}>
+      <Head />
       <ThemeProvider theme={darkTheme}>
-        <BrowserRouter history={history} basename={process.env.REACT_APP_PREFIX}>
+        <BrowserRouter history={history} basename={process.env.PUBLIC_URL}>
           <ContextMenuProvider>
             <Container>
               <Navigation />
diff --git a/src/components/ConfirmationDialog/index.js b/src/components/ConfirmationDialog/index.js
@@ -36,7 +36,7 @@ const ConfirmationDialog = React.forwardRef((props, ref) => {
 
   return (
     <MuiDialog
-      maxWidth="xs"
+      maxWidth='xs'
       open={open}
       onClose={() => handleAction(false)}
     >
@@ -55,10 +55,10 @@ const ConfirmationDialog = React.forwardRef((props, ref) => {
         </DialogContentText>
       </DialogContent>
       <DialogActions>
-        <Button autoFocus onClick={() => handleAction(false)} color="primary">
+        <Button autoFocus onClick={() => handleAction(false)} color='primary'>
           Отмена
         </Button>
-        <Button onClick={() => handleAction(true)} color="primary">
+        <Button onClick={() => handleAction(true)} color='primary'>
           {confirmText ?? 'Продолжить'}
         </Button>
       </DialogActions>
diff --git a/src/components/ContextMenu/index.js b/src/components/ContextMenu/index.js
@@ -41,7 +41,7 @@ function ContextMenu(props) {
         ReactDOM.createPortal(
           <Menu
             open={props.menu?.position}
-            anchorReference="anchorPosition"
+            anchorReference='anchorPosition'
             anchorPosition={props.menu?.position && { top: props.menu.position[1], left: props.menu.position[0] }}
             onClose={close}
           >
diff --git a/src/components/ItemsList/AddItem/index.js b/src/components/ItemsList/AddItem/index.js
@@ -67,7 +67,7 @@ function ItemName(props) {
 
   return (
     <FormControl variant='outlined' className={props.className}>
-      <InputLabel size="small">{props.label}</InputLabel>
+      <InputLabel size='small'>{props.label}</InputLabel>
       <OutlinedInput
         label={props.label}
         size='small'
diff --git a/src/components/Navigation/index.js b/src/components/Navigation/index.js
@@ -65,7 +65,7 @@ export default function Navigation() {
                 службы <a
                   href='https://vk.com/id245297843'
                   target='_blank'
-                  rel="noreferrer"
+                  rel='noreferrer'
                   className='onHover'
                 >Роме Кучину</a>, который своим комментарием натолкнул меня на идею создания этого сайта, но не может
                 работать со мной по причине Я в армии.
diff --git a/src/components/RenameDialog/index.js b/src/components/RenameDialog/index.js
@@ -51,10 +51,10 @@ const RenameDialog = React.forwardRef((props, ref) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button autoFocus onClick={handleCancel} color="primary">
+        <Button autoFocus onClick={handleCancel} color='primary'>
           Отмена
         </Button>
-        <Button onClick={handleRename} color="primary" disabled={!value.length}>
+        <Button onClick={handleRename} color='primary' disabled={!value.length}>
           Переименовать
         </Button>
       </DialogActions>
diff --git a/src/routes/Dashboard/packTypes/Upload.js b/src/routes/Dashboard/packTypes/Upload.js
@@ -10,7 +10,7 @@ import { uploadPack } from '../PackUploader'
 import { MdFileUpload } from 'react-icons/md'
 import Dropzone from 'react-dropzone'
 
-const SlideTransition = props => <Slide {...props} direction="right" />
+const SlideTransition = props => <Slide {...props} direction='right' />
 
 function Upload(props) {
   const [entered, setEntered] = React.useState(false)
@@ -64,7 +64,7 @@ function Upload(props) {
         onClose={() => setContent([])}
         TransitionComponent={SlideTransition}
       >
-        <Alert severity="error" className={styles.alert}>
+        <Alert severity='error' className={styles.alert}>
           {content.map((c, i) => <p key={i}>{c.text}</p>)}
         </Alert>
       </Snackbar>
diff --git a/src/routes/Pack/PackToolbar/SavingDialog.js b/src/routes/Pack/PackToolbar/SavingDialog.js
@@ -56,7 +56,7 @@ const SavingDialog = React.forwardRef((props, ref) => {
 
   return (
     <MuiDialog
-      maxWidth="xs"
+      maxWidth='xs'
       open={open}
       TransitionComponent={Transition}
       onClose={() => errors.length && setOpen(false)}

Original file line number	Diff line number	Diff line change
`@@ -46,5 +46,8 @@ module.exports = {`
`46`	`46`	`'error',`
`47`	`47`	`{ 'ignoreRestSiblings': true }`
`48`	`48`	`]`
	`49`	`+ },`
	`50`	`+ 'globals': {`
	`51`	`+ 'process': true`
`49`	`52`	`}`
`50`	`53`	`}`
Original file line number	Diff line number	Diff line change
`@@ -41,7 +41,7 @@ function ContextMenu(props) {`
`41`	`41`	`ReactDOM.createPortal(`
`42`	`42`	`<Menu`
`43`	`43`	`open={props.menu?.position}`
`44`		`- anchorReference="anchorPosition"`
	`44`	`+ anchorReference='anchorPosition'`
`45`	`45`	`anchorPosition={props.menu?.position && { top: props.menu.position[1], left: props.menu.position[0] }}`
`46`	`46`	`onClose={close}`
`47`	`47`	`>`