btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

refactor: cleanup

Browse Source
This commit is contained in:
liyasthomas
2021-07-30 13:52:43 +05:30
parent 2891da3c74
commit 203b45f4d5
18 changed files with 139 additions and 274 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
components/app/Announcement.vue
View File

@@ -1,12 +1,5 @@
<template>
<div
class="
bg-primary bg-dividerLight
border-b border-divider
flex
justify-between
"
>
<div class="bg-dividerLight border-b border-divider flex justify-between">
<span class="flex">
<SmartLink
to="https://forms.gle/8yFiEynXB7h477Ns6"

4
components/app/Footer.vue
View File

@@ -26,7 +26,7 @@
v-tippy="{ theme: 'tooltip' }"
icon="keyboard"
:title="$t('shortcuts')"
:shortcut="[getSpecialKey(), '/']"
:shortcut="['?']"
@click.native="showShortcuts = true"
/>
<ButtonSecondary
@@ -58,7 +58,6 @@ import {
toggleSetting,
} from "~/newstore/settings"
import type { KeysMatching } from "~/types/ts-utils"
import { getPlatformSpecialKey } from "~/helpers/platformutils"
type SettingsType = typeof defaultSettings
@@ -106,7 +105,6 @@ export default defineComponent({
// fallback
}
},
getSpecialKey: getPlatformSpecialKey,
},
})
</script>

7
components/app/Header.vue
View File

@@ -47,7 +47,6 @@
'<br>' +
`<sub>${currentUser.email || 'Email not found'}</sub>`
"
indicator
/>
<TabPrimary
v-else
@@ -56,12 +55,6 @@
icon="account_circle"
/>
</template>
<SmartItem
to="/profile"
icon="person"
:label="$t('profile')"
@click.native="$refs.user.tippy().hide()"
/>
<SmartItem
to="/settings"
icon="settings"

19
components/app/Sidenav.vue
View File

@@ -7,7 +7,12 @@
:to="localePath(navigation.target)"
class="nav-link"
>
<i class="material-icons">{{ navigation.icon }}</i>
<i v-if="navigation.icon" class="material-icons">
{{ navigation.icon }}
</i>
<div v-if="navigation.svg" class="h-4 w-4">
<SmartIcon :name="navigation.svg" class="svg-icons" />
</div>
<span>{{ navigation.title }}</span>
</nuxt-link>
</nav>
@@ -19,13 +24,11 @@ export default {
data() {
return {
primaryNavigation: [
{ target: "index", icon: "apps", title: "App" },
{ target: "index", icon: "settings_ethernet", title: "REST" },
{ target: "graphql", svg: "graphql", title: "GraphQL" },
{ target: "realtime", icon: "language", title: "Realtime" },
{ target: "graphql", icon: "code", title: "GraphQL" },
{ target: "documentation", icon: "book", title: "Doc" },
{ target: "profile", icon: "person", title: "Profile" },
{ target: "settings", icon: "settings", title: "Settings" },
{ target: "home", icon: "home", title: "Home" },
],
}
},
@@ -42,7 +45,8 @@ export default {
@apply hover:bg-primaryDark;
@apply hover:text-secondaryDark;
.material-icons {
.material-icons,
.svg-icons {
@apply opacity-75;
}
@@ -55,7 +59,8 @@ export default {
@apply text-accent;
@apply hover:text-accent;
.material-icons {
.material-icons,
.svg-icons {
@apply opacity-100;
}
}

14
components/button/Primary.vue
View File

@@ -41,16 +41,22 @@
>
<i
v-if="icon"
:class="label ? (reverse ? 'ml-2' : 'mr-2') : ''"
class="material-icons"
:class="[
'material-icons',
{ '!text-2xl': large },
label ? (reverse ? 'ml-2' : 'mr-2') : '',
]"
>
{{ icon }}
</i>
<SmartIcon
v-if="svg"
:name="svg"
:class="label ? (reverse ? 'ml-4' : 'mr-4') : ''"
class="svg-icons"
:class="[
'svg-icons',
{ '!h-6 !w-6': large },
label ? (reverse ? 'ml-2' : 'mr-2') : '',
]"
/>
{{ label }}
<div v-if="shortcut.length && SHORTCUT_INDICATOR" class="ml-2">

14
components/button/Secondary.vue
View File

@@ -31,16 +31,22 @@
>
<i
v-if="icon"
:class="label ? (reverse ? 'ml-2' : 'mr-2') : ''"
class="material-icons"
:class="[
'material-icons',
{ '!text-2xl': large },
label ? (reverse ? 'ml-2' : 'mr-2') : '',
]"
>
{{ icon }}
</i>
<SmartIcon
v-if="svg"
:name="svg"
:class="label ? (reverse ? 'ml-2' : 'mr-2') : ''"
class="svg-icons"
:class="[
'svg-icons',
{ '!h-6 !w-6': large },
label ? (reverse ? 'ml-2' : 'mr-2') : '',
]"
/>
{{ label }}
<div v-if="shortcut.length && SHORTCUT_INDICATOR" class="ml-2">

