Fix some components being rendered as pages

web/pages/admin/config-social-items.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Typography } from 'antd';
-import EditSocialLinks from './config/general/EditSocialLinks';
+import EditSocialLinks from './config/general/components/EditSocialLinks';
 
 const { Title } = Typography;
 

web/pages/admin/config/general/components/AppearanceConfig.tsx

@@ -3,17 +3,17 @@ import React, { useContext, useEffect, useState } from 'react';
 import { Button, Col, Collapse, Row, Slider, Space } from 'antd';
 import Paragraph from 'antd/lib/typography/Paragraph';
 import Title from 'antd/lib/typography/Title';
-import { EditCustomStyles } from '../../../../components/config/EditCustomStyles';
-import s from './appearance.module.scss';
-import { postConfigUpdateToAPI, RESET_TIMEOUT } from '../../../../utils/config-constants';
+import { EditCustomStyles } from '../../../../../components/config/EditCustomStyles';
+import s from '../appearance.module.scss';
+import { postConfigUpdateToAPI, RESET_TIMEOUT } from '../../../../../utils/config-constants';
 import {
   createInputStatus,
   StatusState,
   STATUS_ERROR,
   STATUS_SUCCESS,
-} from '../../../../utils/input-statuses';
-import { ServerStatusContext } from '../../../../utils/server-status-context';
-import { FormStatusIndicator } from '../../../../components/config/FormStatusIndicator';
+} from '../../../../../utils/input-statuses';
+import { ServerStatusContext } from '../../../../../utils/server-status-context';
+import { FormStatusIndicator } from '../../../../../components/config/FormStatusIndicator';
 
 const { Panel } = Collapse;
 

web/pages/admin/config/general/components/EditInstanceDetails.tsx

@@ -4,8 +4,8 @@ import {
   TextFieldWithSubmit,
   TEXTFIELD_TYPE_TEXTAREA,
   TEXTFIELD_TYPE_URL,
-} from '../../../../components/config/TextFieldWithSubmit';
-import { ServerStatusContext } from '../../../../utils/server-status-context';
+} from '../../../../../components/config/TextFieldWithSubmit';
+import { ServerStatusContext } from '../../../../../utils/server-status-context';
 import {
   postConfigUpdateToAPI,
   TEXTFIELD_PROPS_INSTANCE_URL,
@@ -16,10 +16,10 @@ import {
   FIELD_PROPS_YP,
   FIELD_PROPS_NSFW,
   FIELD_PROPS_HIDE_VIEWER_COUNT,
-} from '../../../../utils/config-constants';
-import { UpdateArgs } from '../../../../types/config-section';
-import { ToggleSwitch } from '../../../../components/config/ToggleSwitch';
-import { EditLogo } from '../../../../components/config/EditLogo';
+} from '../../../../../utils/config-constants';
+import { UpdateArgs } from '../../../../../types/config-section';
+import { ToggleSwitch } from '../../../../../components/config/ToggleSwitch';
+import { EditLogo } from '../../../../../components/config/EditLogo';
 
 const { Title } = Typography;
 

web/pages/admin/config/general/components/EditInstanceTags.tsx

@@ -1,14 +1,14 @@
 /* eslint-disable react/no-array-index-key */
 import React, { useContext, useState, useEffect } from 'react';
 import { Typography, Tag } from 'antd';
-import { ServerStatusContext } from '../../../../utils/server-status-context';
+import { ServerStatusContext } from '../../../../../utils/server-status-context';
 import {
   FIELD_PROPS_TAGS,
   RESET_TIMEOUT,
   postConfigUpdateToAPI,
-} from '../../../../utils/config-constants';
-import { TextField } from '../../../../components/config/TextField';
-import { UpdateArgs } from '../../../../types/config-section';
+} from '../../../../../utils/config-constants';
+import { TextField } from '../../../../../components/config/TextField';
+import { UpdateArgs } from '../../../../../types/config-section';
 import {
   createInputStatus,
   StatusState,
@@ -16,8 +16,8 @@ import {
   STATUS_PROCESSING,
   STATUS_SUCCESS,
   STATUS_WARNING,
-} from '../../../../utils/input-statuses';
-import { TAG_COLOR } from '../../../../components/config/EditValueArray';
+} from '../../../../../utils/input-statuses';
+import { TAG_COLOR } from '../../../../../components/config/EditValueArray';
 
 const { Title } = Typography;
 

web/pages/admin/config/general/components/EditPageContent.tsx

@@ -6,20 +6,20 @@ import { bbedit } from '@uiw/codemirror-theme-bbedit';
 import { markdown, markdownLanguage } from '@codemirror/lang-markdown';
 import { languages } from '@codemirror/language-data';
 
-import { ServerStatusContext } from '../../../../utils/server-status-context';
+import { ServerStatusContext } from '../../../../../utils/server-status-context';
 import {
   postConfigUpdateToAPI,
   RESET_TIMEOUT,
   API_CUSTOM_CONTENT,
-} from '../../../../utils/config-constants';
+} from '../../../../../utils/config-constants';
 import {
   createInputStatus,
   StatusState,
   STATUS_ERROR,
   STATUS_PROCESSING,
   STATUS_SUCCESS,
-} from '../../../../utils/input-statuses';
-import { FormStatusIndicator } from '../../../../components/config/FormStatusIndicator';
+} from '../../../../../utils/input-statuses';
+import { FormStatusIndicator } from '../../../../../components/config/FormStatusIndicator';
 
 const { Title } = Typography;
 

web/pages/admin/config/general/components/EditSocialLinks.tsx

