> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# إخفاء أسطر السلة وإعادة تسميتها

> حالة استخدام لـ Cart SDK باستخدام محوّلات الأسطر والمقارِنات لإخفاء الأسطر التي تحقنها التطبيقات وإعادة تسميتها والتحكم في ترتيب عرضها.

أخفِ الأسطر التي لا ينبغي للمتسوق رؤيتها، وأعد تسمية الأسطر التي تُقرأ بشكل سيئ، وتحكّم في ترتيب عرض كل شيء، كل ذلك دون المساس بما هو موجود فعليًا في السلة.

هذا يحل محل النمط القديم لإخفاء عناصر السلة باستخدام CSS أو `style.display = 'none'`. يُطبَّق محوّل السطر في كل مرة تُعرض فيها السلة، لذا يصمد أمام التحديثات وإعادة العرض وإعادة فتح الدُرج.

<div id="hide-a-line">
  ## إخفاء سطر
</div>

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
// Hide free lines from the drawer. The cart total is unchanged.
window.aftersell.cart.hooks.registerLineTransform((line) => {
  if (line.finalLinePrice === 0) {
    line.setHidden(true);
  }
});
```

<Warning>
  **الإخفاء ليس إزالة.** السطر المخفي يبقى في سلة المتسوق، ويبقى في الإجمالي، ويصل إلى الدفع؛ إنه فقط لا يُرسم في الدُرج. لكنه يخرج من `getCart().items` ومن `itemCount`، لذا تتوقف تعليماتك البرمجية عن رؤيته أيضًا. إذا أردت إزالته فعليًا، استخدم [`removeItem`](/ar/aftersell/cart/sdk-actions#removeitemkey).
</Warning>

أشياء شائعة تستحق الإخفاء:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.hooks.registerLineTransform((line) => {
  // An app-injected line, tagged with a private property.
  if (line.properties?._bundle_child) {
    line.setHidden(true);
  }

  // A specific SKU that shouldn't be shopper-managed.
  if (line.variantId === HIDDEN_VARIANT_ID) {
    line.setHidden(true);
  }

  // Gift cards issued by a loyalty app.
  if (line.isGiftCard && line.finalLinePrice === 0) {
    line.setHidden(true);
  }
});
```

<div id="relabel-a-line">
  ## إعادة تسمية سطر
