# Detailed Media Attachment Component

The Detailed Media Attachment Component allows users to add media and files to a post when creating or editing it in the [AmityPostComposerPage](https://app.gitbook.com/o/-LC7aYJfVrBgEkQp-YT8/s/-MX0mOAVWkotGme0iRzu/~/changes/3277/amity-uikit/uikit-v4-beta/social/post-composer-page).

<figure><img src="https://2352509137-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MX0mOAVWkotGme0iRzu%2Fuploads%2FNbrurtNcLZ68WfItslIg%2FScreenshot%202024-07-17%20at%206.37.22%E2%80%AFPM.png?alt=media&#x26;token=b439a40c-ef11-43f0-ae35-a60e34acb317" alt=""><figcaption></figcaption></figure>

### Features <a href="#features" id="features"></a>

<table data-header-hidden><thead><tr><th width="347"></th><th></th></tr></thead><tbody><tr><td>Feature</td><td>Description</td></tr><tr><td>Attach media and files</td><td>User can use this component to attach media and files to a post.</td></tr></tbody></table>

### Customization

This component allows user to fully customize on these items.

<table><thead><tr><th width="213">Config ID</th><th width="110">Type</th><th>Description</th></tr></thead><tbody><tr><td>post_composer_page/detailed_media_attachment/*</td><td>Theme</td><td>User can change component theme.</td></tr><tr><td>post_composer_page/detailed_media_attachment/camera_button</td><td>Elemet</td><td>User can change camera button icon and wording.</td></tr><tr><td>post_composer_page/detailed_media_attachment/image_button</td><td>Element</td><td>User can change photo button icon and wording.</td></tr><tr><td>post_composer_page/detailed_media_attachment/video_button</td><td>Element</td><td>User can change vide button icon and wording.</td></tr><tr><td>post_composer_page/detailed_media_attachment/file_button</td><td>Element</td><td>User can change attachment button icon and wording.</td></tr></tbody></table>

For more details on customization, please refer to the [Customization](https://docs.social.plus/social-plus-uikit/uikit-4/customization) page.

### Usage <a href="#usage" id="usage"></a>

The Detailed Media Attachment Component can be used in this way if the user wants to use it separately.

{% tabs %}
{% tab title="iOS" %}
{% embed url="<https://gist.github.com/amythee/ff80a29203160d5fc20704a7b09de495>" %}
{% endtab %}

{% tab title="Android" %}
{% embed url="<https://gist.github.com/46781a6184584dd289482418c3148e93>" %}
{% endtab %}

{% tab title="Web" %}
{% embed url="<https://gist.github.com/amythee/5c8e04686cd2f5e2fcfba25f976b1e8c>" %}

{% endtab %}

{% tab title="React Native" %}
{% embed url="<https://gist.github.com/amythee/193a12ef8f7aea1032e8884898ed2193>" %}
{% endtab %}

{% tab title="Flutter" %}
{% embed url="<https://gist.github.com/amythee/2a5181ff0e3c6bc70c95be2a1ff9f069>" %}
{% endtab %}
{% endtabs %}