potsda.mn/mobilizon
10
4
Fork 1
Code Issues 22 Pull requests 1 Projects Releases Wiki Activity

fix(apps): Show message when the user doesn't have approved apps yet

Browse source 
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2023-04-05 09:28:23 +02:00
parent d881703386
commit e0ee9c143b
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773
2 changed files with 52 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
js/src/components/core/MaterialIcon.vue
View file

@ -258,6 +258,8 @@ const icons: Record<string, () => Promise<any>> = {
import(`../../../node_modules/vue-material-design-icons/EyeOutline.vue`), import(`../../../node_modules/vue-material-design-icons/EyeOutline.vue`),
PencilOutline: () => PencilOutline: () =>
import(`../../../node_modules/vue-material-design-icons/PencilOutline.vue`), import(`../../../node_modules/vue-material-design-icons/PencilOutline.vue`),
Apps: () =>
import(`../../../node_modules/vue-material-design-icons/Apps.vue`),
}; };
const props = withDefaults( const props = withDefaults(

92
js/src/views/Settings/AppsView.vue
View file

@ -21,49 +21,56 @@
) )
}} }}
</p> </p>
<div <div v-if="authAuthorizedApplications.length > 0">
class="flex justify-between items-center rounded-lg bg-white shadow-xl my-6" <div
v-for="authAuthorizedApplication in authAuthorizedApplications" class="flex justify-between items-center rounded-lg bg-white shadow-xl my-6"
:key="authAuthorizedApplication.id" v-for="authAuthorizedApplication in authAuthorizedApplications"
> :key="authAuthorizedApplication.id"
<div class="p-4"> >
<p class="text-3xl font-bold"> <div class="p-4">
{{ authAuthorizedApplication.application.name }} <p class="text-3xl font-bold">
</p> {{ authAuthorizedApplication.application.name }}
<a </p>
v-if="authAuthorizedApplication.application.website" <a
target="_blank" v-if="authAuthorizedApplication.application.website"
:href="authAuthorizedApplication.application.website" target="_blank"
>{{ :href="authAuthorizedApplication.application.website"
urlToHostname(authAuthorizedApplication.application.website) >{{
}}</a urlToHostname(authAuthorizedApplication.application.website)
> }}</a
<p> >
<span v-if="authAuthorizedApplication.lastUsedAt">{{ <p>
t("Last used on {last_used_date}", { <span v-if="authAuthorizedApplication.lastUsedAt">{{
last_used_date: formatDateString( t("Last used on {last_used_date}", {
authAuthorizedApplication.lastUsedAt last_used_date: formatDateString(
), authAuthorizedApplication.lastUsedAt
}) ),
}}</span> })
<span v-else>{{ t("Never used") }}</span> ⋅ }}</span>
{{ <span v-else>{{ t("Never used") }}</span> ⋅
t("Authorized on {authorization_date}", { {{
authorization_date: formatDateString( t("Authorized on {authorization_date}", {
authAuthorizedApplication.insertedAt authorization_date: formatDateString(
), authAuthorizedApplication.insertedAt
}) ),
}} })
</p> }}
</div> </p>
<div class="p-4"> </div>
<o-button <div class="p-4">
@click="() => revoke({ appTokenId: authAuthorizedApplication.id })" <o-button
variant="danger" @click="
>{{ t("Revoke") }}</o-button () => revoke({ appTokenId: authAuthorizedApplication.id })
> "
variant="danger"
>{{ t("Revoke") }}</o-button
>
</div>
</div> </div>
</div> </div>
<EmptyContent v-else icon="apps" inline>
{{ t("No apps authorized yet") }}
</EmptyContent>
</section> </section>
</div> </div>
</template> </template>
@ -82,6 +89,7 @@ import RouteName from "../../router/name";
import { IUser } from "@/types/current-user.model"; import { IUser } from "@/types/current-user.model";
import { formatDateString } from "@/filters/datetime"; import { formatDateString } from "@/filters/datetime";
import { Notifier } from "@/plugins/notifier"; import { Notifier } from "@/plugins/notifier";
import EmptyContent from "@/components/Utils/EmptyContent.vue";
const { t } = useI18n({ useScope: "global" }); const { t } = useI18n({ useScope: "global" });
@ -94,7 +102,7 @@ const { result: authAuthorizedApplicationsResult } = useQuery<{
const authAuthorizedApplications = computed( const authAuthorizedApplications = computed(
() => () =>
authAuthorizedApplicationsResult.value?.loggedUser authAuthorizedApplicationsResult.value?.loggedUser
?.authAuthorizedApplications ?.authAuthorizedApplications ?? []
); );
const urlToHostname = (url: string | undefined): string | null => { const urlToHostname = (url: string | undefined): string | null => {