</div>

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.hooks.registerLineTransform((line) => {
  // Flag discounted lines.
  if (line.finalLinePrice < line.originalLinePrice) {
    line.setTitle(`${line.title} (On sale)`);
  }

  // Make the subscription cadence read naturally.
  if (line.sellingPlan) {
    line.setVariantTitle(`Delivered ${line.sellingPlan.name.toLowerCase()}`);
  }

  // Drop a meaningless variant label.
  if (line.variantTitle === 'Default Title') {
    line.setVariantTitle(null);
  }
});
```

المُعدِّلات الأربعة المتاحة على السطر:

| المُعدِّل                         | التأثير                                                                                                                           |
| --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- |
| `setHidden(bool)`                 | إخفاء السطر من الدُرج.                                                                                                            |
| `setTitle(string)`                | تغيير العنوان المعروض.                                                                                                            |
| `setVariantTitle(string \| null)` | تغيير تسمية المتغير المعروضة. `null` تزيلها.                                                                                      |
| `setInternalProperties(obj)`      | دمج خصائص للعرض فقط، لتقرأها [كتلة التعليمات البرمجية المخصصة](/ar/aftersell/cart/custom-code-blocks). لا تُحفظ أبدًا في Shopify. |

<div id="control-the-order">
  ## التحكم في الترتيب
</div>

يأخذ المقارِن نفس الشكل الذي تتوقعه `Array.prototype.sort`، ويعمل بعد الإخفاء وإعادة التسمية:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
// Subscriptions first, then everything else.
window.aftersell.cart.hooks.registerLineComparator((lineA, lineB) => {
  return (lineB.sellingPlan ? 1 : 0) - (lineA.sellingPlan ? 1 : 0);
});
```

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
// Push free gifts and add-ons to the bottom.
window.aftersell.cart.hooks.registerLineComparator((lineA, lineB) => {
  return (lineA.finalLinePrice === 0 ? 1 : 0) - (lineB.finalLinePrice === 0 ? 1 : 0);
});
```

أعد `0` للأزواج التي لا تهمك. تتراكب المقارِنات كفواصل تعادل، بحيث يقرر أول من يعيد قيمة غير صفرية مصير ذلك الزوج، بينما إعادة `0` تسلّم القرار إلى المقارِن التالي بدلًا من فرض ترتيب عليه.

<div id="hide-a-whole-block-not-a-line">
  ## إخفاء كتلة كاملة، وليس سطرًا
</div>

يعمل محوّل السطر على أسطر السلة. لعرض إعدادات **كتلة** مختلفة حسب الدولة أو السوق أو العملة (مثلًا مستويات Rewards مختلفة)، استخدم [الشروط في محرر السلة](/ar/aftersell/cart/blocks-overview#show-or-hide-by-market-country-or-currency). لا حاجة إلى تعليمات برمجية، وهي تصمد أمام إعادة تصميم السلة. إجمالي السلة ومحتوياتها **ليسا** من أنواع شروط المحرر.

الجأ إلى SDK عندما تكون قاعدتك شيئًا لا تستطيع الشروط التعبير عنه (معرّفات المنتجات في السلة، إجمالي مخصص، وما إلى ذلك). في تلك الحالة، استعلم عن [الجذر الظلي](/ar/aftersell/cart/sdk-overview#shadowroot) بحثًا عن فئة `cart-external-*` عامة:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.events.on('cart_updated', (state) => {
  const root = window.aftersell.cart.shadowRoot;
  if (!root) return;

  const rewards = root.querySelector('.cart-external-rewards');
  if (!rewards) return;

  const hasExcluded = state.items.some((line) => EXCLUDED_PRODUCT_IDS.includes(line.productId));
  rewards.style.display = hasExcluded ? 'none' : '';
});
```

<Warning>
  يعمل هذا بعد كل عرض، لذا قد تومض الكتلة وتظهر قبل أن تخفيها تعليماتك البرمجية. العرض الشرطي لا يعاني من تلك المشكلة، لذا فضّله حيثما كان مناسبًا.
</Warning>

<div id="things-to-get-right">
  ## أمور يجب ضبطها بشكل صحيح
</div>

* **المحوّلات هي استدعاءات إعداد.** سجّلها في أعلى نص Initialization البرمجي؛ لا حاجة إلى `ready()`.
* **محوّلات الجميع تعمل.** يتراكب محوّلك مع أي محوّلات سجّلتها تطبيقات أخرى. لا يمكنك استبدال محوّلاتهم، ولا يمكنهم إسقاط محوّلك.
* **لا يستطيع المحوّل تغيير السعر أو الكمية أو الهوية.** فهو يغيّر ما يُعرض فقط. استخدم [الإجراءات](/ar/aftersell/cart/sdk-actions) للتغييرات الحقيقية.
* **المحوّل الذي يُلقي خطأً يُتخطى بصمت.** والبقية تستمر في العمل. تحقق من [`aftersellCartDebugEvents`](/ar/aftersell/cart/sdk-overview#debugging) أثناء التطوير.
* **تعيد `registerLineTransform` دالة إلغاء تسجيل**، إذا احتجت إلى التراجع عنه لاحقًا.

<div id="where-to-go-next">
  ## إلى أين تذهب بعد ذلك
</div>

* **[الخُطافات](/ar/aftersell/cart/sdk-hooks)**: المرجع الكامل للخُطافات.
* **[كائن السلة](/ar/aftersell/cart/sdk-cart-object)**: كل حقل يمكنك التفريع بناءً عليه.
* **[CSS المخصصة](/ar/aftersell/cart/custom-css)**: اصطلاح فئات `cart-external-*`.