From 486585890d674ce3e160d2a8f1e6835e181b0b08 Mon Sep 17 00:00:00 2001
From: tobi <31960611+tsmethurst@users.noreply.github.com>
Date: Tue, 16 Jan 2024 18:28:56 +0100
Subject: [feature] Move + alias account via settings panel (#2519)
* [feature] Move + alias account via settings panel
* lint
* type a bit more diligently
---
web/source/settings/user/migration.tsx | 206 ++++++++++++++++++++++++++++
web/source/settings/user/profile.js | 237 --------------------------------
web/source/settings/user/profile.tsx | 242 +++++++++++++++++++++++++++++++++
web/source/settings/user/settings.js | 154 ---------------------
web/source/settings/user/settings.tsx | 153 +++++++++++++++++++++
5 files changed, 601 insertions(+), 391 deletions(-)
create mode 100644 web/source/settings/user/migration.tsx
delete mode 100644 web/source/settings/user/profile.js
create mode 100644 web/source/settings/user/profile.tsx
delete mode 100644 web/source/settings/user/settings.js
create mode 100644 web/source/settings/user/settings.tsx
(limited to 'web/source/settings/user')
diff --git a/web/source/settings/user/migration.tsx b/web/source/settings/user/migration.tsx
new file mode 100644
index 000000000..7a8b934ac
--- /dev/null
+++ b/web/source/settings/user/migration.tsx
@@ -0,0 +1,206 @@
+/*
+ GoToSocial
+ Copyright (C) GoToSocial Authors admin@gotosocial.org
+ SPDX-License-Identifier: AGPL-3.0-or-later
+
+ 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 .
+*/
+
+import React from "react";
+
+import FormWithData from "../lib/form/form-with-data";
+
+import { useVerifyCredentialsQuery } from "../lib/query/oauth";
+import { useArrayInput, useTextInput } from "../lib/form";
+import { TextInput } from "../components/form/inputs";
+import useFormSubmit from "../lib/form/submit";
+import MutationButton from "../components/form/mutation-button";
+import { useAliasAccountMutation, useMoveAccountMutation } from "../lib/query/user";
+import { FormContext, useWithFormContext } from "../lib/form/context";
+import { store } from "../redux/store";
+
+export default function UserMigration() {
+ return (
+
+ );
+}
+
+function UserMigrationForm({ data: profile }) {
+ let urlStr = store.getState().oauth.instanceUrl ?? "";
+ let url = new URL(urlStr);
+
+ return (
+ <>
+ Account Migration Settings
+
+ The following settings allow you to alias your account to another account
+ elsewhere, and to move your followers and following lists to another account.
+
+
+ Account aliasing is harmless and reversible; you can
+ set and unset up to five account aliases as many times as you wish.
+
+
+ The account move action, on the other hand, has serious and irreversible consequences.
+
+
+ To move, you must set an alias from your account to the target account, using this settings panel.
+
+
+ You must also set an alias from the target account back to your account, using
+ the settings panel of the instance on which the target account resides.
+
+
+ Provide the following details to the other instance:
+
+
+
+
- Account handle/username:
+ - @{profile.acct}@{url.host}
+
+
+
- Account URI:
+ - {urlStr}/users/{profile.username}
+
+
+
+ For more information on account migration, please see the documentation.
+
+
+
+
+ );
+}
+
+function AliasForm({ data: profile }) {
+ const form = {
+ alsoKnownAs: useArrayInput("also_known_as_uris", {
+ source: profile,
+ valueSelector: (p) => (
+ p.source?.also_known_as_uris
+ ? p.source?.also_known_as_uris.map(entry => [entry])
+ : []
+ ),
+ length: 5,
+ }),
+ };
+
+ const [submitForm, result] = useFormSubmit(form, useAliasAccountMutation());
+
+ return (
+
+ );
+}
+
+function AlsoKnownAsURIs({ field: formField }) {
+ return (
+
+
+ {formField.value.map((data, i) => (
+
+ ))}
+
+
-
- {formField.value.map((data, i) => (
-
- ))}
-
-
- );
-}
-
-function Field({ index, data }) {
- const form = useWithFormContext(index, {
- name: useTextInput("name", { defaultValue: data.name }),
- value: useTextInput("value", { defaultValue: data.value })
- });
-
- return (
-
-
-
-
- );
-}
\ No newline at end of file
diff --git a/web/source/settings/user/profile.tsx b/web/source/settings/user/profile.tsx
new file mode 100644
index 000000000..a03d4d247
--- /dev/null
+++ b/web/source/settings/user/profile.tsx
@@ -0,0 +1,242 @@
+/*
+ GoToSocial
+ Copyright (C) GoToSocial Authors admin@gotosocial.org
+ SPDX-License-Identifier: AGPL-3.0-or-later
+
+ 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 .
+*/
+
+import React from "react";
+
+import {
+ useTextInput,
+ useFileInput,
+ useBoolInput,
+ useFieldArrayInput
+} from "../lib/form";
+
+import useFormSubmit from "../lib/form/submit";
+import { useWithFormContext, FormContext } from "../lib/form/context";
+
+import {
+ TextInput,
+ TextArea,
+ FileInput,
+ Checkbox
+} from "../components/form/inputs";
+
+import FormWithData from "../lib/form/form-with-data";
+import FakeProfile from "../components/fake-profile";
+import MutationButton from "../components/form/mutation-button";
+
+import { useInstanceV1Query } from "../lib/query";
+import { useUpdateCredentialsMutation } from "../lib/query/user";
+import { useVerifyCredentialsQuery } from "../lib/query/oauth";
+
+export default function UserProfile() {
+ return (
+
+ );
+}
+
+function UserProfileForm({ data: profile }) {
+ /*
+ User profile update form keys
+ - bool bot
+ - bool locked
+ - string display_name
+ - string note
+ - file avatar
+ - file header
+ - bool enable_rss
+ - string custom_css (if enabled)
+ */
+
+ const { data: instance } = useInstanceV1Query();
+ const instanceConfig = React.useMemo(() => {
+ return {
+ allowCustomCSS: instance?.configuration?.accounts?.allow_custom_css === true,
+ maxPinnedFields: instance?.configuration?.accounts?.max_profile_fields ?? 6
+ };
+ }, [instance]);
+
+ const form = {
+ avatar: useFileInput("avatar", { withPreview: true }),
+ header: useFileInput("header", { withPreview: true }),
+ displayName: useTextInput("display_name", { source: profile }),
+ note: useTextInput("note", { source: profile, valueSelector: (p) => p.source?.note }),
+ customCSS: useTextInput("custom_css", { source: profile, nosubmit: !instanceConfig.allowCustomCSS }),
+ bot: useBoolInput("bot", { source: profile }),
+ locked: useBoolInput("locked", { source: profile }),
+ discoverable: useBoolInput("discoverable", { source: profile}),
+ enableRSS: useBoolInput("enable_rss", { source: profile }),
+ fields: useFieldArrayInput("fields_attributes", {
+ defaultValue: profile?.source?.fields,
+ length: instanceConfig.maxPinnedFields
+ }),
+ };
+
+ const [submitForm, result] = useFormSubmit(form, useUpdateCredentialsMutation(), {
+ changedOnly: true,
+ onFinish: () => {
+ form.avatar.reset();
+ form.header.reset();
+ }
+ });
+
+ return (
+
+ );
+}
+
+function ProfileFields({ field: formField }) {
+ return (
+
+
+ {formField.value.map((data, i) => (
+
+ ))}
+
+
+ );
+}
+
+function Field({ index, data }) {
+ const form = useWithFormContext(index, {
+ name: useTextInput("name", { defaultValue: data.name }),
+ value: useTextInput("value", { defaultValue: data.value })
+ });
+
+ return (
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/web/source/settings/user/settings.js b/web/source/settings/user/settings.js
deleted file mode 100644
index 31ea8c39a..000000000
--- a/web/source/settings/user/settings.js
+++ /dev/null
@@ -1,154 +0,0 @@
-/*
- GoToSocial
- Copyright (C) GoToSocial Authors admin@gotosocial.org
- SPDX-License-Identifier: AGPL-3.0-or-later
-
- 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 .
-*/
-
-const React = require("react");
-
-const query = require("../lib/query");
-
-const {
- useTextInput,
- useBoolInput
-} = require("../lib/form");
-
-const useFormSubmit = require("../lib/form/submit").default;
-
-const {
- Select,
- TextInput,
- Checkbox
-} = require("../components/form/inputs");
-
-const FormWithData = require("../lib/form/form-with-data").default;
-const Languages = require("../components/languages");
-const MutationButton = require("../components/form/mutation-button");
-
-module.exports = function UserSettings() {
- return (
-
- );
-};
-
-function UserSettingsForm({ data }) {
- /* form keys
- - string source[privacy]
- - bool source[sensitive]
- - string source[language]
- - string source[status_content_type]
- */
-
- const form = {
- defaultPrivacy: useTextInput("source[privacy]", { source: data, defaultValue: "unlisted" }),
- isSensitive: useBoolInput("source[sensitive]", { source: data }),
- language: useTextInput("source[language]", { source: data, valueSelector: (s) => s.source.language?.toUpperCase() ?? "EN" }),
- statusContentType: useTextInput("source[status_content_type]", { source: data, defaultValue: "text/plain" }),
- };
-
- const [submitForm, result] = useFormSubmit(form, query.useUpdateCredentialsMutation());
-
- return (
- <>
-
-
-
- );
-}
-
-function PasswordChange() {
- const form = {
- oldPassword: useTextInput("old_password"),
- newPassword: useTextInput("new_password", {
- validator(val) {
- if (val != "" && val == form.oldPassword.value) {
- return "New password same as old password";
- }
- return "";
- }
- })
- };
-
- const verifyNewPassword = useTextInput("verifyNewPassword", {
- validator(val) {
- if (val != "" && val != form.newPassword.value) {
- return "Passwords do not match";
- }
- return "";
- }
- });
-
- const [submitForm, result] = useFormSubmit(form, query.usePasswordChangeMutation());
-
- return (
-
- );
-}
\ No newline at end of file
diff --git a/web/source/settings/user/settings.tsx b/web/source/settings/user/settings.tsx
new file mode 100644
index 000000000..645ef5fd4
--- /dev/null
+++ b/web/source/settings/user/settings.tsx
@@ -0,0 +1,153 @@
+/*
+ GoToSocial
+ Copyright (C) GoToSocial Authors admin@gotosocial.org
+ SPDX-License-Identifier: AGPL-3.0-or-later
+
+ 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 .
+*/
+
+import React from "react";
+
+import query from "../lib/query";
+
+import { useTextInput, useBoolInput } from "../lib/form";
+
+import useFormSubmit from "../lib/form/submit";
+
+import { Select, TextInput, Checkbox } from "../components/form/inputs";
+
+import FormWithData from "../lib/form/form-with-data";
+import Languages from "../components/languages";
+import MutationButton from "../components/form/mutation-button";
+
+export default function UserSettings() {
+ return (
+
+ );
+}
+
+function UserSettingsForm({ data }) {
+ /* form keys
+ - string source[privacy]
+ - bool source[sensitive]
+ - string source[language]
+ - string source[status_content_type]
+ */
+
+ const form = {
+ defaultPrivacy: useTextInput("source[privacy]", { source: data, defaultValue: "unlisted" }),
+ isSensitive: useBoolInput("source[sensitive]", { source: data }),
+ language: useTextInput("source[language]", { source: data, valueSelector: (s) => s.source.language?.toUpperCase() ?? "EN" }),
+ statusContentType: useTextInput("source[status_content_type]", { source: data, defaultValue: "text/plain" }),
+ };
+
+ const [submitForm, result] = useFormSubmit(form, query.useUpdateCredentialsMutation());
+
+ return (
+ <>
+
+
+
+ );
+}
+
+function PasswordChange() {
+ const form = {
+ oldPassword: useTextInput("old_password"),
+ newPassword: useTextInput("new_password", {
+ validator(val) {
+ if (val != "" && val == form.oldPassword.value) {
+ return "New password same as old password";
+ }
+ return "";
+ }
+ })
+ };
+
+ const verifyNewPassword = useTextInput("verifyNewPassword", {
+ validator(val) {
+ if (val != "" && val != form.newPassword.value) {
+ return "Passwords do not match";
+ }
+ return "";
+ }
+ });
+
+ const [submitForm, result] = useFormSubmit(form, query.usePasswordChangeMutation());
+
+ return (
+
+ );
+}
\ No newline at end of file
--
cgit v1.2.3