@@ -2,26 +2,30 @@ import React, { useState, useContext, useEffect } from 'react';
 import { Typography, Table, Button, Modal, Input } from 'antd';
 import { ColumnsType } from 'antd/lib/table';
 import { CaretDownOutlined, CaretUpOutlined, DeleteOutlined } from '@ant-design/icons';
-import { SocialDropdown } from '../../../../components/config/SocialDropdown';
-import { fetchData, SOCIAL_PLATFORMS_LIST } from '../../../../utils/apis';
-import { ServerStatusContext } from '../../../../utils/server-status-context';
+import { SocialDropdown } from '../../../../../components/config/SocialDropdown';
+import { fetchData, SOCIAL_PLATFORMS_LIST } from '../../../../../utils/apis';
+import { ServerStatusContext } from '../../../../../utils/server-status-context';
 import {
   API_SOCIAL_HANDLES,
   postConfigUpdateToAPI,
   RESET_TIMEOUT,
   DEFAULT_SOCIAL_HANDLE,
   OTHER_SOCIAL_HANDLE_OPTION,
-} from '../../../../utils/config-constants';
-import { SocialHandle, UpdateArgs } from '../../../../types/config-section';
+} from '../../../../../utils/config-constants';
+import { SocialHandle, UpdateArgs } from '../../../../../types/config-section';
 import {
   isValidMatrixAccount,
   isValidAccount,
   isValidUrl,
   DEFAULT_TEXTFIELD_URL_PATTERN,
-} from '../../../../utils/urls';
-import { TextField } from '../../../../components/config/TextField';
-import { createInputStatus, STATUS_ERROR, STATUS_SUCCESS } from '../../../../utils/input-statuses';
-import { FormStatusIndicator } from '../../../../components/config/FormStatusIndicator';
+} from '../../../../../utils/urls';
+import { TextField } from '../../../../../components/config/TextField';
+import {
+  createInputStatus,
+  STATUS_ERROR,
+  STATUS_SUCCESS,
+} from '../../../../../utils/input-statuses';
+import { FormStatusIndicator } from '../../../../../components/config/FormStatusIndicator';
 
 const { Title } = Typography;
 

web/pages/admin/config/general/index.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Tabs } from 'antd';
 
-import GeneralConfig from './GeneralConfig';
-import AppearanceConfig from './AppearanceConfig';
+import GeneralConfig from './components/GeneralConfig';
+import AppearanceConfig from './components/AppearanceConfig';
 
 export default function PublicFacingDetails() {
   return (

web/pages/admin/config/server/components/EditStorage.tsx

@@ -1,27 +1,27 @@
 import { Button, Collapse } from 'antd';
 import classNames from 'classnames';
 import React, { useContext, useState, useEffect } from 'react';
-import { UpdateArgs } from '../../../../types/config-section';
-import { ServerStatusContext } from '../../../../utils/server-status-context';
-import { AlertMessageContext } from '../../../../utils/alert-message-context';
+import { UpdateArgs } from '../../../../../types/config-section';
+import { ServerStatusContext } from '../../../../../utils/server-status-context';
+import { AlertMessageContext } from '../../../../../utils/alert-message-context';
 
 import {
   postConfigUpdateToAPI,
   API_S3_INFO,
   RESET_TIMEOUT,
   S3_TEXT_FIELDS_INFO,
-} from '../../../../utils/config-constants';
+} from '../../../../../utils/config-constants';
 import {
   createInputStatus,
   StatusState,
   STATUS_ERROR,
   STATUS_PROCESSING,
   STATUS_SUCCESS,
-} from '../../../../utils/input-statuses';
-import { TextField } from '../../../../components/config/TextField';
-import { FormStatusIndicator } from '../../../../components/config/FormStatusIndicator';
-import { isValidUrl } from '../../../../utils/urls';
-import { ToggleSwitch } from '../../../../components/config/ToggleSwitch';
+} from '../../../../../utils/input-statuses';
+import { TextField } from '../../../../../components/config/TextField';
+import { FormStatusIndicator } from '../../../../../components/config/FormStatusIndicator';
+import { isValidUrl } from '../../../../../utils/urls';
+import { ToggleSwitch } from '../../../../../components/config/ToggleSwitch';
 
 const { Panel } = Collapse;
 

web/pages/admin/config/server/components/ServerConfig.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { EditInstanceDetails } from '../../../../components/config/EditInstanceDetails2';
+import { EditInstanceDetails } from '../../../../../components/config/EditInstanceDetails2';
 
 export default function ConfigServerDetails() {
   return (

web/pages/admin/config/server/components/StreamKeys.tsx

@@ -1,9 +1,9 @@
 import React, { useContext, useState } from 'react';
 import { Table, Space, Button, Typography, Alert, Input, Form } from 'antd';
 import { DeleteOutlined, EyeOutlined, PlusOutlined } from '@ant-design/icons';
-import { ServerStatusContext } from '../../../../utils/server-status-context';
+import { ServerStatusContext } from '../../../../../utils/server-status-context';
 
-import { fetchData, UPDATE_STREAM_KEYS } from '../../../../utils/apis';
+import { fetchData, UPDATE_STREAM_KEYS } from '../../../../../utils/apis';
 
 const { Paragraph } = Typography;
 const { Item } = Form;

web/pages/admin/config/server/index.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
 import { Tabs } from 'antd';
 
-import StreamKeys from './StreamKeys';
-import ServerConfig from './ServerConfig';
-import StorageConfig from './StorageConfig';
+import StreamKeys from './components/StreamKeys';
+import ServerConfig from './components/ServerConfig';
+import StorageConfig from './components/StorageConfig';
 
 export default function PublicFacingDetails() {
   return (