Skip to content

Commit fec199c

Browse files
nickvergessennickvergessen
committed
fixup! feat(user_status): Allow to manually revert an automated status
1 parent c5f7328 commit fec199c

3 files changed

Lines changed: 140 additions & 23 deletions

File tree

‎apps/user_status/src/components/PredefinedStatus.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,7 @@ export default {
104104
}
105105
106106
&__clear-at {
107-
opacity: .7;
107+
color: var(--color-text-maxcontrast);
108108
109109
&::before {
110110
content: ' – ';

‎apps/user_status/src/components/PreviousStatus.vue‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
<!--
2+
- @copyright Copyright (c) 2020 Georg Ehrke <oc.list@georgehrke.com>
3+
- @author Georg Ehrke <oc.list@georgehrke.com>
4+
-
5+
- @license GNU AGPL version 3 or any later version
6+
-
7+
- This program is free software: you can redistribute it and/or modify
8+
- it under the terms of the GNU Affero General Public License as
9+
- published by the Free Software Foundation, either version 3 of the
10+
- License, or (at your option) any later version.
11+
-
12+
- This program is distributed in the hope that it will be useful,
13+
- but WITHOUT ANY WARRANTY; without even the implied warranty of
14+
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
15+
- GNU Affero General Public License for more details.
16+
-
17+
- You should have received a copy of the GNU Affero General Public License
18+
- along with this program. If not, see <http://www.gnu.org/licenses/>.
19+
-
20+
-->
21+
<template>
22+
<div class="predefined-status backup-status"
23+
tabindex="0"
24+
@keyup.enter="select"
25+
@keyup.space="select"
26+
@click="select">
27+
<span class="predefined-status__icon">
28+
{{ icon }}
29+
</span>
30+
<span class="predefined-status__message">
31+
{{ message }}
32+
</span>
33+
<span class="predefined-status__clear-at">
34+
{{ $t('user_status', 'Previously set') }}
35+
</span>
36+
37+
<div class="backup-status__reset-button">
38+
<NcButton @click="select">
39+
{{ $t('user_status', 'Reset status') }}
40+
</NcButton>
41+
</div>
42+
</div>
43+
</template>
44+
45+
<script>
46+
import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
47+
48+
export default {
49+
name: 'PreviousStatus',
50+
51+
components: {
52+
NcButton,
53+
},
54+
55+
props: {
56+
icon: {
57+
type: [String, null],
58+
required: true,
59+
},
60+
message: {
61+
type: String,
62+
required: true,
63+
},
64+
},
65+
methods: {
66+
/**
67+
* Emits an event when the user clicks the row
68+
*/
69+
select() {
70+
this.$emit('select')
71+
},
72+
},
73+
}
74+
</script>
75+
76+
<style lang="scss" scoped>
77+
.predefined-status {
78+
display: flex;
79+
flex-wrap: nowrap;
80+
justify-content: flex-start;
81+
flex-basis: 100%;
82+
border-radius: var(--border-radius);
83+
align-items: center;
84+
min-height: 44px;
85+
86+
&:hover,
87+
&:focus {
88+
background-color: var(--color-background-hover);
89+
}
90+
91+
&:active{
92+
background-color: var(--color-background-dark);
93+
}
94+
95+
&__icon {
96+
flex-basis: 40px;
97+
text-align: center;
98+
}
99+
100+
&__message {
101+
font-weight: bold;
102+
padding: 0 6px;
103+
}
104+
105+
&__clear-at {
106+
color: var(--color-text-maxcontrast);
107+
108+
&::before {
109+
content: ' – ';
110+
}
111+
}
112+
}
113+
.backup-status {
114+
&__reset-button {
115+
justify-content: flex-end;
116+
display: flex;
117+
flex-grow: 1;
118+
}
119+
}
120+
</style>

‎apps/user_status/src/components/SetStatusModal.vue‎

Lines changed: 19 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -24,25 +24,6 @@
2424
:title="$t('user_status', 'Set status')"
2525
@close="closeModal">
2626
<div class="set-status-modal">
27-
<!-- Automatic status -->
28-
<template v-if="messageId">
29-
<div class="set-status-modal__header">
30-
<h2>{{ $t('user_status', 'Automated status') }}</h2>
31-
</div>
32-
<div class="set-status-modal__online-status">
33-
{{ $t('user_status', 'Your user status was set automatically') }}
34-
</div>
35-
<div class="status-buttons">
36-
<NcButton :wide="true"
37-
type="secondary"
38-
:text="resetButtonText"
39-
:disabled="isSavingStatus"
40-
@click="revertBackupFromServer">
41-
{{ resetButtonText }}
42-
</NcButton>
43-
</div>
44-
</template>
45-
4627
<!-- Status selector -->
4728
<div class="set-status-modal__header">
4829
<h2>{{ $t('user_status', 'Online status') }}</h2>
@@ -67,6 +48,14 @@
6748
@submit="saveStatus"
6849
@select-icon="setIcon" />
6950
</div>
51+
<div v-if="messageId"
52+
class="set-status-modal__automation-hint">
53+
{{ $t('user_status', 'Your status was set automatically') }}
54+
</div>
55+
<PreviousStatus v-if="messageId"
56+
:icon="backupIcon"
57+
:message="backupMessage"
58+
@select="revertBackupFromServer" />
7059
<PredefinedStatusesList @select-status="selectPredefinedMessage" />
7160
<ClearAtSelect :clear-at="clearAt"
7261
@select-clear-at="setClearAt" />
@@ -97,6 +86,7 @@ import NcButton from '@nextcloud/vue/dist/Components/NcButton'
9786
import { getAllStatusOptions } from '../services/statusOptionsService.js'
9887
import OnlineStatusMixin from '../mixins/OnlineStatusMixin.js'
9988
import PredefinedStatusesList from './PredefinedStatusesList.vue'
89+
import PreviousStatus from './PreviousStatus.vue'
10090
import CustomMessageInput from './CustomMessageInput.vue'
10191
import ClearAtSelect from './ClearAtSelect.vue'
10292
import OnlineStatusSelect from './OnlineStatusSelect.vue'
@@ -110,6 +100,7 @@ export default {
110100
NcModal,
111101
OnlineStatusSelect,
112102
PredefinedStatusesList,
103+
PreviousStatus,
113104
NcButton,
114105
},
115106
mixins: [OnlineStatusMixin],
@@ -133,10 +124,10 @@ export default {
133124
return this.$store.state.userStatus.message || ''
134125
},
135126
backupIcon() {
136-
return this.$store.state.userBackupStatus.icon
127+
return this.$store.state.userBackupStatus.icon || ''
137128
},
138129
backupMessage() {
139-
return this.$store.state.userBackupStatus.message
130+
return this.$store.state.userBackupStatus.message || ''
140131
},
141132
142133
resetButtonText() {
@@ -292,7 +283,6 @@ export default {
292283
}
293284
294285
this.isSavingStatus = false
295-
this.closeModal()
296286
},
297287
},
298288
}
@@ -320,6 +310,13 @@ export default {
320310
margin-bottom: 10px;
321311
}
322312
313+
&__automation-hint {
314+
display: flex;
315+
width: 100%;
316+
margin-bottom: 10px;
317+
color: var(--color-text-maxcontrast);
318+
}
319+
323320
.status-buttons {
324321
display: flex;
325322
padding: 3px;

0 commit comments

Comments
 (0)