Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Related links #1054

Open
wants to merge 14 commits into
base: dev/new_features
Choose a base branch
from
Open

Conversation

JaviviJR
Copy link

@JaviviJR JaviviJR commented Aug 22, 2024

Added new dynamic field in profile section witch let us to add related links.

#839

imagen

@BentiGorlich BentiGorlich linked an issue Aug 27, 2024 that may be closed by this pull request
@BentiGorlich BentiGorlich added enhancement New feature or request frontend Visual issues, improvements, bugs or other aspects relating mostly to the front end labels Aug 27, 2024
@BentiGorlich
Copy link
Member

Can you implement it the mastodon way where you have a name-link combination? So that each add link field has an associated name field.
grafik

@JaviviJR
Copy link
Author

JaviviJR commented Sep 3, 2024

Can you implement it the mastodon way where you have a name-link combination? So that each add link field has an associated name field. grafik

Do you want that user can add just links or whatever data user wants like Mastodon?

@BentiGorlich BentiGorlich added this to the v1.8.0 milestone Sep 4, 2024
@BentiGorlich
Copy link
Member

Limit it to links would be fine for me, but I don't think that it makes sense 🤔


#addButtonDeleteLink(item) {
const removeFormButton = document.createElement('button');
removeFormButton.innerText = '⌫';
Copy link
Member

Choose a reason for hiding this comment

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

I think overwriting innerHtml with the font awesome trashcan icon (https://fontawesome.com/icons/trash?f=classic&s=solid) would be better. Then you could also make it a button:

<div class="btn btn__secondary">
    <i class="fa-solid fa-trash"></i>
</div>

Copy link
Author

Choose a reason for hiding this comment

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

Modified

@@ -894,4 +897,14 @@ public function canUpdateUser(User $actor): bool
return $this->apDomain === $actor->apDomain;
}
}

public function getRelatedLinks(): array
Copy link
Member

Choose a reason for hiding this comment

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

Could you add phpDoc so we know which kind of array is returned? I really liked if the returned value would be of RelatedLink[] so an array of objects, so we can add some validation logic so we can mark links as "checked" or something so we know that the rel=me is actually correct

Copy link
Author

Choose a reason for hiding this comment

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

Discussed Discussed on element chat.
I don't know a elegant way to denormalize the json field from table and return it on get method. This'll required some dependencies inside entity that I think is not a good practice.
Instead, I created a RelatedLinkDTO class and this will be returned in UserDTO.

@melroy89
Copy link
Member

melroy89 commented Sep 7, 2024

Can you implement it the mastodon way where you have a name-link combination? So that each add link field has an associated name field. grafik

Agreed that would be helpful, so it's basically a key/value list.

{
$builder
->add('label', TextType::class)
->add('link', UrlType::class)
Copy link
Member

Choose a reason for hiding this comment

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

The url type force this value to be a url. Even if I insert something normal, it still comes out as a url. In general I think this variable/field should be called value instead

Copy link
Author

Choose a reason for hiding this comment

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

modified link by value

Copy link
Member

@BentiGorlich BentiGorlich left a comment

Choose a reason for hiding this comment

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

I'd love if the add button would something like this (but that is not a requirement):
grafik

I noticed that the links are not yet displayed on the profile page. Are you planning on adding that in this PR?
(The activity pub representation of the fields is also missing, but I expected to do that myself anyways :) but if you'd like to try that as well, feel free to do so)

class RelatedLinkDTO
{
private string $label;
private string $link;
Copy link
Member

Choose a reason for hiding this comment

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

Same here

Suggested change
private string $link;
private string $value;

Copy link
Author

Choose a reason for hiding this comment

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

modified

{
private string $label;
private string $link;
private bool $verified = false;
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
private bool $verified = false;
private bool $verifiedLink = false;

Copy link
Author

Choose a reason for hiding this comment

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

modified

return $this->relatedLinks;
}

public function setRelatedLinks(array $relatedLinks): void
Copy link
Member

Choose a reason for hiding this comment

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

This one is actually not used. Maybe make the variable private and use this one?

Copy link
Author

Choose a reason for hiding this comment

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

deleted

Comment on lines 27 to 28
// $temp = $this->denormalizer->denormalize($user->getRelatedLinks(), sprintf('%s[]', RelatedLinkDTO::class));

Copy link
Member

Choose a reason for hiding this comment

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

need to be removed

Copy link
Author

Choose a reason for hiding this comment

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

deleted

this.indexValue++;
}

#addButtonDeleteLink(item) {
Copy link
Member

Choose a reason for hiding this comment

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

What is this hashtag for?

Copy link
Author

@JaviviJR JaviviJR Sep 16, 2024

Choose a reason for hiding this comment

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

Define a method private

imagen

https://railsdesigner.com/proper-stimulus-controllers/

Could be added on a utility file.

Copy link
Member

Choose a reason for hiding this comment

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

Comment on lines 553 to 560
.related-link-row button {
padding: 0;
background: none;
font-size: 1.5rem;
border: 0;
color: var(--kbin-input-text-color);

}
Copy link
Member

Choose a reason for hiding this comment

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

please remove that and add the class btn__secondary to the trash icon buttons. Then they will look like other buttons in our UI

Copy link
Author

Choose a reason for hiding this comment

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

modified

@@ -890,3 +890,4 @@ admin_users_suspended: Suspended
admin_users_banned: Banned
user_verify: Activate account
max_image_size: Maximum file size
related_links: Related links
Copy link
Member

Choose a reason for hiding this comment

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

Please keep newlines at the end of files

@BentiGorlich
Copy link
Member

Oh and please change the target of the PR to dev/new_features

@JaviviJR JaviviJR force-pushed the related-links branch 2 times, most recently from edc97fa to 481b0f7 Compare September 16, 2024 16:58
@JaviviJR JaviviJR changed the base branch from main to dev/new_features September 16, 2024 16:58
@JaviviJR JaviviJR force-pushed the related-links branch 2 times, most recently from ffbdc54 to 98ed7e1 Compare September 16, 2024 17:38
Added new dynamic field in profile section witch let us to add related links.
@JaviviJR
Copy link
Author

JaviviJR commented Sep 16, 2024

I'd love if the add button would something like this (but that is not a requirement): grafik

I noticed that the links are not yet displayed on the profile page. Are you planning on adding that in this PR? (The activity pub representation of the fields is also missing, but I expected to do that myself anyways :) but if you'd like to try that as well, feel free to do so)

imagen

Check it out with the new changes.
I tried to keep it centered in vertical line which separate the two fields, but I couldn't.

Also I modified userBox component to show related links in profile.

imagen

@BentiGorlich
Copy link
Member

First of all thanks for your time and effort ❤️
I will have a look at it in the next days.

From your comment and screenshots I (already) have a few remarks (sorry 🙈):

I tried to keep it centered in vertical line which separate the two fields, but I couldn't.

I think I did it by making a div with a margin left the same size as the buttons and then just put text-align: center in there.

I modified userBox component to show related links in profile.

What happens when the value is not a link?

@melroy89
Copy link
Member

There is a conflict with translations/messages.es.yaml. Ideally only change the English language file. And translate the rest in Weblate.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request frontend Visual issues, improvements, bugs or other aspects relating mostly to the front end
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Set rel="me" links on profile
3 participants