2
components/http/CodegenModal.vue
View File

@@ -79,7 +79,7 @@
:icon="copyIcon"
@click.native="copyRequestCode"
/>
<ButtonSecondary :label="$t('cancel')" @click.native="hideModal" />
<ButtonSecondary :label="$t('dismiss')" @click.native="hideModal" />
</template>
</SmartModal>
</template>

4
components/http/Request.vue
View File

@@ -22,10 +22,10 @@
font-semibold font-mono
h-8
text-secondaryDark
min-w-28
py-1
px-4
transition
w-28
truncate
focus:outline-none focus:border-accent
"
@@ -72,7 +72,7 @@
<div class="flex">
<ButtonPrimary
id="send"
class="rounded-none w-18"
class="rounded-none min-w-18"
:label="!loading ? $t('send') : $t('cancel')"
:shortcut="[getSpecialKey(), 'G']"
@click.native="!loading ? newSendRequest() : cancelRequest()"

6
components/smart/Modal.vue
View File

@@ -9,7 +9,7 @@
>
<transition name="fade" appear>
<div
class="bg-primaryDark inset-0 transition-opacity fixed"
class="bg-primaryDark opacity-100 inset-0 transition fixed"
@touchstart="!dialog ? close() : null"
@touchend="!dialog ? close() : null"
@mouseup="!dialog ? close() : null"
@@ -33,9 +33,9 @@
<div
class="
bg-primary
rounded
shadow-xl
rounded-lg
m-4
shadow-lg
text-left
w-full
p-4

135
components/teams/Edit.vue
View File

