Skip to content

Commit

Permalink
Merge pull request #1045 from near-daos/feature/custom-fc-registry
Browse files Browse the repository at this point in the history
feat(custom templates): add custom fc templates registry
  • Loading branch information
karpovdmitryod authored May 9, 2022
2 parents 59bc874 + b1c0a7f commit b1ec781
Show file tree
Hide file tree
Showing 45 changed files with 1,883 additions and 18 deletions.
3 changes: 3 additions & 0 deletions assets/icons/bookmark.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ export interface ProposalCardRendererProps {
infoPanelNode?: React.ReactNode;
className?: string;
showInfo?: boolean;
optionalActionNode?: React.ReactNode;
}

export const ProposalCardRenderer: React.FC<ProposalCardRendererProps> = ({
Expand All @@ -25,6 +26,7 @@ export const ProposalCardRenderer: React.FC<ProposalCardRendererProps> = ({
className,
proposalId,
showInfo,
optionalActionNode,
}) => {
const { t } = useTranslation();

Expand Down Expand Up @@ -60,9 +62,10 @@ export const ProposalCardRenderer: React.FC<ProposalCardRendererProps> = ({
return (
<div className={cn(styles.root, className)}>
<div className={styles.header}>
<div>{renderFlag()}</div>
<div className={styles.flagWrapper}>{renderFlag()}</div>
{renderInfoPanel()}
{renderProposalId()}
{optionalActionNode}
</div>
{letterHeadNode && (
<div className={styles.letterHead}>{letterHeadNode}</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,10 @@
justify-content: space-between;
}

.flagWrapper {
margin-right: auto;
}

.proposal {
grid-area: proposal;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,10 @@
&:hover {
box-shadow: 3px 2px 24px var(--color-black-opacity-25);
}

&.withOptionalControl {
border-radius: 0 0 8px;
}
}

.actionBar {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,7 @@ export interface ProposalCardProps {
updatedAt?: string | null;
toggleInfoPanel?: () => void;
commentsCount: number;
hasOptionalControl?: boolean;
permissions: {
canApprove: boolean;
canReject: boolean;
Expand Down Expand Up @@ -177,6 +178,7 @@ export const ProposalCard: React.FC<ProposalCardProps> = ({
updatedAt,
toggleInfoPanel,
commentsCount,
hasOptionalControl,
}) => {
const { accountId, nearService } = useWalletContext();
const { t } = useTranslation();
Expand Down Expand Up @@ -372,6 +374,7 @@ export const ProposalCard: React.FC<ProposalCardProps> = ({
data-testid="proposal-card-root"
className={cn(styles.root, {
[styles.clickable]: !!id && !preventNavigate,
[styles.withOptionalControl]: hasOptionalControl,
})}
onClick={handleCardClick}
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,9 @@ exports[`proposal card renderer Should render component 1`] = `
<div
class="header"
>
<div />
<div
class="flagWrapper"
/>
</div>
<div
class="proposal"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ exports[`BountiesListView Should render component 1`] = `
class="rowTitle"
>
<button
class="btn transparent sizeBlock"
class="btn transparent sizeBlock disabled"
disabled=""
type="button"
>
Expand Down Expand Up @@ -174,7 +174,7 @@ exports[`BountiesListView Should render component 1`] = `
class="rowTitle"
>
<button
class="btn transparent sizeBlock"
class="btn transparent sizeBlock disabled"
disabled=""
type="button"
>
Expand Down Expand Up @@ -288,7 +288,7 @@ exports[`BountiesListView Should render component 1`] = `
class="rowTitle"
>
<button
class="btn transparent sizeBlock"
class="btn transparent sizeBlock disabled"
disabled=""
type="button"
>
Expand Down Expand Up @@ -433,7 +433,7 @@ exports[`BountiesListView Should render component 1`] = `
class="rowTitle"
>
<button
class="btn transparent sizeBlock"
class="btn transparent sizeBlock disabled"
disabled=""
type="button"
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ exports[`TimelineHeader Should render component 1`] = `
class="root"
>
<button
class="btn transparent sizeBlock btn"
class="btn transparent sizeBlock btn disabled"
disabled=""
type="button"
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ export function useDepositWidth(
): number {
const { watch } = useFormContext();

const deposit = watch(fieldName);
const deposit = watch(fieldName).toString();

let depositWidth;

Expand Down
10 changes: 9 additions & 1 deletion astro_2.0/features/ViewProposal/ViewProposal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import {
import { LetterHeadWidget } from 'astro_2.0/components/ProposalCardRenderer/components/LetterHeadWidget';
import { DaoFlagWidget } from 'astro_2.0/components/DaoFlagWidget';

import { ProposalFeedItem } from 'types/proposal';
import { ProposalFeedItem, ProposalVariant } from 'types/proposal';

import { useWalletContext } from 'context/WalletContext';
import { getVoteDetails } from 'features/vote-policy/helpers';
Expand All @@ -19,6 +19,7 @@ import ErrorBoundary from 'astro_2.0/components/ErrorBoundary';
import { useToggle } from 'react-use';
import { ProposalComments } from 'astro_2.0/features/ViewProposal/components/ProposalComments';
import { AnimatePresence, motion } from 'framer-motion';
import { SaveFcTemplate } from 'astro_2.0/features/ViewProposal/components/SaveFcTemplate';

export interface CreateProposalProps {
proposal: ProposalFeedItem;
Expand All @@ -42,6 +43,9 @@ export const ViewProposal: FC<CreateProposalProps> = ({
const [showInfoPanel, toggleInfoPanel] = useToggle(false);
const [commentsCount, setCommentsCount] = useState(proposal?.commentsCount);
const isCouncilUser = proposal?.permissions?.isCouncil ?? false;
const showOptionalControl =
proposal.proposalVariant === ProposalVariant.ProposeCustomFunctionCall &&
proposal.status === 'Approved';

if (!proposal || !proposal.dao) {
return null;
Expand All @@ -62,6 +66,9 @@ export const ViewProposal: FC<CreateProposalProps> = ({
/>
)
}
optionalActionNode={
showOptionalControl && <SaveFcTemplate proposal={proposal} />
}
letterHeadNode={
<LetterHeadWidget
type={proposal.kind.type}
Expand Down Expand Up @@ -95,6 +102,7 @@ export const ViewProposal: FC<CreateProposalProps> = ({
updatedAt={proposal.updatedAt}
toggleInfoPanel={toggleInfoPanel}
commentsCount={commentsCount}
hasOptionalControl={showOptionalControl}
voteDetails={
proposal.dao.policy.defaultVotePolicy.ratio
? getVoteDetails(
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
@import 'styles/mixins';

.root {
align-items: center;
background-color: var(--color-primary-50);
border-radius: 4px 4px 0 0;
color: var(--color-white);
display: flex;
justify-content: center;
margin-left: 12px;
padding: 0;
}

.control.control {
@include centralize;
color: var(--color-white);
}

.loading {
margin-left: 8px;
margin-right: 0;
}

.icon.icon {
color: var(--color-white);
margin-left: 8px;
width: 24px;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import React, { FC, useCallback } from 'react';
import { useAsyncFn } from 'react-use';
import { useWalletContext } from 'context/WalletContext';
import { SputnikHttpService } from 'services/sputnik';

import { Icon } from 'components/Icon';
import { Button } from 'components/button/Button';
import { useModal } from 'components/modal';
import { SaveFcTemplateModal } from 'astro_2.0/features/ViewProposal/components/SaveFcTemplate/components/SaveFcTemplateModal';
import { LoadingIndicator } from 'astro_2.0/components/LoadingIndicator';

import { ProposalFeedItem } from 'types/proposal';

import styles from './SaveFcTemplate.module.scss';

interface Props {
proposal: ProposalFeedItem;
}

export const SaveFcTemplate: FC<Props> = ({ proposal }) => {
const { accountId } = useWalletContext();

const [{ loading }, getDaosList] = useAsyncFn(async () => {
return SputnikHttpService.getAccountDaos(accountId);
}, [accountId]);

const [showModal] = useModal(SaveFcTemplateModal);

const handleClick = useCallback(async () => {
const accountDaos = await getDaosList();

await showModal({ accountDaos, proposal });
}, [getDaosList, proposal, showModal]);

return (
<div className={styles.root}>
<Button
size="small"
variant="tertiary"
capitalize
className={styles.control}
onClick={handleClick}
>
<span className={styles.label}>Save template</span>
{loading ? (
<LoadingIndicator className={styles.loading} />
) : (
<Icon name="bookmark" className={styles.icon} />
)}
</Button>
</div>
);
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
@import 'styles/typography';
@import 'styles/mixins';

.modalRoot {
overflow: visible;
}

.root {
display: flex;
flex-direction: column;
}

.desc {
@extend %subtitle4;
margin: 0 0 24px;
}

.inputWrapper {
align-items: center;
display: flex;
margin-bottom: 24px;

.suffix {
margin-left: 12px;
}
}

.input.input {
height: unset;
padding: 6.5px 6px;

@include placeholder {
@extend %body2;
}
}

.listItem {
@extend %caption1;
}

.selectedItem.selectedItem {
@extend %body2;
display: flex;
justify-content: flex-start;
margin-right: 8px;
max-width: 140px;
overflow: hidden;
}

.menuClassName {
width: 100%;
}

.ellipsed {
@include ellipse-text;
}

.footer {
align-items: center;
display: flex;
justify-content: space-between;
margin: 24px 0 12px;
}
Loading

0 comments on commit b1ec781

Please sign in to comment.