1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-08-05 13:35:23 +02:00

feat(backend): start multi-tenant support (WIP) (#680)

* fix ts types

* feat(code-generation): ♻️ update code-generation formats

* new scope

* add step button

* fix linter error

* update code-generation tags

* feat(backend):  start multi-tenant support

* feat(backend):  group invitation token generation and signup

* refactor(backend): ♻️ move group admin actions to admin router

* set url base to include `/admin`

* feat(frontend):  generate user sign-up links

* test(backend):  refactor test-suite to further decouple tests (WIP)

* feat(backend): 🐛 assign owner on backup import for recipes

* fix(backend): 🐛 assign recipe owner on migration from other service

Co-authored-by: hay-kot <hay-kot@pm.me>
This commit is contained in:
Hayden 2021-09-09 08:51:29 -08:00 committed by GitHub
parent 3c504e7048
commit bdaf758712
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
90 changed files with 1793 additions and 949 deletions

View file

@ -174,50 +174,44 @@
type="password"
/>
<v-btn :loading="loggingIn" color="primary" type="submit" large rounded class="rounded-xl" block>
Login
{{ $t("user.login") }}
</v-btn>
</v-form>
</v-card-text>
<v-btn v-if="$config.ALLOW_SIGNUP" class="mx-auto" text to="/register"> Register </v-btn>
<v-btn v-else class="mx-auto" text disabled> Invite Only </v-btn>
<v-btn v-if="allowSignup" class="mx-auto" text to="/register"> {{ $t("user.register") }} </v-btn>
<v-btn v-else class="mx-auto" text disabled> {{ $t("user.invite-only") }} </v-btn>
</v-card>
</v-container>
</template>
<script lang="ts">
import { defineComponent } from "@nuxtjs/composition-api";
<script lang="ts" setup>
import { defineComponent, ref, useContext } from "@nuxtjs/composition-api";
import { computed, reactive } from "@vue/reactivity";
const { $auth } = useContext();
const form = reactive({
email: "changeme@email.com",
password: "MyPassword",
});
const loggingIn = ref(false);
const allowSignup = computed(() => process.env.ALLOW_SIGNUP);
async function authenticate() {
loggingIn.value = true;
const formData = new FormData();
formData.append("username", form.email);
formData.append("password", form.password);
await $auth.loginWith("local", { data: formData });
loggingIn.value = false;
}
</script>
<script lang="ts">
export default defineComponent({
layout: "basic",
setup() {
return {};
},
data() {
return {
loggingIn: false,
form: {
email: "changeme@email.com",
password: "MyPassword",
},
};
},
computed: {
allowSignup(): boolean {
// @ts-ignore
return process.env.ALLOW_SIGNUP;
},
},
methods: {
async authenticate() {
this.loggingIn = true;
const formData = new FormData();
formData.append("username", this.form.email);
formData.append("password", this.form.password);
await this.$auth.loginWith("local", { data: formData });
this.loggingIn = false;
},
},
});
</script>
</script>

View file

@ -222,6 +222,9 @@
<v-col cols="12" sm="12" md="8" lg="8">
<RecipeInstructions v-model="recipe.recipeInstructions" :edit="form" />
<div class="d-flex">
<BaseButton v-if="form" class="ml-auto my-2" @click="addStep()"> {{ $t("general.new") }}</BaseButton>
</div>
<RecipeNotes v-model="recipe.notes" :edit="form" />
</v-col>
</v-row>
@ -346,6 +349,22 @@ export default defineComponent({
list.splice(index, 1);
}
function addStep(steps: Array<string> | null = null) {
if (!recipe.value?.recipeInstructions) {
return;
}
if (steps) {
const cleanedSteps = steps.map((step) => {
return { text: step, title: "" };
});
recipe.value.recipeInstructions.push(...cleanedSteps);
} else {
recipe.value.recipeInstructions.push({ text: "", title: "" });
}
}
function addIngredient(ingredients: Array<string> | null = null) {
if (ingredients?.length) {
const newIngredients = ingredients.map((x) => {
@ -386,6 +405,7 @@ export default defineComponent({
api,
form,
loading,
addStep,
deleteRecipe,
updateRecipe,
uploadImage,

View file

@ -4,41 +4,35 @@
<v-card-title class="headline"> User Registration </v-card-title>
<v-card-text>
<v-form ref="domRegisterForm" @submit.prevent="register()">
<ToggleState>
<template #activator="{ toggle }">
<div class="d-flex justify-center my-2">
<v-btn-toggle tile mandatory group color="primary">
<v-btn small @click="toggle(false)"> Create a Group </v-btn>
<v-btn small @click="toggle(true)"> Join a Group </v-btn>
</v-btn-toggle>
</div>
</template>
<template #default="{ state }">
<v-text-field
v-if="!state"
v-model="form.group"
filled
rounded
autofocus
validate-on-blur
class="rounded-lg"
:prepend-icon="$globals.icons.group"
:rules="[tokenOrGroup]"
label="New Group Name"
/>
<v-text-field
v-else
v-model="form.groupToken"
filled
rounded
validate-on-blur
:rules="[tokenOrGroup]"
class="rounded-lg"
:prepend-icon="$globals.icons.group"
label="Group Token"
/>
</template>
</ToggleState>
<div class="d-flex justify-center my-2">
<v-btn-toggle v-model="joinGroup" mandatory tile group color="primary">
<v-btn :value="false" small @click="joinGroup = false"> Create a Group </v-btn>
<v-btn :value="true" small @click="joinGroup = true"> Join a Group </v-btn>
</v-btn-toggle>
</div>
<v-text-field
v-if="!joinGroup"
v-model="form.group"
filled
rounded
autofocus
validate-on-blur
class="rounded-lg"
:prepend-icon="$globals.icons.group"
:rules="[tokenOrGroup]"
label="New Group Name"
/>
<v-text-field
v-else
v-model="form.groupToken"
filled
rounded
validate-on-blur
:rules="[tokenOrGroup]"
class="rounded-lg"
:prepend-icon="$globals.icons.group"
label="Group Token"
/>
<v-text-field
v-model="form.email"
filled
@ -105,29 +99,42 @@
</template>
<script lang="ts">
import { computed, defineComponent, reactive, toRefs, ref, useRouter } from "@nuxtjs/composition-api";
import { computed, defineComponent, reactive, toRefs, ref, useRouter, watch } from "@nuxtjs/composition-api";
import { validators } from "@/composables/use-validators";
import { useApiSingleton } from "~/composables/use-api";
import { alert } from "~/composables/use-toast";
import { useRouterQuery } from "@/composables/use-router";
export default defineComponent({
layout: "basic",
setup() {
const api = useApiSingleton();
const state = reactive({
joinGroup: false,
loggingIn: false,
success: false,
});
const allowSignup = computed(() => process.env.AllOW_SIGNUP);
const router = useRouter();
const token = useRouterQuery("token");
watch(token, (newToken) => {
if (newToken) {
console.log(token);
form.groupToken = newToken;
}
});
if (token) {
state.joinGroup = true;
}
// @ts-ignore
const domRegisterForm = ref<VForm>(null);
const form = reactive({
group: "",
groupToken: "",
groupToken: token,
email: "",
username: "",
password: "",
@ -139,23 +146,24 @@ export default defineComponent({
const passwordMatch = () => form.password === form.passwordConfirm || "Passwords do not match";
const tokenOrGroup = () => form.group !== "" || form.groupToken !== "" || "Group name or token must be given";
const router = useRouter();
async function register() {
if (!domRegisterForm.value?.validate()) {
return;
}
const { data, response } = await api.register.register(form);
const { response } = await api.register.register(form);
if (response?.status === 201) {
state.success = true;
alert.success("Registration Success");
router.push("/user/login");
}
console.log(data, response);
}
return {
token,
domRegisterForm,
validators,
allowSignup,

View file

@ -5,8 +5,10 @@
<v-img max-height="200" max-width="200" class="mb-2" :src="require('~/static/svgs/manage-profile.svg')"></v-img>
</template>
<template #title> Your Profile Settings </template>
Some text here...
</BasePageTitle>
<section>
<ToggleState tag="article">
<template #activator="{ toggle, state }">
@ -19,9 +21,8 @@
{{ $t("settings.profile") }}
</v-btn>
</template>
<template #default="{ state }">
<v-slide-x-transition group mode="in" hide-on-leave>
<v-slide-x-transition>
<div v-if="!state" key="personal-info">
<BaseCardSectionTitle class="mt-10" title="Personal Information"> </BaseCardSectionTitle>
<v-card tag="article" outlined>
@ -90,8 +91,14 @@
label="Show advanced features (API Keys, Webhooks, and Data Management)"
@change="updateUser"
></v-checkbox>
<div class="d-flex justify-center mt-5">
<v-btn outlined class="rounded-xl" to="/user/group"> Looking for Privacy Settings? </v-btn>
<div class="d-flex flex-wrap justify-center mt-5">
<v-btn outlined class="rounded-xl my-1 mx-1" to="/user/profile" nuxt exact>
<v-icon left>
{{ $globals.icons.backArrow }}
</v-icon>
Back to Profile
</v-btn>
<v-btn outlined class="rounded-xl my-1 mx-1" to="/user/group"> Looking for Privacy Settings? </v-btn>
</div>
</section>
</v-container>

View file

@ -9,6 +9,23 @@
Manage your profile, recipes, and group settings.
<a href="https://hay-kot.github.io/mealie/" target="_blank"> Learn More </a>
</p>
<v-card flat width="100%" max-width="600px">
<v-card-actions class="d-flex justify-center">
<v-btn outlined rounded @click="getSignupLink()">
<v-icon left>
{{ $globals.icons.createAlt }}
</v-icon>
Get Invite Link
</v-btn>
</v-card-actions>
<v-card-text v-if="generatedLink !== ''" class="d-flex">
<v-text-field v-model="generatedLink" solo readonly>
<template #append>
<AppButtonCopy :copy-text="generatedLink" />
</template>
</v-text-field>
</v-card-text>
</v-card>
</section>
<section>
<div>
@ -21,7 +38,7 @@
:link="{ text: 'Manage User Profile', to: '/user/profile/edit' }"
:image="require('~/static/svgs/manage-profile.svg')"
>
<template #title> User Profile </template>
<template #title> User Settings </template>
Manage your preferences, change your password, and update your email
</UserProfileLinkCard>
</v-col>
@ -78,8 +95,9 @@
</template>
<script lang="ts">
import { computed, defineComponent, useContext } from "@nuxtjs/composition-api";
import { computed, defineComponent, useContext, ref } from "@nuxtjs/composition-api";
import UserProfileLinkCard from "@/components/Domain/User/UserProfileLinkCard.vue";
import { useApiSingleton } from "~/composables/use-api";
export default defineComponent({
components: {
@ -88,7 +106,23 @@ export default defineComponent({
setup() {
const user = computed(() => useContext().$auth.user);
return { user };
const generatedLink = ref("");
const api = useApiSingleton();
async function getSignupLink() {
const { data } = await api.groups.createInvitation({ uses: 1 });
if (data) {
generatedLink.value = constructLink(data.token);
}
}
function constructLink(token: string) {
return `${window.location.origin}/register?token=${token}`;
}
return { user, constructLink, generatedLink, getSignupLink };
},
});
</script>