Skip to content

Commit

Permalink
chore: migrate to lens v2
Browse files Browse the repository at this point in the history
  • Loading branch information
@bigint
bigint committed Oct 24, 2023
1 parent 53149e7 commit 2796721
Show file tree
Hide file tree
Showing 11 changed files with 324 additions and 115 deletions.
11 changes: 5 additions & 6 deletions src/components/UserMenu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,7 @@ import type { FC } from 'react';
import { Fragment } from 'react';
import { useAccount, useDisconnect } from 'wagmi';

import type { Profile } from '@/generated';
import { useProfilesQuery } from '@/generated';
import { type Profile, useProfilesManagedQuery } from '@/generated';
import formatAddress from '@/utils/formatAddress';
import getProfilePicture from '@/utils/getProfilePicture';

Expand All @@ -17,11 +16,11 @@ const UserMenu: FC = () => {
const { disconnect } = useDisconnect();
const { address } = useAccount();

const { data, loading } = useProfilesQuery({
variables: { request: { ownedBy: [address] } },
const { data, loading } = useProfilesManagedQuery({
variables: { request: { for: [address] } },
skip: !address
});
const profiles = data?.profiles.items as Profile[];
const profiles = data?.profilesManaged.items as Profile[];

if (loading) {
return <div className="animate pulse ml-3 h-8 w-8 rounded-full bg-gray-100 dark:bg-[#2C2B35]" />;
Expand All @@ -38,7 +37,7 @@ const UserMenu: FC = () => {
);
}

const defaultProfile = profiles.find((profile) => profile.isDefault);
const defaultProfile = profiles[0];

return (
<Menu as="div" className="relative ml-3 text-left">
Expand Down
2 changes: 1 addition & 1 deletion src/components/home/LatestTransactions.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ const LatestTransactions: FC = () => {
const daData = jsonData?.payload?.data;

if (daData) {
const txn = daData?.newDataAvailabilityTransaction as MomokaTransaction;
const txn = daData?.newMomokaTransaction as MomokaTransaction;
setLastFinalizedTransaction({ ...txn });
let oldTxns = [...(latestTransactions as MomokaTransaction[])];
oldTxns.unshift(txn);
Expand Down
18 changes: 9 additions & 9 deletions src/components/home/SearchBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ import clsx from 'clsx';
import Link from 'next/link';
import React, { useEffect, useRef, useState } from 'react';

import type { DataAvailabilityTransactionUnion } from '@/generated';
import { useDataAvailabilityTransactionLazyQuery } from '@/generated';
import type { MomokaTransaction } from '@/generated';
import { useMomokaTransactionLazyQuery } from '@/generated';
import { useAppPersistStore } from '@/store/app';
import { useRecentsPersistStore } from '@/store/recents';
import useDebounce from '@/utils/useDebounce';
Expand All @@ -15,7 +15,7 @@ import { Loader } from '../ui/Loader';
const SearchBar = () => {
const [keyword, setKeyword] = useState('');
const [inputClicked, setInputClicked] = useState(false);
const [txn, setTxn] = useState<DataAvailabilityTransactionUnion>();
const [txn, setTxn] = useState<MomokaTransaction>();

const selectedEnvironment = useAppPersistStore((state) => state.selectedEnvironment);
const recents = useRecentsPersistStore((state) => state.recents);
Expand All @@ -26,7 +26,7 @@ const SearchBar = () => {
const debouncedValue = useDebounce<string>(keyword, 500);
const inputElement = useRef<HTMLInputElement>(null);

const [fetchTxn, { loading }] = useDataAvailabilityTransactionLazyQuery();
const [fetchTxn, { loading }] = useMomokaTransactionLazyQuery();

useEffect(() => {
if (inputElement.current) {
Expand All @@ -37,13 +37,13 @@ const SearchBar = () => {
const onDebounce = async () => {
if (keyword.trim().length) {
const { data } = await fetchTxn({
variables: { request: { id: keyword.trim() as string } }
variables: { request: { for: keyword.trim() as string } }
});
setTxn(data?.dataAvailabilityTransaction as DataAvailabilityTransactionUnion);
setTxn(data?.momokaTransaction as MomokaTransaction);
}
};

const storeToRecents = (txn: DataAvailabilityTransactionUnion) => {
const storeToRecents = (txn: MomokaTransaction) => {
const data = {
network: selectedEnvironment.id,
...txn
Expand Down Expand Up @@ -96,7 +96,7 @@ const SearchBar = () => {
className="flex w-full items-center justify-between space-x-2 rounded-xl px-4 py-2 hover:bg-[#FFFFFF] hover:dark:bg-[#565467]"
>
<span>{txn?.transactionId}</span>{' '}
<span className="truncate text-xs opacity-50">{txn.publicationId}</span>
<span className="truncate text-xs opacity-50">{txn.publication.id}</span>
</Link>
</div>
) : recentsByNetwork.length && inputClicked && !loading ? (
Expand All @@ -111,7 +111,7 @@ const SearchBar = () => {
<ClockIcon className="h-4 w-4 flex-none" />
<span className="truncate">{recent.transactionId}</span>
</span>
<span className="hidden truncate text-xs opacity-50 lg:inline">{recent.publicationId}</span>
<span className="hidden truncate text-xs opacity-50 lg:inline">{recent.publication.id}</span>
</Link>
))}
</div>
Expand Down
8 changes: 6 additions & 2 deletions src/components/shared/Favorite.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import type { FC, ReactNode } from 'react';

import type { MomokaTransaction } from '@/generated';
import { useAppPersistStore } from '@/store/app';
import type { MomokaTransactionTransactionWithNetwork } from '@/store/favorites';
import { useFavoritesPersistStore } from '@/store/favorites';
import isInFavorites from '@/utils/isInFavorites';

Expand Down Expand Up @@ -29,8 +30,11 @@ const Favorite: FC<FavoriteProps> = ({ momokaTransaction, renderItem }) => {
e.stopPropagation();

isFavorite
? removeFavorite(momokaTransaction as MomokaTransaction, selectedEnvironment.id)
: addFavorite(momokaTransaction as MomokaTransaction, selectedEnvironment.id);
? removeFavorite(
momokaTransaction as MomokaTransactionTransactionWithNetwork,
selectedEnvironment.id
)
: addFavorite(momokaTransaction as MomokaTransactionTransactionWithNetwork, selectedEnvironment.id);
}}
>
{renderItem(isFavorite)}
Expand Down
4 changes: 3 additions & 1 deletion src/components/shared/Profile.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,9 @@ const Profile: FC<ProfileProps> = ({ profile }) => {
alt={profile?.handle}
/>
<div>
<div className="font-bold">{profile?.name ?? formatAddress(profile?.ownedBy)}</div>
<div className="font-bold">
{profile?.metadata?.displayName ?? formatAddress(profile?.ownedBy.address)}
</div>
<div className="text-xs">@{profile?.handle}</div>
</div>
</Link>
Expand Down
15 changes: 9 additions & 6 deletions src/components/shared/TxnProfile.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,31 +24,34 @@ const TxnProfile: FC<TxnProfileProps> = ({ profile }) => {
<div>
<div>
<h1 className="text-2xl font-medium opacity-90">
{profile.name ?? formatAddress(profile.ownedBy)}
{profile.metadata?.displayName ?? formatAddress(profile.ownedBy.address)}
</h1>
<h3 className="text-sm font-medium opacity-60">@{profile.handle}</h3>
<p className="mt-3 text-sm font-medium opacity-60">{profile.bio ?? ''}</p>
<h3 className="text-sm font-medium opacity-60">@{profile.handle || profile.id}</h3>
<p className="mt-3 text-sm font-medium opacity-60">{profile.metadata?.bio ?? ''}</p>
</div>
</div>
</div>
<div className="hidden space-y-2 text-sm lg:block">
<div className="flex items-center space-x-3">
<UsersIcon className="h-4 w-4" />
<div>
<b> {profile.stats.totalPosts + profile.stats.totalComments + profile.stats.totalMirrors}</b>{' '}
<b>
{' '}
{profile.stats.posts + profile.stats.comments + profile.stats.mirrors + profile.stats.quotes}
</b>{' '}
publications
</div>
</div>
<div className="flex items-center space-x-3">
<UsersIcon className="h-4 w-4" />
<div>
<b>{profile.stats.totalFollowers}</b> followers
<b>{profile.stats.followers}</b> followers
</div>
</div>
<div className="flex items-center space-x-3">
<UserPlusIcon className="h-4 w-4" />
<div>
<b>{profile.stats.totalFollowing}</b> followings
<b>{profile.stats.following}</b> followings
</div>
</div>
</div>
Expand Down
115 changes: 115 additions & 0 deletions src/generated.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6088,6 +6088,67 @@ export type ProfileQuery = {
} | null;
};

export type ProfilesManagedQueryVariables = Exact<{
request: ProfilesManagedRequest;
}>;

export type ProfilesManagedQuery = {
__typename?: 'Query';
profilesManaged: {
__typename?: 'PaginatedProfileResult';
items: Array<{
__typename?: 'Profile';
id: any;
handle?: any | null;
ownedBy: { __typename?: 'NetworkAddress'; address: any };
operations: {
__typename?: 'ProfileOperations';
id: any;
canBlock: boolean;
canUnblock: boolean;
canFollow: TriStateValue;
canUnfollow: boolean;
isBlockedByMe: { __typename?: 'OptimisticStatusResult'; value: boolean };
isFollowedByMe: { __typename?: 'OptimisticStatusResult'; value: boolean };
isFollowingMe: { __typename?: 'OptimisticStatusResult'; value: boolean };
};
stats: {
__typename?: 'ProfileStats';
id: any;
followers: number;
following: number;
comments: number;
posts: number;
mirrors: number;
quotes: number;
publications: number;
reactions: number;
reacted: number;
countOpenActions: number;
};
metadata?: {
__typename?: 'ProfileMetadata';
displayName?: string | null;
bio?: any | null;
rawURI: any;
appId?: any | null;
picture?:
| {
__typename?: 'ImageSet';
raw: { __typename?: 'Image'; uri: any };
optimized?: { __typename?: 'Image'; uri: any } | null;
}
| {
__typename?: 'NftImage';
image: { __typename?: 'ImageSet'; raw: { __typename?: 'Image'; uri: any } };
}
| null;
} | null;
}>;
pageInfo: { __typename?: 'PaginatedResultInfo'; next?: any | null };
};
};

export type PublicationQueryVariables = Exact<{
request: PublicationRequest;
}>;
Expand Down Expand Up @@ -6796,6 +6857,60 @@ export function useProfileLazyQuery(
export type ProfileQueryHookResult = ReturnType<typeof useProfileQuery>;
export type ProfileLazyQueryHookResult = ReturnType<typeof useProfileLazyQuery>;
export type ProfileQueryResult = Apollo.QueryResult<ProfileQuery, ProfileQueryVariables>;
export const ProfilesManagedDocument = gql`
query ProfilesManaged($request: ProfilesManagedRequest!) {
profilesManaged(request: $request) {
items {
...ProfileFields
}
pageInfo {
next
}
}
}
${ProfileFieldsFragmentDoc}
`;

/**
* __useProfilesManagedQuery__
*
* To run a query within a React component, call `useProfilesManagedQuery` and pass it any options that fit your needs.
* When your component renders, `useProfilesManagedQuery` returns an object from Apollo Client that contains loading, error, and data properties
* you can use to render your UI.
*
* @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
*
* @example
* const { data, loading, error } = useProfilesManagedQuery({
* variables: {
* request: // value for 'request'
* },
* });
*/
export function useProfilesManagedQuery(
baseOptions: Apollo.QueryHookOptions<ProfilesManagedQuery, ProfilesManagedQueryVariables>
) {
const options = { ...defaultOptions, ...baseOptions };
return Apollo.useQuery<ProfilesManagedQuery, ProfilesManagedQueryVariables>(
ProfilesManagedDocument,
options
);
}
export function useProfilesManagedLazyQuery(
baseOptions?: Apollo.LazyQueryHookOptions<ProfilesManagedQuery, ProfilesManagedQueryVariables>
) {
const options = { ...defaultOptions, ...baseOptions };
return Apollo.useLazyQuery<ProfilesManagedQuery, ProfilesManagedQueryVariables>(
ProfilesManagedDocument,
options
);
}
export type ProfilesManagedQueryHookResult = ReturnType<typeof useProfilesManagedQuery>;
export type ProfilesManagedLazyQueryHookResult = ReturnType<typeof useProfilesManagedLazyQuery>;
export type ProfilesManagedQueryResult = Apollo.QueryResult<
ProfilesManagedQuery,
ProfilesManagedQueryVariables
>;
export const PublicationDocument = gql`
query Publication($request: PublicationRequest!) {
publication(request: $request) {
Expand Down
Loading

0 comments on commit 2796721

Please sign in to comment.