@@ -2,7 +2,9 @@
<SmartModal v-if="show" @close="hideModal">
<template #header>
<h3 class="heading">{{ $t("edit_team") }}</h3>
<ButtonSecondary icon="close" @click.native="hideModal" />
<div>
<ButtonSecondary icon="close" @click.native="hideModal" />
</div>
</template>
<template #body>
<div class="flex flex-col px-2">
@@ -17,29 +19,43 @@
:placeholder="editingTeam.name"
@keyup.enter="saveTeam"
/>
<label for="memberList" class="font-semibold px-4 pt-4 pb-4">
{{ $t("team_member_list") }}
</label>
<ul
v-for="(member, index) in members"
:key="`member-${index}`"
class="
divide-y divide-dashed divide-divider
border-b border-divider
md:divide-x md:divide-y-0
"
:class="{ 'border-t': index == 0 }"
>
<li>
<div class="flex flex-1 justify-between items-center">
<label for="memberList" class="font-semibold px-4 pt-4 pb-4">
{{ $t("team_member_list") }}
</label>
<div>
<ButtonSecondary
icon="add"
:label="$t('add_new')"
@click.native="addTeamMember"
/>
</div>
</div>
<div class="border-divider border rounded">
<div
v-for="(member, index) in members"
:key="`member-${index}`"
class="
divide-x divide-dividerLight
border-b border-dividerLight
flex
"
>
<input
class="input"
class="
bg-primaryLight
flex
font-semibold font-mono
flex-1
py-2
px-4
focus:outline-none
"
:placeholder="$t('email')"
:name="'param' + index"
:value="member.user.email"
readonly
/>
</li>
<li>
<span class="select-wrapper">
<tippy
ref="options"
@@ -51,7 +67,15 @@
>
<template #trigger>
<input
class="input"
class="
bg-primaryLight
flex
font-semibold font-mono
flex-1
py-2
px-4
focus:outline-none
"
:placeholder="$t('permissions')"
:name="'value' + index"
:value="
@@ -85,9 +109,7 @@
/>
</tippy>
</span>
</li>
<div>
<li>
<div>
<ButtonSecondary
id="member"
v-tippy="{ theme: 'tooltip' }"
@@ -96,28 +118,32 @@
color="red"
@click.native="removeExistingTeamMember(member.user.uid)"
/>
</li>
</div>
</div>
</ul>
<ul
v-for="(member, index) in newMembers"
:key="`member-${index}`"
class="
divide-y divide-dashed divide-divider
border-b border-divider
md:divide-x md:divide-y-0
"
>
<li>
<div
v-for="(member, index) in newMembers"
:key="`member-${index}`"
class="
divide-x divide-dividerLight
border-b border-dividerLight
flex
"
>
<input
v-model="member.key"
class="input"
class="
bg-primaryLight
flex
font-semibold font-mono
flex-1
py-2
px-4
focus:outline-none
"
:placeholder="$t('email')"
:name="'param' + index"
:name="'member' + index"
autofocus
/>
</li>
<li>
<span class="select-wrapper">
<tippy
ref="memberOptions"
@@ -129,7 +155,15 @@
>
<template #trigger>
<input
class="input"
class="
bg-primaryLight
flex
font-semibold font-mono
flex-1
py-2
px-4
focus:outline-none
"
:placeholder="$t('permissions')"
:name="'value' + index"
:value="
@@ -144,28 +178,26 @@
label="OWNER"
@click.native="
member.value = 'OWNER'
$refs.options.tippy().hide()
$refs.memberOptions.tippy().hide()
"
/>
<SmartItem
label="EDITOR"
@click.native="
member.value = 'EDITOR'
$refs.options.tippy().hide()
$refs.memberOptions.tippy().hide()
"
/>
<SmartItem
label="VIEWER"
@click.native="
member.value = 'VIEWER'
$refs.options.tippy().hide()
$refs.memberOptions.tippy().hide()
"
/>
</tippy>
</span>
</li>
<div>
<li>
<div>
<ButtonSecondary
id="member"
v-tippy="{ theme: 'tooltip' }"
@@ -174,18 +206,9 @@
color="red"
@click.native="removeTeamMember(index)"
/>
</li>
</div>
</div>
</ul>
<ul>
<li>
<ButtonSecondary
icon="add"
:label="$t('add_new')"
@click.native="addTeamMember"
/>
</li>
</ul>
</div>
</div>
</template>
<template #footer>

2
components/teams/Team.vue
View File

@@ -3,7 +3,7 @@
<div>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
title="team.myRole === 'OWNER' ? $t('edit') : ''"
:title="team.myRole === 'OWNER' ? $t('edit') : ''"
icon="group"
:label="team.name"
@click.native="team.myRole === 'OWNER' ? $emit('edit-team') : ''"

2
components/teams/index.vue
View File

@@ -1,7 +1,7 @@
<template>
<AppSection label="teams">
<div class="flex flex-col">
<label>{{ $t("teams") }}</label>
<legend class="font-bold text-secondaryDark">{{ $t("teams") }}</legend>
<div v-if="currentUser"></div>
<div v-else>
<label>{{ $t("login_with") }}</label>