diff --git a/public/static/orgdefault.png b/public/static/orgdefault.png new file mode 100644 index 00000000..8f898860 Binary files /dev/null and b/public/static/orgdefault.png differ diff --git a/src/__test__/__mockData__/organization.ts b/src/__test__/__mockData__/organization.ts new file mode 100644 index 00000000..59d938a6 --- /dev/null +++ b/src/__test__/__mockData__/organization.ts @@ -0,0 +1,20 @@ +import { Organization } from 'store/main'; + +export const organizations: Organization[] = [ + { + created: "2024-01-18T17:10:43.329567Z", + deleted: false, + description: "This is a test organization for the Org Homepage Epic.", + github: "https://github.com/stakwork/sphinx-tribes", + id: "67", + img: "https://memes.sphinx.chat/public/UPWRvxiceSND60S9_7XwQGtj8MmPsQ1_ijX8aUR7kZ8=", + name: "E's Fun Club", + owner_pubkey: "021ae436bcd40ca21396e59be8cdb5a707ceacdb35c1d2c5f23be7584cab29c40b", + show: false, + updated: "2024-01-18T17:10:43.329567Z", + uuid: "cmkln4tm098m49vhlt80", + website: "https://ecurrencyhodler.com/", + } +]; + +export const organization = organizations[0]; \ No newline at end of file diff --git a/src/pages/tickets/org/OrgTickets.tsx b/src/pages/tickets/org/OrgTickets.tsx index a424949c..59e4c341 100644 --- a/src/pages/tickets/org/OrgTickets.tsx +++ b/src/pages/tickets/org/OrgTickets.tsx @@ -24,7 +24,7 @@ function OrgBodyComponent() { const [checkboxIdToSelectedMapLanguage, setCheckboxIdToSelectedMapLanguage] = useState({}); const { uuid } = useParams<{ uuid: string; bountyId: string }>(); const [languageString, setLanguageString] = useState(''); - const [organizationUrls, setOrganizationUrls] = useState({}); + const [organizationData, setOrganizationData] = useState({}); const color = colors['light']; @@ -42,8 +42,8 @@ function OrgBodyComponent() { resetPage: true, languages: languageString }); - const orgUrls = await api.get(`organizations/${uuid}`); - setOrganizationUrls(orgUrls); + const orgData = await api.get(`organizations/${uuid}`); + setOrganizationData(orgData); } setLoading(false); })(); @@ -167,7 +167,7 @@ function OrgBodyComponent() { }} > ` const Status = ['Open', 'Assigned', 'Completed', 'Paid']; export const OrgHeader = ({ + organizationData, onChangeLanguage, checkboxIdToSelectedMapLanguage, onChangeStatus, checkboxIdToSelectedMap, org_uuid, - languageString, - organizationUrls + languageString }: OrgBountyHeaderProps) => { const { main, ui } = useStores(); const [isPostBountyModalOpen, setIsPostBountyModalOpen] = useState(false); @@ -447,7 +520,14 @@ export const OrgHeader = ({ const selectedWidget = 'wanted'; const filterRef = useRef(null); - const { website, github } = organizationUrls; + + const handlePostBountyClick = () => { + setIsPostBountyModalOpen(true); + }; + const handlePostBountyClose = () => { + setIsPostBountyModalOpen(false); + }; + useEffect(() => { if (org_uuid) { @@ -460,6 +540,7 @@ export const OrgHeader = ({ } }, [org_uuid, checkboxIdToSelectedMap, main, languageString]); + const handleClick = () => { setFilterClick(!filterClick); }; @@ -484,26 +565,45 @@ export const OrgHeader = ({ <>
- - {website !== '' ? ( - window.open(website, '_blank')}> - - Website - - ) : null} - {github !== '' ? ( - window.open(github, '_blank')}> - - Github - - ) : null} - - {canPostBounty && ( - - )} + + + + + {organizationData?.name || ''} + + { + organizationData?.github && + + globe-website icon + Website + + } + { + organizationData?.website && + + {' '} + github icon + Github + + } + + + + + + + {organizationData?.description || ''} + + + + {canPostBounty && ( + + )} + +
diff --git a/src/people/interfaces.ts b/src/people/interfaces.ts index 92c4eca5..0a8e1958 100644 --- a/src/people/interfaces.ts +++ b/src/people/interfaces.ts @@ -16,7 +16,7 @@ export interface BountyModalProps { } export interface OrgBountyHeaderProps { - organizationUrls: any; + organizationData: any; } export interface FocusViewProps { diff --git a/src/people/widgetViews/__tests__/OrgHeader.spec.tsx b/src/people/widgetViews/__tests__/OrgHeader.spec.tsx index 8079fc4a..049e0ddd 100644 --- a/src/people/widgetViews/__tests__/OrgHeader.spec.tsx +++ b/src/people/widgetViews/__tests__/OrgHeader.spec.tsx @@ -39,9 +39,19 @@ const MockProps: OrgBountyHeaderProps = { org_uuid: 'clf6qmo4nncmf23du7ng', onChangeStatus: jest.fn(), onChangeLanguage: jest.fn(), - organizationUrls: { - github: 'https://github.com/stakwork/sphinx-tribes', - website: 'https://ecurrencyhodler.com/' + organizationData: { + created: "2024-01-18T17:10:43.329567Z", + deleted: false, + description: "This is a test organization for the Org Homepage Epic.", + github: "https://github.com/stakwork/sphinx-tribes", + id: "67", + img: "https://memes.sphinx.chat/public/UPWRvxiceSND60S9_7XwQGtj8MmPsQ1_ijX8aUR7kZ8=", + name: "E's Fun Club", + owner_pubkey: "021ae436bcd40ca21396e59be8cdb5a707ceacdb35c1d2c5f23be7584cab29c40b", + show: false, + updated: "2024-01-18T17:10:43.329567Z", + uuid: "cmkln4tm098m49vhlt80", + website: "https://ecurrencyhodler.com/", } }; describe('OrgHeader Component', () => { @@ -154,4 +164,10 @@ describe('OrgHeader Component', () => { const containerStyle = window.getComputedStyle(urlButtonContainer); expect(containerStyle.marginLeft).toBe('0px'); }); + + it('renders the component with organization logo and name', async () => { + render( ); + waitFor(() => expect(screen.findByText(MockProps.organizationData.name)).toBeInTheDocument()); + waitFor(() => expect(screen.findByAltText(`${MockProps.organizationData.name} logo`)).toBeInTheDocument()); + }); }); diff --git a/src/store/main.ts b/src/store/main.ts index 41a996a4..b86ed6c7 100644 --- a/src/store/main.ts +++ b/src/store/main.ts @@ -2070,6 +2070,25 @@ export class MainStore { } } + //for a user who is not logged in + async getOrganizationByUuid(uuid: string): Promise { + try { + const r: any = await fetch(`${TribesURL}/organizations/${uuid}`, { + method: 'GET', + mode: 'cors', + headers: { + 'Content-Type': 'application/json' + } + }); + + const data = await r.json(); + return await data; + } catch (e) { + console.log('Error getOrganizationByUuid', e); + return undefined; + } + } + @action async addOrganization(body: CreateOrganizationInput): Promise { try { if (!uiStore.meInfo) return null;