Skip to content

Commit

Permalink
feat: Hide flagged proposals (#4104)
Browse files Browse the repository at this point in the history
* Add proposals filter

* Fixes

* Fix bugs

* Remove redundant util function

* Add flagged query

* Fixe

* Fix text

* Fix filter jump

* Fix radio

* Fixes

* Update version

* Fix type

* Fix funnel size

* Fix align
  • Loading branch information
samuveth authored Aug 1, 2023
1 parent 7122bc9 commit ba0d284
Show file tree
Hide file tree
Showing 10 changed files with 159 additions and 123 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@
"@snapshot-labs/lock": "^0.1.1019",
"@snapshot-labs/pineapple": "^0.1.0-beta.1",
"@snapshot-labs/snapshot.js": "^0.4.106",
"@snapshot-labs/tune": "^0.1.30",
"@snapshot-labs/tune": "^0.1.31",
"@vue/apollo-composable": "4.0.0-beta.4",
"@vueuse/core": "^10.1.2",
"@vueuse/head": "^1.1.26",
Expand Down
13 changes: 11 additions & 2 deletions src/components/BaseUser.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Profile, ExtendedSpace, Proposal } from '@/helpers/interfaces';
const { domain } = useApp();
defineProps<{
const props = defineProps<{
address: string;
space?: ExtendedSpace;
proposal?: Proposal;
Expand All @@ -14,6 +14,15 @@ defineProps<{
}>();
const { getUsername } = useUsername();
const spaceMembers = computed(() => {
if (!props.space) return [];
return [
...props.space.members,
...props.space.moderators,
...props.space.admins
];
});
</script>

<template>
Expand Down Expand Up @@ -41,7 +50,7 @@ const { getUsername } = useUsername();
>
{{ getUsername(address, profile) }}
</span>
<BaseBadge :address="address" :members="space?.members" />
<BaseBadge :address="address" :members="spaceMembers" />
</div>
</BaseLink>
</PopoverHoverProfile>
Expand Down
84 changes: 0 additions & 84 deletions src/components/SpaceProposalsMenuFilter.vue

This file was deleted.

30 changes: 30 additions & 0 deletions src/components/SpaceProposalsSearch.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
<script setup lang="ts">
const router = useRouter();
const route = useRoute();
const titleSearch = computed(() => (route.query.q as string) || '');
function handleUpdateSearch(e: string) {
router.push({
query: { ...route.query, q: e || undefined }
});
}
</script>

<template>
<div
class="w-full rounded-full border border-skin-border pl-3 pr-0 focus-within:!border-skin-text md:max-w-[420px]"
>
<div class="flex">
<BaseSearch
:model-value="titleSearch"
:placeholder="$t('searchPlaceholder')"
class="flex-auto pr-2"
@update:model-value="handleUpdateSearch"
/>
<div class="flex items-center border-l" style="height: 44px">
<SpaceProposalsSearchFilter />
</div>
</div>
</div>
</template>
96 changes: 96 additions & 0 deletions src/components/SpaceProposalsSearchFilter.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,96 @@
<script setup lang="ts">
const route = useRoute();
const router = useRouter();
const { t } = useI18n();
const stateFilter = computed(() => (route.query.state as string) || 'all');
const showOnlyCore = computed(() => (route.query.onlyCore as string) || '0');
const showFlagged = computed(() => (route.query.showFlagged as string) || '0');
const stateFilters = computed(() => [
{
text: t('proposals.states.all'),
action: 'all',
extras: { selected: stateFilter.value === 'all' }
},
{
text: t('proposals.states.active'),
action: 'active',
extras: { selected: stateFilter.value === 'active' }
},
{
text: t('proposals.states.pending'),
action: 'pending',
extras: { selected: stateFilter.value === 'pending' }
},
{
text: t('proposals.states.closed'),
action: 'closed',
extras: { selected: stateFilter.value === 'closed' }
}
]);
function updateFilters(e: string) {
router.push({
query: { ...route.query, state: e || undefined }
});
}
function updateCore(e: boolean) {
router.push({
query: { ...route.query, onlyCore: e ? '1' : undefined }
});
}
function updateFlagged(e: boolean) {
router.push({
query: { ...route.query, showFlagged: e ? '1' : undefined }
});
}
</script>

<template>
<BasePopover :focus="false" class="h-full">
<template #button>
<BaseButtonIcon class="flex h-full w-[54px] justify-center outline-none">
<i-ho-funnel class="mr-1 text-base text-skin-link" />
</BaseButtonIcon>
</template>
<template #content>
<div>
<h3 class="-mb-2 mt-3 text-center text-skin-heading">Filters</h3>
<div class="m-4 space-y-3">
<div class="space-y-2">
<span class="text-skin-heading"> Proposal status </span>
<TuneRadio
v-for="(state, index) in stateFilters"
:id="JSON.stringify(index)"
:key="state.action"
:value="state.action"
:hint="state.text"
:model-value="stateFilter"
@update:model-value="updateFilters($event as string)"
/>
</div>
<div class="space-y-2">
<span class="text-skin-heading"> More </span>
<TuneCheckbox
id="onlyCore"
:model-value="showOnlyCore === '1'"
hint="Only core member proposals"
name="onlyCore"
@update:model-value="updateCore($event as boolean)"
/>
<TuneCheckbox
id="showFlagged"
:model-value="showFlagged === '1'"
hint="Show flagged proposals"
name="showFlagged"
@update:model-value="updateFlagged($event as boolean)"
/>
</div>
</div>
</div>
</template>
</BasePopover>
</template>
2 changes: 2 additions & 0 deletions src/helpers/queries.ts
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,7 @@ export const PROPOSALS_QUERY = gql`
$author_in: [String]
$title_contains: String
$space_verified: Boolean
$flagged: Boolean
) {
proposals(
first: $first
Expand All @@ -102,6 +103,7 @@ export const PROPOSALS_QUERY = gql`
author_in: $author_in
title_contains: $title_contains
space_verified: $space_verified
flagged: $flagged
}
) {
id
Expand Down
21 changes: 0 additions & 21 deletions src/helpers/utils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -62,27 +62,6 @@ export function mapOldPluginNames(space) {
return space;
}

export function filterProposals(space, proposal, tab) {
const ts = (Date.now() / 1e3).toFixed();
const members = space.members.map(address => address.toLowerCase());
const author = proposal[1].address.toLowerCase();
const isMember = members.includes(author);
const start = proposal[1].msg.payload.start;
const end = proposal[1].msg.payload.end;

if (!isMember && proposal[1].score < space.filters.minScore) return false;
if (space.filters.onlyMembers && !isMember) return false;

if (tab === 'all') return true;
if (tab === 'active' && start <= ts && end > ts) return true;
if (tab === 'core' && isMember) return true;
if (tab === 'community' && !isMember) return true;
if (tab === 'closed' && end <= ts) return true;
if (tab === 'pending' && start > ts) return true;

return false;
}

export function formatAmount(amount, maxDecimals) {
let out = formatEther(amount);
if (maxDecimals && out.includes('.')) {
Expand Down
3 changes: 1 addition & 2 deletions src/views/SpaceAbout.vue
Original file line number Diff line number Diff line change
Expand Up @@ -69,8 +69,7 @@ const spaceMembers = computed(() => {
});
onMounted(() => {
if (props.space?.admins)
loadProfiles(props.space.admins.concat(props.space.members));
loadProfiles(spaceMembers.value.map(member => member.id));
});
</script>

Expand Down
23 changes: 14 additions & 9 deletions src/views/SpaceProposals.vue
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,9 @@ const { apolloQuery } = useApolloQuery();
const { web3Account } = useWeb3();
const spaceMembers = computed(() =>
props.space.members.length < 1 ? ['none'] : props.space.members
props.space.members.length < 1
? ['none']
: [...props.space.members, ...props.space.moderators, ...props.space.admins]
);
const subSpaces = computed(
Expand All @@ -57,7 +59,9 @@ const spaceProposals = computed(() => {
});
const stateFilter = computed(() => route.query.state || 'all');
const titleFilter = computed(() => route.query.q || '');
const titleSearch = computed(() => route.query.q || '');
const showOnlyCore = computed(() => (route.query.onlyCore as string) || '0');
const showFlagged = computed(() => (route.query.showFlagged as string) || '0');
async function getProposals(skip = 0) {
return apolloQuery(
Expand All @@ -67,9 +71,10 @@ async function getProposals(skip = 0) {
first: loadBy,
skip,
space_in: [props.space.id, ...subSpaces.value],
state: stateFilter.value === 'core' ? 'all' : stateFilter.value,
author_in: stateFilter.value === 'core' ? spaceMembers.value : [],
title_contains: titleFilter.value
state: stateFilter.value,
author_in: showOnlyCore.value === '1' ? spaceMembers.value : [],
title_contains: titleSearch.value,
flagged: showFlagged.value === '0' ? false : undefined
}
},
'proposals'
Expand Down Expand Up @@ -103,13 +108,13 @@ async function loadProposals() {
loading.value = false;
}
watch(stateFilter, () => {
watch([stateFilter, showOnlyCore, showFlagged], () => {
resetSpaceProposals();
loadProposals();
});
watchDebounced(
titleFilter,
titleSearch,
() => {
resetSpaceProposals();
loadProposals();
Expand All @@ -130,7 +135,7 @@ onMounted(() => loadProposals());
<SpaceSidebar :space="space" />
</template>
<template #content-right>
<BaseBlock v-if="space.about && stateFilter == 'all'" class="mb-3">
<BaseBlock v-if="space.about" class="mb-3">
<TextAutolinker :text="space.about" />
</BaseBlock>
<div class="relative mb-3 flex px-3 md:px-0">
Expand All @@ -141,7 +146,7 @@ onMounted(() => loadProposals());
</h2>
</div>
</div>
<SpaceProposalsMenuFilter />
<SpaceProposalsSearch />

<SpaceProposalsNotice
v-if="spaceProposals.length < 1 && !loading"
Expand Down
8 changes: 4 additions & 4 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1843,10 +1843,10 @@
json-to-graphql-query "^2.2.4"
lodash.set "^4.3.2"

"@snapshot-labs/tune@^0.1.30":
version "0.1.30"
resolved "https://registry.yarnpkg.com/@snapshot-labs/tune/-/tune-0.1.30.tgz#e1aea1a177a79d4de83e0f0c83e4361f7482f13f"
integrity sha512-4XgIBajxymRuW4A7/IIA28rTw5e2OanOiQDTYEAtpTTliTayPPBZCRCwZ2HbsW6rPuz+R9R5ZFI0huCblD34/A==
"@snapshot-labs/tune@^0.1.31":
version "0.1.31"
resolved "https://registry.yarnpkg.com/@snapshot-labs/tune/-/tune-0.1.31.tgz#49d10445c5270aeb3bcbac75432a63260f3fbc54"
integrity sha512-4gyJ8R5zfJWq7BA9qOPmJCKhIfewsjbfM6JLX+1iqkikH8q+y5HxGve70Eud7SOxQOMKUTCvt41WIqrlSOjBVw==
dependencies:
"@headlessui-float/vue" "^0.11.0"
"@headlessui/vue" "^1.7.12"
Expand Down

1 comment on commit ba0d284

@vercel
Copy link

@vercel vercel bot commented on ba0d284 Aug 1, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.