diff --git a/web/source/css/base.css b/web/source/css/base.css
index 4829a28e7..5539c4fc9 100644
--- a/web/source/css/base.css
+++ b/web/source/css/base.css
@@ -290,6 +290,12 @@ input, textarea {
padding-bottom: 0.1rem;
}
+hr {
+ color: transparent;
+ width: 100%;
+ border-bottom: 0.02rem solid $border-accent;
+}
+
footer {
align-self: end;
padding: 2rem 0 1rem 0;
diff --git a/web/source/settings-panel/lib/api/index.js b/web/source/settings-panel/lib/api/index.js
index 6240f9455..3bd361d78 100644
--- a/web/source/settings-panel/lib/api/index.js
+++ b/web/source/settings-panel/lib/api/index.js
@@ -125,5 +125,6 @@ module.exports = {
fetch: fetchInstance
},
oauth: require("./oauth")({apiCall, getCurrentUrl}),
- user: require("./user")({apiCall})
+ user: require("./user")({apiCall}),
+ apiCall
};
\ No newline at end of file
diff --git a/web/source/settings-panel/old/user/security.js b/web/source/settings-panel/old/user/security.js
deleted file mode 100644
index 63367dd1d..000000000
--- a/web/source/settings-panel/old/user/security.js
+++ /dev/null
@@ -1,80 +0,0 @@
-/*
- GoToSocial
- Copyright (C) 2021-2022 GoToSocial Authors admin@gotosocial.org
-
- This program is free software: you can redistribute it and/or modify
- it under the terms of the GNU Affero General Public License as published by
- the Free Software Foundation, either version 3 of the License, or
- (at your option) any later version.
-
- This program is distributed in the hope that it will be useful,
- but WITHOUT ANY WARRANTY; without even the implied warranty of
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- GNU Affero General Public License for more details.
-
- You should have received a copy of the GNU Affero General Public License
- along with this program. If not, see .
-*/
-
-"use strict";
-
-const React = require("react");
-const Promise = require("bluebird");
-
-const Submit = require("../../lib/submit");
-
-module.exports = function Security({oauth}) {
- const [errorMsg, setError] = React.useState("");
- const [statusMsg, setStatus] = React.useState("");
-
- const [oldPassword, setOldPassword] = React.useState("");
- const [newPassword, setNewPassword] = React.useState("");
- const [newPasswordConfirm, setNewPasswordConfirm] = React.useState("");
-
- const submit = (e) => {
- e.preventDefault();
-
- if (newPassword !== newPasswordConfirm) {
- setError("New password and confirm new password did not match!");
- return;
- }
-
- setStatus("PATCHing");
- setError("");
- return Promise.try(() => {
- let formDataInfo = new FormData();
- formDataInfo.set("old_password", oldPassword);
- formDataInfo.set("new_password", newPassword);
- return oauth.apiRequest("/api/v1/user/password_change", "POST", formDataInfo, "form");
- }).then((json) => {
- setStatus("Saved!");
- setOldPassword("");
- setNewPassword("");
- setNewPasswordConfirm("");
- }).catch((e) => {
- setError(e.message);
- setStatus("");
- });
- };
-
- return (
-
-
Password Change
-
-
- );
-};
diff --git a/web/source/settings-panel/old/user/style.css b/web/source/settings-panel/old/user/style.css
deleted file mode 100644
index 021b1816e..000000000
--- a/web/source/settings-panel/old/user/style.css
+++ /dev/null
@@ -1,118 +0,0 @@
-/*
- GoToSocial
- Copyright (C) 2021-2022 GoToSocial Authors admin@gotosocial.org
-
- This program is free software: you can redistribute it and/or modify
- it under the terms of the GNU Affero General Public License as published by
- the Free Software Foundation, either version 3 of the License, or
- (at your option) any later version.
-
- This program is distributed in the hope that it will be useful,
- but WITHOUT ANY WARRANTY; without even the implied warranty of
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- GNU Affero General Public License for more details.
-
- You should have received a copy of the GNU Affero General Public License
- along with this program. If not, see .
-*/
-
-section.basic, section.posts, section.security {
- form {
- display: flex;
- flex-direction: column;
- gap: 1rem;
-
- input, textarea {
- width: 100%;
- line-height: 1.5rem;
- }
-
- input[type=checkbox] {
- justify-self: start;
- width: initial;
- }
-
- input:read-only {
- border: none;
- }
-
- input:invalid {
- border-color: red;
- }
- }
-
- textarea {
- width: 100%;
- height: 8rem;
- }
-
- h1 {
- margin-bottom: 0.5rem;
- }
-
- img {
- display: flex;
- justify-content: center;
- align-items: center;
- border: $boxshadow_border;
- box-shadow: $box-shadow;
- object-fit: cover;
- border-radius: 0.2rem;
- box-sizing: border-box;
- margin-bottom: 0.5rem;
- }
-
- .avatarpreview {
- height: 8.5rem;
- width: 8.5rem;
- }
-
- .headerpreview {
- width: 100%;
- aspect-ratio: 3 / 1;
- overflow: hidden;
- }
-
- .moreinfolink {
- font-size: 0.9em;
- }
-}
-
-.labelinput .border {
- border-radius: 0.2rem;
- border: 0.15rem solid $border_accent;
- padding: 0.3rem;
- display: flex;
- flex-direction: column;
-}
-
-.file-input.button {
- display: inline-block;
- font-size: 1rem;
- font-weight: normal;
- padding: 0.3rem 0.3rem;
- align-self: flex-start;
- /* background: $border_accent; */
- margin-right: 0.2rem;
-}
-
-.labelinput, .labelselect {
- display: flex;
- flex-direction: column;
- gap: 0.4rem;
-}
-
-.labelcheckbox {
- display: flex;
- gap: 0.4rem;
-}
-
-.titlesave {
- display: flex;
- flex-wrap: wrap;
- gap: 0.4rem;
-}
-
-.logout {
- margin-bottom: 2rem;
-}
diff --git a/web/source/settings-panel/user/security.js b/web/source/settings-panel/user/security.js
new file mode 100644
index 000000000..0d9fe63c3
--- /dev/null
+++ b/web/source/settings-panel/user/security.js
@@ -0,0 +1,26 @@
+/*
+ GoToSocial
+ Copyright (C) 2021-2022 GoToSocial Authors admin@gotosocial.org
+
+ This program is free software: you can redistribute it and/or modify
+ it under the terms of the GNU Affero General Public License as published by
+ the Free Software Foundation, either version 3 of the License, or
+ (at your option) any later version.
+
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ GNU Affero General Public License for more details.
+
+ You should have received a copy of the GNU Affero General Public License
+ along with this program. If not, see .
+*/
+
+"use strict";
+
+const React = require("react");
+const Promise = require("bluebird");
+const Redux = require("react-redux");
+
+const Submit = require("../../lib/submit");
+const api = require("../../lib");
diff --git a/web/source/settings-panel/user/settings.js b/web/source/settings-panel/user/settings.js
index c6ad08ffc..ac023254e 100644
--- a/web/source/settings-panel/user/settings.js
+++ b/web/source/settings-panel/user/settings.js
@@ -82,6 +82,64 @@ module.exports = function UserSettings() {
+
+
+
);
-};
\ No newline at end of file
+};
+
+function PasswordChange({oauth}) {
+ const dispatch = Redux.useDispatch();
+
+ const [errorMsg, setError] = React.useState("");
+ const [statusMsg, setStatus] = React.useState("");
+
+ const [oldPassword, setOldPassword] = React.useState("");
+ const [newPassword, setNewPassword] = React.useState("");
+ const [newPasswordConfirm, setNewPasswordConfirm] = React.useState("");
+
+ function submit() {
+ if (newPassword !== newPasswordConfirm) {
+ setError("New password and confirm new password did not match!");
+ return;
+ }
+
+ setStatus("PATCHing");
+ setError("");
+ return Promise.try(() => {
+ let data = {
+ old_password: oldPassword,
+ new_password: newPassword
+ };
+ return dispatch(api.apiCall("POST", "/api/v1/user/password_change", data, "form"));
+ }).then(() => {
+ setStatus("Saved!");
+ setOldPassword("");
+ setNewPassword("");
+ setNewPasswordConfirm("");
+ }).catch((e) => {
+ setError(e.message);
+ setStatus("");
+ });
+ }
+
+ return (
+ <>
+