@mongoosejs/studio 0.0.62 → 0.0.64
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/frontend/public/app.js +8 -5
- package/frontend/public/tw.css +4 -0
- package/frontend/src/dashboard/dashboard.html +3 -4
- package/frontend/src/dashboard/edit-dashboard/edit-dashboard.html +9 -8
- package/frontend/src/team/team.html +16 -8
- package/frontend/src/team/team.js +5 -2
- package/package.json +1 -1
- package/test.html +0 -57
package/frontend/public/app.js
CHANGED
|
@@ -2127,17 +2127,20 @@ module.exports = app => app.component('team', {
|
|
|
2127
2127
|
users: null,
|
|
2128
2128
|
invitations: null,
|
|
2129
2129
|
showNewInvitationModal: false,
|
|
2130
|
-
showRemoveModal: null
|
|
2130
|
+
showRemoveModal: null,
|
|
2131
|
+
status: 'loading'
|
|
2131
2132
|
}),
|
|
2132
2133
|
async mounted() {
|
|
2133
2134
|
const { workspace, users, invitations } = await mothership.getWorkspaceTeam();
|
|
2134
2135
|
this.workspace = workspace;
|
|
2135
2136
|
this.users = users;
|
|
2136
2137
|
this.invitations = invitations;
|
|
2138
|
+
this.status = 'loaded';
|
|
2137
2139
|
},
|
|
2138
2140
|
computed: {
|
|
2139
2141
|
paymentLink() {
|
|
2140
|
-
return 'https://buy.stripe.com/
|
|
2142
|
+
return 'https://buy.stripe.com/3csaFg8XTdd0d6U7sy?client_reference_id=' + this.workspace?._id;
|
|
2143
|
+
// return 'https://buy.stripe.com/test_eVaeYa2jC7565Lq7ss?client_reference_id=' + this.workspace?._id;
|
|
2141
2144
|
}
|
|
2142
2145
|
},
|
|
2143
2146
|
methods: {
|
|
@@ -2866,7 +2869,7 @@ module.exports = "<div class=\"py-2\">\n <div v-if=\"header\" class=\"border-b
|
|
|
2866
2869
|
/***/ ((module) => {
|
|
2867
2870
|
|
|
2868
2871
|
"use strict";
|
|
2869
|
-
module.exports = "<div class=\"dashboard px-1\">\n <div v-if=\"status === 'loading'\" class=\"max-w-5xl mx-auto text-center\">\n <img src=\"images/loader.gif\" class=\"inline mt-10\">\n </div>\n <div v-if=\"dashboard && status === 'loaded'\" class=\"max-w-5xl mx-auto\">\n <div class=\"flex items-center w-full\">\n <h2 class=\"mt-4 mb-4 text-gray-900 font-semibold text-xl grow shrink\">{{title}}</h2>\n <div>\n <button\n
|
|
2872
|
+
module.exports = "<div class=\"dashboard px-1\">\n <div v-if=\"status === 'loading'\" class=\"max-w-5xl mx-auto text-center\">\n <img src=\"images/loader.gif\" class=\"inline mt-10\">\n </div>\n <div v-if=\"dashboard && status === 'loaded'\" class=\"max-w-5xl mx-auto\">\n <div class=\"flex items-center w-full\" v-if=\"!showEditor\">\n <h2 class=\"mt-4 mb-4 text-gray-900 font-semibold text-xl grow shrink\">{{title}}</h2>\n <div>\n <button\n @click=\"showEditor = true\"\n type=\"button\"\n class=\"rounded-md bg-teal-600 px-2.5 py-1.5 text-sm font-semibold text-white shadow-sm hover:bg-teal-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-teal-600\">\n <img src=\"images/edit.svg\" class=\"inline h-[1em]\" /> Edit\n </button>\n </div>\n </div>\n <div v-if=\"!showEditor\" class=\"mt-4 mb-4\">\n <dashboard-result :result=\"result\"></dashboard-result>\n </div>\n <div v-if=\"showEditor\" class=\"mt-4\">\n <edit-dashboard\n :dashboardId=\"dashboard._id\"\n :code=\"code\"\n :currentDescription=\"description\"\n :currentTitle=\"title\"\n @close=\"showEditor=false;\"\n @update=\"updateCode\"></edit-dashboard>\n </div>\n <div v-if=\"errorMessage\" class=\"rounded-md bg-red-50 p-4 mt-4\">\n <div class=\"flex\">\n <div class=\"flex-shrink-0\">\n <svg class=\"h-5 w-5 text-red-400\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\" data-slot=\"icon\">\n <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM8.28 7.22a.75.75 0 0 0-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 1 0 1.06 1.06L10 11.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L11.06 10l1.72-1.72a.75.75 0 0 0-1.06-1.06L10 8.94 8.28 7.22Z\" clip-rule=\"evenodd\" />\n </svg>\n </div>\n <div class=\"ml-3\">\n <h3 class=\"text-sm font-medium text-red-800\">{{errorMessage}}</h3>\n </div>\n </div>\n </div>\n\n </div>\n <div v-if=\"!dashboard && status === 'loaded'\">\n No dashboard with the given id could be found.\n </div>\n</div>\n";
|
|
2870
2873
|
|
|
2871
2874
|
/***/ }),
|
|
2872
2875
|
|
|
@@ -2877,7 +2880,7 @@ module.exports = "<div class=\"dashboard px-1\">\n <div v-if=\"status === 'load
|
|
|
2877
2880
|
/***/ ((module) => {
|
|
2878
2881
|
|
|
2879
2882
|
"use strict";
|
|
2880
|
-
module.exports = "<div class=\"p-4 bg-gray-100 rounded-lg shadow-lg\">\n <div v-show=\"status === 'loading'\" class=\"max-w-5xl mx-auto text-center\">\n <img src=\"images/loader.gif\" class=\"inline mt-10\">\n </div>\n <div v-show=\"status !== 'loading'\">\n <div>\n
|
|
2883
|
+
module.exports = "<div class=\"p-4 bg-gray-100 rounded-lg shadow-lg\">\n <div v-show=\"status === 'loading'\" class=\"max-w-5xl mx-auto text-center\">\n <img src=\"images/loader.gif\" class=\"inline mt-10\">\n </div>\n <div v-show=\"status !== 'loading'\" class=\"flex flex-col gap-4\">\n <div>\n <input v-model=\"title\" class=\"w-full p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\" placeholder=\"Title\"/>\n </div>\n <div>\n <textarea v-model=\"description\" class=\"w-full p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\" rows=\"4\" placeholder=\"Description\">{{description}}</textarea>\n </div>\n <div class=\"border border-gray-300 rounded-md\">\n <textarea ref=\"codeEditor\" class=\"w-full p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\" rows=\"6\">{{code}}</textarea>\n <textarea v-model=\"chatMessage\" class=\"w-full p-2\"></textarea>\n </div>\n <div class=\"flex space-x-2\">\n <async-button @click=\"updateCode\" class=\"px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500\">Submit</async-button>\n <button @click=\"closeEditor\" class=\"px-4 py-2 bg-gray-500 text-white rounded-md hover:bg-gray-600 focus:outline-none focus:ring-2 focus:ring-gray-500\">Cancel</button>\n </div>\n </div>\n</div>\n";
|
|
2881
2884
|
|
|
2882
2885
|
/***/ }),
|
|
2883
2886
|
|
|
@@ -3317,7 +3320,7 @@ module.exports = "<div class=\"p-1\">\n <form class=\"space-y-4\">\n <div cl
|
|
|
3317
3320
|
/***/ ((module) => {
|
|
3318
3321
|
|
|
3319
3322
|
"use strict";
|
|
3320
|
-
module.exports = "<div class=\"mx-auto max-w-5xl py-6 px-2 flex flex-col gap-8\">\n <div>\n <div class=\"text-xl font-bold\">\n Subscription Details\n </div>\n <div v-if=\"workspace && workspace.subscriptionTier\" class=\"mt-4 flex justify-between items-center\">\n <div>\n <span class=\"font-bold\">Tier:</span> {{workspace.subscriptionTier ?? 'No subscription'}}\n </div>\n <div>\n <async-button\n type=\"submit\"\n @click=\"getWorkspaceCustomerPortalLink\"\n class=\"inline-flex items-center justify-center rounded-md border border-transparent bg-ultramarine-600 py-1 px-2 text-sm font-medium text-white shadow-sm hover:bg-ultramarine-500 focus:outline-none focus:ring-2 focus:ring-forest-green-500 focus:ring-offset-2\">\n View in Stripe\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4 ml-1\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M13.5 6H5.25A2.25 2.25 0 003 8.25v10.5A2.25 2.25 0 005.25 21h10.5A2.25 2.25 0 0018 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25\" />\n </svg>\n </async-button>\n </div>\n </div>\n <div v-if=\"workspace && !workspace.subscriptionTier\" class=\"mt-4 flex justify-between items-center\">\n <div>\n <span class=\"font-bold\">No active subscription</span>\n <div class=\"text-sm text-gray-700\">\n You won't be able to invite your team until you activate a subscription\n </div>\n </div>\n <div>\n <a\n :href=\"paymentLink\"\n target=\"_blank\"\n class=\"inline-flex items-center justify-center rounded-md border border-transparent bg-ultramarine-600 py-1 px-2 text-sm font-medium text-white shadow-sm hover:bg-ultramarine-500 focus:outline-none focus:ring-2 focus:ring-ultramarine-500 focus:ring-offset-2\">\n Subscribe With Stripe\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4 ml-1\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M13.5 6H5.25A2.25 2.25 0 003 8.25v10.5A2.25 2.25 0 005.25 21h10.5A2.25 2.25 0 0018 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25\" />\n </svg>\n </a>\n </div>\n </div>\n </div>\n <div>\n <div class=\"text-xl font-bold\">\n Current Members\n </div>\n <ul role=\"list\" class=\"divide-y divide-gray-100\">\n <li class=\"flex justify-between gap-x-6 py-5\" v-for=\"user in users\">\n <div class=\"flex min-w-0 gap-x-4\">\n <img class=\"size-12 flex-none rounded-full bg-gray-50\" :src=\"user.picture ?? 'images/logo.svg'\" alt=\"\">\n <div class=\"min-w-0 flex-auto\">\n <p class=\"text-sm/6 font-semibold text-gray-900\">\n {{user.name}}\n <span v-if=\"user.isFreeUser\" class=\"inline-flex items-center rounded-md bg-green-50 px-2 py-1 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20\">Free</span>\n </p>\n <p class=\"mt-1 truncate text-xs/5 text-gray-500\">{{user.email ?? 'No Email'}}</p>\n </div>\n </div>\n <div class=\"hidden shrink-0 sm:flex sm:flex-col sm:items-end\">\n <p class=\"text-sm/6 text-gray-900 capitalize\">{{getRolesForUser(user).join(', ')}}</p>\n <div class=\"flex gap-3\">\n <p class=\"mt-1 text-xs/5 text-gray-500 cursor-pointer\">\n Edit\n </p>\n <p class=\"mt-1 text-xs/5 text-valencia-500 cursor-pointer\" @click=\"showRemoveModal = user\">\n Remove\n </p>\n </div>\n </div>\n </li>\n </ul>\n </div>\n <div>\n <div class=\"flex items-center justify-between\">\n <div class=\"text-xl font-bold\">\n Invitations\n </div>\n <div class=\"mt-4 sm:ml-16 sm:mt-0 sm:flex-none\">\n <button\n type=\"button\"\n @click=\"showNewInvitationModal = true\"\n :disabled=\"workspace && !workspace.subscriptionTier\"\n class=\"block rounded-md bg-ultramarine-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 disabled:bg-gray-500 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600\">\n New Invitation\n <svg class=\"inline w-4 h-4 ml-1\" v-if=\"workspace && !workspace.subscriptionTier\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path fill-rule=\"evenodd\" d=\"M12 1.5a5.25 5.25 0 00-5.25 5.25v3a3 3 0 00-3 3v6.75a3 3 0 003 3h10.5a3 3 0 003-3v-6.75a3 3 0 00-3-3v-3c0-2.9-2.35-5.25-5.25-5.25zm3.75 8.25v-3a3.75 3.75 0 10-7.5 0v3h7.5z\" clip-rule=\"evenodd\" />\n </svg>\n </button>\n </div>\n </div>\n <div class=\"mt-8 flow-root\" v-if=\"invitations?.length > 0\">\n <div class=\"-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8\">\n <div class=\"inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8\">\n <table class=\"min-w-full divide-y divide-gray-300\">\n <thead>\n <tr>\n <th scope=\"col\" class=\"py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-0\">GitHub Username</th>\n <th scope=\"col\" class=\"px-3 py-3.5 text-left text-sm font-semibold text-gray-900\">Email</th>\n <th scope=\"col\" class=\"px-3 py-3.5 text-left text-sm font-semibold text-gray-900\">Status</th>\n <th scope=\"col\" class=\"px-3 py-3.5 text-left text-sm font-semibold text-gray-900\">Role</th>\n </tr>\n </thead>\n <tbody class=\"divide-y divide-gray-200 bg-white\">\n <tr v-for=\"invitation in invitations\">\n <td class=\"whitespace-nowrap py-5 pl-4 pr-3 text-sm sm:pl-0\">\n {{invitation.githubUsername}}\n </td>\n <td class=\"whitespace-nowrap px-3 py-5 text-sm text-gray-500\">\n {{invitation.email}}\n </td>\n <td class=\"whitespace-nowrap px-3 py-5 text-sm text-gray-500\">\n <span class=\"inline-flex items-center rounded-md bg-gray-50 px-2 py-1 text-xs font-medium text-gray-700 ring-1 ring-inset ring-gray-600/20\">\n Pending\n </span>\n </td>\n <td class=\"whitespace-nowrap px-3 py-5 text-sm text-gray-500\">\n {{invitation.roles.join(', ')}}\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n </div>\n
|
|
3323
|
+
module.exports = "<div class=\"mx-auto max-w-5xl py-6 px-2 flex flex-col gap-8\">\n <div>\n <div class=\"text-xl font-bold\">\n Subscription Details\n </div>\n <div v-if=\"status === 'loading'\" class=\"mt-4\">\n <img src=\"images/loader.gif\" class=\"inline w-8 h-8\">\n </div>\n <div v-else-if=\"workspace && workspace.subscriptionTier\" class=\"mt-4 flex justify-between items-center\">\n <div>\n <span class=\"font-bold\">Tier:</span> {{workspace.subscriptionTier ?? 'No subscription'}}\n </div>\n <div>\n <async-button\n type=\"submit\"\n @click=\"getWorkspaceCustomerPortalLink\"\n class=\"inline-flex items-center justify-center rounded-md border border-transparent bg-ultramarine-600 py-1 px-2 text-sm font-medium text-white shadow-sm hover:bg-ultramarine-500 focus:outline-none focus:ring-2 focus:ring-forest-green-500 focus:ring-offset-2\">\n View in Stripe\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4 ml-1\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M13.5 6H5.25A2.25 2.25 0 003 8.25v10.5A2.25 2.25 0 005.25 21h10.5A2.25 2.25 0 0018 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25\" />\n </svg>\n </async-button>\n </div>\n </div>\n <div v-else-if=\"workspace && !workspace.subscriptionTier\" class=\"mt-4 flex justify-between items-center\">\n <div>\n <span class=\"font-bold\">No active subscription</span>\n <div class=\"text-sm text-gray-700\">\n You won't be able to invite your team until you activate a subscription\n </div>\n </div>\n <div>\n <a\n :href=\"paymentLink\"\n target=\"_blank\"\n class=\"inline-flex items-center justify-center rounded-md border border-transparent bg-ultramarine-600 py-1 px-2 text-sm font-medium text-white shadow-sm hover:bg-ultramarine-500 focus:outline-none focus:ring-2 focus:ring-ultramarine-500 focus:ring-offset-2\">\n Subscribe With Stripe\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4 ml-1\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M13.5 6H5.25A2.25 2.25 0 003 8.25v10.5A2.25 2.25 0 005.25 21h10.5A2.25 2.25 0 0018 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25\" />\n </svg>\n </a>\n </div>\n </div>\n </div>\n <div>\n <div class=\"text-xl font-bold\">\n Current Members\n </div>\n <div v-if=\"status === 'loading'\" class=\"mt-4\">\n <img src=\"images/loader.gif\" class=\"inline w-8 h-8\">\n </div>\n <ul v-else role=\"list\" class=\"divide-y divide-gray-100\">\n <li class=\"flex justify-between gap-x-6 py-5\" v-for=\"user in users\">\n <div class=\"flex min-w-0 gap-x-4\">\n <img class=\"size-12 flex-none rounded-full bg-gray-50\" :src=\"user.picture ?? 'images/logo.svg'\" alt=\"\">\n <div class=\"min-w-0 flex-auto\">\n <p class=\"text-sm/6 font-semibold text-gray-900\">\n {{user.name}}\n <span v-if=\"user.isFreeUser\" class=\"ml-1 inline-flex items-center rounded-md bg-green-50 px-2 py-1 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20\">Free</span>\n </p>\n <p class=\"mt-1 truncate text-xs/5 text-gray-500\">{{user.email ?? 'No Email'}}</p>\n </div>\n </div>\n <div class=\"hidden shrink-0 sm:flex sm:flex-col sm:items-end\">\n <p class=\"text-sm/6 text-gray-900 capitalize\">{{getRolesForUser(user).join(', ')}}</p>\n <div class=\"flex gap-3\">\n <p class=\"mt-1 text-xs/5 text-gray-500 cursor-pointer\">\n Edit\n </p>\n <p class=\"mt-1 text-xs/5 text-valencia-500 cursor-pointer\" @click=\"showRemoveModal = user\">\n Remove\n </p>\n </div>\n </div>\n </li>\n </ul>\n </div>\n <div>\n <div class=\"flex items-center justify-between\">\n <div class=\"text-xl font-bold\">\n Invitations\n </div>\n <div class=\"mt-4 sm:ml-16 sm:mt-0 sm:flex-none\">\n <button\n type=\"button\"\n @click=\"showNewInvitationModal = true\"\n :disabled=\"status === 'loading' || (workspace && !workspace.subscriptionTier)\"\n class=\"block rounded-md bg-ultramarine-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 disabled:bg-gray-500 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600\">\n New Invitation\n <svg class=\"inline w-4 h-4 ml-1\" v-if=\"workspace && !workspace.subscriptionTier\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path fill-rule=\"evenodd\" d=\"M12 1.5a5.25 5.25 0 00-5.25 5.25v3a3 3 0 00-3 3v6.75a3 3 0 003 3h10.5a3 3 0 003-3v-6.75a3 3 0 00-3-3v-3c0-2.9-2.35-5.25-5.25-5.25zm3.75 8.25v-3a3.75 3.75 0 10-7.5 0v3h7.5z\" clip-rule=\"evenodd\" />\n </svg>\n </button>\n </div>\n </div>\n <div v-if=\"status === 'loading'\" class=\"mt-4\">\n <img src=\"images/loader.gif\" class=\"inline w-8 h-8\">\n </div>\n <div v-else-if=\"invitations?.length > 0\" class=\"mt-8 flow-root\" v-if=\"invitations?.length > 0\">\n <div class=\"-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8\">\n <div class=\"inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8\">\n <table class=\"min-w-full divide-y divide-gray-300\">\n <thead>\n <tr>\n <th scope=\"col\" class=\"py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-0\">GitHub Username</th>\n <th scope=\"col\" class=\"px-3 py-3.5 text-left text-sm font-semibold text-gray-900\">Email</th>\n <th scope=\"col\" class=\"px-3 py-3.5 text-left text-sm font-semibold text-gray-900\">Status</th>\n <th scope=\"col\" class=\"px-3 py-3.5 text-left text-sm font-semibold text-gray-900\">Role</th>\n </tr>\n </thead>\n <tbody class=\"divide-y divide-gray-200 bg-white\">\n <tr v-for=\"invitation in invitations\">\n <td class=\"whitespace-nowrap py-5 pl-4 pr-3 text-sm sm:pl-0\">\n {{invitation.githubUsername}}\n </td>\n <td class=\"whitespace-nowrap px-3 py-5 text-sm text-gray-500\">\n {{invitation.email}}\n </td>\n <td class=\"whitespace-nowrap px-3 py-5 text-sm text-gray-500\">\n <span class=\"inline-flex items-center rounded-md bg-gray-50 px-2 py-1 text-xs font-medium text-gray-700 ring-1 ring-inset ring-gray-600/20\">\n Pending\n </span>\n </td>\n <td class=\"whitespace-nowrap px-3 py-5 text-sm text-gray-500\">\n {{invitation.roles.join(', ')}}\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n </div>\n <div v-else-if=\"invitations?.length === 0\" class=\"mt-4\">\n <div class=\"text-center\">\n <svg class=\"mx-auto size-12 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path vector-effect=\"non-scaling-stroke\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z\" />\n </svg>\n <h3 class=\"mt-2 text-sm font-semibold text-gray-900\">No invitations</h3>\n <p class=\"mt-1 text-sm text-gray-500\">You have no outstanding invitations</p>\n </div>\n </div>\n </div>\n\n <modal v-if=\"showNewInvitationModal\">\n <template v-slot:body>\n <div class=\"modal-exit\" @click=\"showNewInvitationModal = false\">×</div>\n <new-invitation @close=\"showNewInvitationModal = false\" @invitationCreated=\"invitations.push($event.invitation)\"></new-invitation>\n </template>\n </modal>\n\n <modal v-if=\"showRemoveModal\">\n <template v-slot:body>\n <div class=\"modal-exit\" @click=\"showRemoveModal = false\">×</div>\n <div>\n Are you sure you want to remove user <span class=\"font-bold\">{{showRemoveModal.githubUsername}}</span> from this workspace?\n </div>\n <div class=\"mt-6 grid grid-cols-2 gap-4\">\n <async-button\n @click=\"removeFromWorkspace(showConfirmDeleteModal)\"\n class=\"border-0 mt-0 flex w-full items-center justify-center gap-3 rounded-md bg-valencia-500 hover:bg-valencia-400 px-3 py-1.5 text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-orange-400\">\n <span class=\"text-sm font-semibold leading-6\">Yes, Remove</span>\n </async-button>\n\n <span @click=\"showRemoveModal = null\" class=\"cursor-pointer flex w-full items-center justify-center gap-3 rounded-md bg-slate-500 hover:bg-slate-400 px-3 py-1.5 text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-slate-400\">\n <span class=\"text-sm font-semibold leading-6\">Cancel</span>\n </span>\n </div>\n </template>\n </modal>\n</div>\n";
|
|
3321
3324
|
|
|
3322
3325
|
/***/ }),
|
|
3323
3326
|
|
package/frontend/public/tw.css
CHANGED
|
@@ -3,11 +3,10 @@
|
|
|
3
3
|
<img src="images/loader.gif" class="inline mt-10">
|
|
4
4
|
</div>
|
|
5
5
|
<div v-if="dashboard && status === 'loaded'" class="max-w-5xl mx-auto">
|
|
6
|
-
<div class="flex items-center w-full">
|
|
6
|
+
<div class="flex items-center w-full" v-if="!showEditor">
|
|
7
7
|
<h2 class="mt-4 mb-4 text-gray-900 font-semibold text-xl grow shrink">{{title}}</h2>
|
|
8
8
|
<div>
|
|
9
9
|
<button
|
|
10
|
-
v-if="!showEditor"
|
|
11
10
|
@click="showEditor = true"
|
|
12
11
|
type="button"
|
|
13
12
|
class="rounded-md bg-teal-600 px-2.5 py-1.5 text-sm font-semibold text-white shadow-sm hover:bg-teal-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-teal-600">
|
|
@@ -15,10 +14,10 @@
|
|
|
15
14
|
</button>
|
|
16
15
|
</div>
|
|
17
16
|
</div>
|
|
18
|
-
<div
|
|
17
|
+
<div v-if="!showEditor" class="mt-4 mb-4">
|
|
19
18
|
<dashboard-result :result="result"></dashboard-result>
|
|
20
19
|
</div>
|
|
21
|
-
<div v-if="showEditor">
|
|
20
|
+
<div v-if="showEditor" class="mt-4">
|
|
22
21
|
<edit-dashboard
|
|
23
22
|
:dashboardId="dashboard._id"
|
|
24
23
|
:code="code"
|
|
@@ -2,19 +2,20 @@
|
|
|
2
2
|
<div v-show="status === 'loading'" class="max-w-5xl mx-auto text-center">
|
|
3
3
|
<img src="images/loader.gif" class="inline mt-10">
|
|
4
4
|
</div>
|
|
5
|
-
<div v-show="status !== 'loading'">
|
|
5
|
+
<div v-show="status !== 'loading'" class="flex flex-col gap-4">
|
|
6
6
|
<div>
|
|
7
|
-
|
|
7
|
+
<input v-model="title" class="w-full p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Title"/>
|
|
8
8
|
</div>
|
|
9
9
|
<div>
|
|
10
|
-
|
|
10
|
+
<textarea v-model="description" class="w-full p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" rows="4" placeholder="Description">{{description}}</textarea>
|
|
11
11
|
</div>
|
|
12
|
-
<div>
|
|
13
|
-
|
|
12
|
+
<div class="border border-gray-300 rounded-md">
|
|
13
|
+
<textarea ref="codeEditor" class="w-full p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" rows="6">{{code}}</textarea>
|
|
14
|
+
<textarea v-model="chatMessage" class="w-full p-2"></textarea>
|
|
14
15
|
</div>
|
|
15
16
|
<div class="flex space-x-2">
|
|
16
|
-
|
|
17
|
-
|
|
17
|
+
<async-button @click="updateCode" class="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500">Submit</async-button>
|
|
18
|
+
<button @click="closeEditor" class="px-4 py-2 bg-gray-500 text-white rounded-md hover:bg-gray-600 focus:outline-none focus:ring-2 focus:ring-gray-500">Cancel</button>
|
|
18
19
|
</div>
|
|
19
20
|
</div>
|
|
20
|
-
</div>
|
|
21
|
+
</div>
|
|
@@ -3,7 +3,10 @@
|
|
|
3
3
|
<div class="text-xl font-bold">
|
|
4
4
|
Subscription Details
|
|
5
5
|
</div>
|
|
6
|
-
<div v-if="
|
|
6
|
+
<div v-if="status === 'loading'" class="mt-4">
|
|
7
|
+
<img src="images/loader.gif" class="inline w-8 h-8">
|
|
8
|
+
</div>
|
|
9
|
+
<div v-else-if="workspace && workspace.subscriptionTier" class="mt-4 flex justify-between items-center">
|
|
7
10
|
<div>
|
|
8
11
|
<span class="font-bold">Tier:</span> {{workspace.subscriptionTier ?? 'No subscription'}}
|
|
9
12
|
</div>
|
|
@@ -19,7 +22,7 @@
|
|
|
19
22
|
</async-button>
|
|
20
23
|
</div>
|
|
21
24
|
</div>
|
|
22
|
-
<div v-if="workspace && !workspace.subscriptionTier" class="mt-4 flex justify-between items-center">
|
|
25
|
+
<div v-else-if="workspace && !workspace.subscriptionTier" class="mt-4 flex justify-between items-center">
|
|
23
26
|
<div>
|
|
24
27
|
<span class="font-bold">No active subscription</span>
|
|
25
28
|
<div class="text-sm text-gray-700">
|
|
@@ -43,14 +46,17 @@
|
|
|
43
46
|
<div class="text-xl font-bold">
|
|
44
47
|
Current Members
|
|
45
48
|
</div>
|
|
46
|
-
<
|
|
49
|
+
<div v-if="status === 'loading'" class="mt-4">
|
|
50
|
+
<img src="images/loader.gif" class="inline w-8 h-8">
|
|
51
|
+
</div>
|
|
52
|
+
<ul v-else role="list" class="divide-y divide-gray-100">
|
|
47
53
|
<li class="flex justify-between gap-x-6 py-5" v-for="user in users">
|
|
48
54
|
<div class="flex min-w-0 gap-x-4">
|
|
49
55
|
<img class="size-12 flex-none rounded-full bg-gray-50" :src="user.picture ?? 'images/logo.svg'" alt="">
|
|
50
56
|
<div class="min-w-0 flex-auto">
|
|
51
57
|
<p class="text-sm/6 font-semibold text-gray-900">
|
|
52
58
|
{{user.name}}
|
|
53
|
-
<span v-if="user.isFreeUser" class="inline-flex items-center rounded-md bg-green-50 px-2 py-1 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20">Free</span>
|
|
59
|
+
<span v-if="user.isFreeUser" class="ml-1 inline-flex items-center rounded-md bg-green-50 px-2 py-1 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20">Free</span>
|
|
54
60
|
</p>
|
|
55
61
|
<p class="mt-1 truncate text-xs/5 text-gray-500">{{user.email ?? 'No Email'}}</p>
|
|
56
62
|
</div>
|
|
@@ -78,7 +84,7 @@
|
|
|
78
84
|
<button
|
|
79
85
|
type="button"
|
|
80
86
|
@click="showNewInvitationModal = true"
|
|
81
|
-
:disabled="workspace && !workspace.subscriptionTier"
|
|
87
|
+
:disabled="status === 'loading' || (workspace && !workspace.subscriptionTier)"
|
|
82
88
|
class="block rounded-md bg-ultramarine-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 disabled:bg-gray-500 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600">
|
|
83
89
|
New Invitation
|
|
84
90
|
<svg class="inline w-4 h-4 ml-1" v-if="workspace && !workspace.subscriptionTier" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
|
|
@@ -87,7 +93,10 @@
|
|
|
87
93
|
</button>
|
|
88
94
|
</div>
|
|
89
95
|
</div>
|
|
90
|
-
<div
|
|
96
|
+
<div v-if="status === 'loading'" class="mt-4">
|
|
97
|
+
<img src="images/loader.gif" class="inline w-8 h-8">
|
|
98
|
+
</div>
|
|
99
|
+
<div v-else-if="invitations?.length > 0" class="mt-8 flow-root" v-if="invitations?.length > 0">
|
|
91
100
|
<div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
|
|
92
101
|
<div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8">
|
|
93
102
|
<table class="min-w-full divide-y divide-gray-300">
|
|
@@ -121,8 +130,7 @@
|
|
|
121
130
|
</div>
|
|
122
131
|
</div>
|
|
123
132
|
</div>
|
|
124
|
-
|
|
125
|
-
<div v-if="invitations?.length === 0" class="mt-4">
|
|
133
|
+
<div v-else-if="invitations?.length === 0" class="mt-4">
|
|
126
134
|
<div class="text-center">
|
|
127
135
|
<svg class="mx-auto size-12 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
|
128
136
|
<path vector-effect="non-scaling-stroke" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z" />
|
|
@@ -10,17 +10,20 @@ module.exports = app => app.component('team', {
|
|
|
10
10
|
users: null,
|
|
11
11
|
invitations: null,
|
|
12
12
|
showNewInvitationModal: false,
|
|
13
|
-
showRemoveModal: null
|
|
13
|
+
showRemoveModal: null,
|
|
14
|
+
status: 'loading'
|
|
14
15
|
}),
|
|
15
16
|
async mounted() {
|
|
16
17
|
const { workspace, users, invitations } = await mothership.getWorkspaceTeam();
|
|
17
18
|
this.workspace = workspace;
|
|
18
19
|
this.users = users;
|
|
19
20
|
this.invitations = invitations;
|
|
21
|
+
this.status = 'loaded';
|
|
20
22
|
},
|
|
21
23
|
computed: {
|
|
22
24
|
paymentLink() {
|
|
23
|
-
return 'https://buy.stripe.com/
|
|
25
|
+
return 'https://buy.stripe.com/3csaFg8XTdd0d6U7sy?client_reference_id=' + this.workspace?._id;
|
|
26
|
+
// return 'https://buy.stripe.com/test_eVaeYa2jC7565Lq7ss?client_reference_id=' + this.workspace?._id;
|
|
24
27
|
}
|
|
25
28
|
},
|
|
26
29
|
methods: {
|
package/package.json
CHANGED
package/test.html
DELETED
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<title>Fixed Navbars with Scrollable Table</title>
|
|
7
|
-
<script src="https://cdn.tailwindcss.com"></script>
|
|
8
|
-
</head>
|
|
9
|
-
<body class="h-screen flex flex-col">
|
|
10
|
-
|
|
11
|
-
<!-- Top-Level Navbar (Fixed) -->
|
|
12
|
-
<nav class="bg-blue-600 text-white p-4 fixed top-0 left-0 right-0 z-20">
|
|
13
|
-
Top-Level Navbar
|
|
14
|
-
</nav>
|
|
15
|
-
|
|
16
|
-
<!-- Side Navbar (Fixed) -->
|
|
17
|
-
<aside class="bg-gray-800 text-white w-64 p-4 fixed top-16 left-0 bottom-0 z-10">
|
|
18
|
-
Side Navbar
|
|
19
|
-
</aside>
|
|
20
|
-
|
|
21
|
-
<!-- Stacked Navigation Bar (Fixed Below Top Navbar) -->
|
|
22
|
-
<nav class="bg-gray-300 p-4 fixed top-16 left-64 right-0 z-20">
|
|
23
|
-
Stacked Navigation Bar
|
|
24
|
-
</nav>
|
|
25
|
-
|
|
26
|
-
<!-- Scrollable Table Container -->
|
|
27
|
-
<div class="flex-grow overflow-auto p-4 pl-64 pt-32 bg-gray-50" style="height: calc(100vh - 8rem);">
|
|
28
|
-
<div class="overflow-auto border border-gray-300" style="max-height: calc(100vh - 12rem);">
|
|
29
|
-
<table class="min-w-max border border-gray-300">
|
|
30
|
-
<thead class="bg-gray-300 sticky top-0 z-10">
|
|
31
|
-
<tr>
|
|
32
|
-
<!-- Generate many columns -->
|
|
33
|
-
<script>
|
|
34
|
-
for (let j = 0; j < 20; j++) {
|
|
35
|
-
document.write(`<th class="border p-2 whitespace-nowrap">Header ${j + 1}</th>`);
|
|
36
|
-
}
|
|
37
|
-
</script>
|
|
38
|
-
</tr>
|
|
39
|
-
</thead>
|
|
40
|
-
<tbody>
|
|
41
|
-
<!-- Generate many rows -->
|
|
42
|
-
<script>
|
|
43
|
-
for (let i = 0; i < 100; i++) {
|
|
44
|
-
document.write(`<tr class="border">`);
|
|
45
|
-
for (let j = 0; j < 20; j++) {
|
|
46
|
-
document.write(`<td class="border p-2 whitespace-nowrap">Row ${i + 1} Col ${j + 1}</td>`);
|
|
47
|
-
}
|
|
48
|
-
document.write(`</tr>`);
|
|
49
|
-
}
|
|
50
|
-
</script>
|
|
51
|
-
</tbody>
|
|
52
|
-
</table>
|
|
53
|
-
</div>
|
|
54
|
-
</div>
|
|
55
|
-
|
|
56
|
-
</body>
|
|
57
|
-
</html>
|