somewhat better import-export tab + minor fixes

This commit is contained in:
Henry Jameson 2025-11-24 20:53:01 +02:00
commit db73631459
7 changed files with 73 additions and 65 deletions

View file

@ -23,6 +23,9 @@
<style lang="scss">
.exporter {
display: flex;
flex-direction: column;
&-processing {
margin: 0.25em;
}

View file

@ -1,5 +1,5 @@
<template>
<div class="importer">
<div class="importer btn-group">
<form>
<input
ref="input"
@ -19,7 +19,7 @@
class="btn button-default"
@click="submit"
>
{{ submitButtonLabel || $t('importer.submit') }}
{{ submitButtonLabel || $t('importer.import') }}
</button>
<div v-if="success">
<button

View file

@ -77,15 +77,14 @@
<div
v-if="isLoggedIn"
:label="$t('settings.mutes_and_blocks')"
:fullHeight="true"
icon="eye-slash"
data-tab-name="mutesAndBlocks"
:full-width="true"
>
<MutesAndBlocksTab />
</div>
<div
:label="$t('settings.clutter')"
:fullHeight="true"
icon="broom"
data-tab-name="clutter"
>
@ -96,6 +95,7 @@
:label="$t('settings.security_tab')"
icon="lock"
data-tab-name="security"
:full-width="true"
>
<SecurityTab />
</div>
@ -113,6 +113,7 @@
icon="palette"
data-tab-name="style"
:delay-render="true"
:full-width="true"
>
<StyleTab />
</div>
@ -122,6 +123,7 @@
icon="paint-brush"
data-tab-name="theme"
:delay-render="true"
:full-width="true"
>
<OldThemeTab />
</div>

View file

@ -2,4 +2,10 @@
h3 {
margin-right: -2em;
}
.importer-exporter {
display: inline-flex;
flex-direction: column;
gap: 0.5em;
}
}

View file

@ -4,57 +4,57 @@
:label="$t('settings.data_import_export_tab')"
>
<div class="setting-item">
<h3>{{ $t('settings.follow_import') }}</h3>
<p>{{ $t('settings.import_followers_from_a_csv_file') }}</p>
<Importer
:submit-handler="importFollows"
:success-message="$t('settings.follows_imported')"
:error-message="$t('settings.follow_import_error')"
/>
</div>
<div class="setting-item">
<h3>{{ $t('settings.follow_export') }}</h3>
<Exporter
:get-content="getFollowsContent"
filename="friends.csv"
:export-button-label="$t('settings.follow_export_button')"
/>
</div>
<div class="setting-item">
<h3>{{ $t('settings.block_import') }}</h3>
<p>{{ $t('settings.import_blocks_from_a_csv_file') }}</p>
<Importer
:submit-handler="importBlocks"
:success-message="$t('settings.blocks_imported')"
:error-message="$t('settings.block_import_error')"
/>
</div>
<div class="setting-item">
<h3>{{ $t('settings.block_export') }}</h3>
<Exporter
:get-content="getBlocksContent"
filename="blocks.csv"
:export-button-label="$t('settings.block_export_button')"
/>
</div>
<div class="setting-item">
<h3>{{ $t('settings.mute_import') }}</h3>
<p>{{ $t('settings.import_mutes_from_a_csv_file') }}</p>
<Importer
:submit-handler="importMutes"
:success-message="$t('settings.mutes_imported')"
:error-message="$t('settings.mute_import_error')"
/>
</div>
<div class="setting-item">
<h3>{{ $t('settings.mute_export') }}</h3>
<Exporter
:get-content="getMutesContent"
filename="mutes.csv"
:export-button-label="$t('settings.mute_export_button')"
/>
</div>
<div class="setting-item">
<h3>{{ $t('settings.import_export.title') }}</h3>
<ul class="setting-list">
<li>
<h4>{{ $t('settings.import_export.follows') }}</h4>
<p>{{ $t('settings.import_followers_from_a_csv_file') }}</p>
<div class="importer-exporter">
<Importer
:submit-handler="importFollows"
:success-message="$t('settings.follows_imported')"
:error-message="$t('settings.follow_import_error')"
/>
<Exporter
:get-content="getFollowsContent"
filename="friends.csv"
:export-button-label="$t('settings.follow_export_button')"
/>
</div>
</li>
<li>
<h4>{{ $t('settings.import_export.mutes') }}</h4>
<p>{{ $t('settings.import_mutes_from_a_csv_file') }}</p>
<div class="importer-exporter">
<Importer
:submit-handler="importMutes"
:success-message="$t('settings.mutes_imported')"
:error-message="$t('settings.mute_import_error')"
/>
<Exporter
:get-content="getMutesContent"
filename="friends.csv"
:export-button-label="$t('settings.mute_export_button')"
/>
</div>
</li>
<li>
<h4>{{ $t('settings.import_export.blocks') }}</h4>
<p>{{ $t('settings.import_blocks_from_a_csv_file') }}</p>
<div class="importer-exporter">
<Importer
:submit-handler="importBlocks"
:success-message="$t('settings.blocks_imported')"
:error-message="$t('settings.block_import_error')"
/>
<Exporter
:get-content="getBlocksContent"
filename="friends.csv"
:export-button-label="$t('settings.block_export_button')"
/>
</div>
</li>
</ul>
<h3>{{ $t('settings.account_backup') }}</h3>
<p>{{ $t('settings.account_backup_description') }}</p>
<table>

View file

@ -68,16 +68,6 @@
&.-hidden {
display: none;
}
&.-full-height:not(.-hidden) {
height: 100%;
display: flex;
flex-direction: column;
> *:not(.tab-content-label) {
flex: 1;
}
}
}
}

View file

@ -132,6 +132,7 @@
},
"importer": {
"submit": "Submit",
"import": "Import",
"success": "Imported successfully.",
"error": "An error occured while importing this file."
},
@ -603,6 +604,12 @@
"follow_export_button": "Export your follows to a csv file",
"follow_import": "Follow import",
"follow_import_error": "Error importing followers",
"import_export": {
"title": "Import / Export",
"follows": "List of users you follow",
"blocks": "List of users you block",
"mutes": "List of users you mute"
},
"follows_imported": "Follows imported! Processing them will take a while.",
"accent": "Accent",
"foreground": "Foreground",